From b4f444869e6b3f996e5f1d58d83a6c94f6caff0d Mon Sep 17 00:00:00 2001 From: Faris Nabiev Date: Thu, 12 Oct 2023 16:39:31 +0300 Subject: [PATCH 001/170] fix: add imperativeState and replace sequenceDb global variables with it --- .npmrc | 1 + .../src/diagrams/sequence/sequenceDb.js | 160 +++++++++--------- .../mermaid/src/utils/imperativeState.spec.ts | 78 +++++++++ packages/mermaid/src/utils/imperativeState.ts | 37 ++++ 4 files changed, 199 insertions(+), 77 deletions(-) create mode 100644 packages/mermaid/src/utils/imperativeState.spec.ts create mode 100644 packages/mermaid/src/utils/imperativeState.ts diff --git a/.npmrc b/.npmrc index 4c2f52b3b..e72930ead 100644 --- a/.npmrc +++ b/.npmrc @@ -1,2 +1,3 @@ +registry=https://registry.npmjs.org auto-install-peers=true strict-peer-dependencies=false diff --git a/packages/mermaid/src/diagrams/sequence/sequenceDb.js b/packages/mermaid/src/diagrams/sequence/sequenceDb.js index 6c3f1f64d..dbe8fdde5 100644 --- a/packages/mermaid/src/diagrams/sequence/sequenceDb.js +++ b/packages/mermaid/src/diagrams/sequence/sequenceDb.js @@ -2,57 +2,60 @@ import * as configApi from '../../config.js'; import { log } from '../../logger.js'; import { sanitizeText } from '../common/common.js'; import { - setAccTitle, - getAccTitle, - setDiagramTitle, - getDiagramTitle, - getAccDescription, - setAccDescription, clear as commonClear, + getAccDescription, + getAccTitle, + getDiagramTitle, + setAccDescription, + setAccTitle, + setDiagramTitle, } from '../common/commonDb.js'; +import { createImperativeState } from '../../utils/imperativeState.js'; -let prevActor = undefined; -let actors = {}; -let createdActors = {}; -let destroyedActors = {}; -let boxes = []; -let messages = []; -const notes = []; -let sequenceNumbersEnabled = false; -let wrapEnabled; -let currentBox = undefined; -let lastCreated = undefined; -let lastDestroyed = undefined; +const state = createImperativeState(() => ({ + prevActor: undefined, + actors: {}, + createdActors: {}, + destroyedActors: {}, + boxes: [], + messages: [], + notes: [], + sequenceNumbersEnabled: false, + wrapEnabled: undefined, + currentBox: undefined, + lastCreated: undefined, + lastDestroyed: undefined, +})); export const addBox = function (data) { - boxes.push({ + state.records.boxes.push({ name: data.text, wrap: (data.wrap === undefined && autoWrap()) || !!data.wrap, fill: data.color, actorKeys: [], }); - currentBox = boxes.slice(-1)[0]; + state.records.currentBox = state.records.boxes.slice(-1)[0]; }; export const addActor = function (id, name, description, type) { - let assignedBox = currentBox; - const old = actors[id]; + let assignedBox = state.records.currentBox; + const old = state.records.actors[id]; if (old) { // If already set and trying to set to a new one throw error - if (currentBox && old.box && currentBox !== old.box) { + if (state.records.currentBox && old.box && state.records.currentBox !== old.box) { throw new Error( 'A same participant should only be defined in one Box: ' + old.name + " can't be in '" + old.box.name + "' and in '" + - currentBox.name + + state.records.currentBox.name + "' at the same time." ); } // Don't change the box if already - assignedBox = old.box ? old.box : currentBox; + assignedBox = old.box ? old.box : state.records.currentBox; old.box = assignedBox; // Don't allow description nulling @@ -69,36 +72,42 @@ export const addActor = function (id, name, description, type) { description = { text: name, wrap: null, type }; } - actors[id] = { + state.records.actors[id] = { box: assignedBox, name: name, description: description.text, wrap: (description.wrap === undefined && autoWrap()) || !!description.wrap, - prevActor: prevActor, + prevActor: state.records.prevActor, links: {}, properties: {}, actorCnt: null, rectData: null, type: type || 'participant', }; - if (prevActor && actors[prevActor]) { - actors[prevActor].nextActor = id; + if (state.records.prevActor && state.records.actors[state.records.prevActor]) { + state.records.actors[state.records.prevActor].nextActor = id; } - if (currentBox) { - currentBox.actorKeys.push(id); + if (state.records.currentBox) { + state.records.currentBox.actorKeys.push(id); } - prevActor = id; + state.records.prevActor = id; }; const activationCount = (part) => { let i; let count = 0; - for (i = 0; i < messages.length; i++) { - if (messages[i].type === LINETYPE.ACTIVE_START && messages[i].from.actor === part) { + for (i = 0; i < state.records.messages.length; i++) { + if ( + state.records.messages[i].type === LINETYPE.ACTIVE_START && + state.records.messages[i].from.actor === part + ) { count++; } - if (messages[i].type === LINETYPE.ACTIVE_END && messages[i].from.actor === part) { + if ( + state.records.messages[i].type === LINETYPE.ACTIVE_END && + state.records.messages[i].from.actor === part + ) { count--; } } @@ -106,7 +115,7 @@ const activationCount = (part) => { }; export const addMessage = function (idFrom, idTo, message, answer) { - messages.push({ + state.records.messages.push({ from: idFrom, to: idTo, message: message.text, @@ -137,7 +146,7 @@ export const addSignal = function ( throw error; } } - messages.push({ + state.records.messages.push({ from: idFrom, to: idTo, message: message.text, @@ -149,63 +158,58 @@ export const addSignal = function ( }; export const hasAtLeastOneBox = function () { - return boxes.length > 0; + return state.records.boxes.length > 0; }; export const hasAtLeastOneBoxWithTitle = function () { - return boxes.some((b) => b.name); + return state.records.boxes.some((b) => b.name); }; export const getMessages = function () { - return messages; + return state.records.messages; }; export const getBoxes = function () { - return boxes; + return state.records.boxes; }; export const getActors = function () { - return actors; + return state.records.actors; }; export const getCreatedActors = function () { - return createdActors; + return state.records.createdActors; }; export const getDestroyedActors = function () { - return destroyedActors; + return state.records.destroyedActors; }; export const getActor = function (id) { - return actors[id]; + return state.records.actors[id]; }; export const getActorKeys = function () { - return Object.keys(actors); + return Object.keys(state.records.actors); }; export const enableSequenceNumbers = function () { - sequenceNumbersEnabled = true; + state.records.sequenceNumbersEnabled = true; }; export const disableSequenceNumbers = function () { - sequenceNumbersEnabled = false; + state.records.sequenceNumbersEnabled = false; }; -export const showSequenceNumbers = () => sequenceNumbersEnabled; +export const showSequenceNumbers = () => state.records.sequenceNumbersEnabled; export const setWrap = function (wrapSetting) { - wrapEnabled = wrapSetting; + state.records.wrapEnabled = wrapSetting; }; export const autoWrap = () => { // if setWrap has been called, use that value, otherwise use the value from the config // TODO: refactor, always use the config value let setWrap update the config value - if (wrapEnabled !== undefined) { - return wrapEnabled; + if (state.records.wrapEnabled !== undefined) { + return state.records.wrapEnabled; } return configApi.getConfig().sequence.wrap; }; export const clear = function () { - actors = {}; - createdActors = {}; - destroyedActors = {}; - boxes = []; - messages = []; - sequenceNumbersEnabled = false; + state.reset(); commonClear(); }; @@ -247,7 +251,7 @@ export const parseBoxData = function (str) { } } - const boxData = { + return { color: color, text: title !== undefined @@ -262,7 +266,6 @@ export const parseBoxData = function (str) { : undefined : undefined, }; - return boxData; }; export const LINETYPE = { @@ -321,8 +324,8 @@ export const addNote = function (actor, placement, message) { // eslint-disable-next-line unicorn/prefer-spread const actors = [].concat(actor, actor); - notes.push(note); - messages.push({ + state.records.notes.push(note); + state.records.messages.push({ from: actors[0], to: actors[1], message: message.text, @@ -414,7 +417,7 @@ function insertProperties(actor, properties) { * */ function boxEnd() { - currentBox = undefined; + state.records.currentBox = undefined; } export const addDetails = function (actorId, text) { @@ -468,7 +471,7 @@ export const apply = function (param) { } else { switch (param.type) { case 'sequenceIndex': - messages.push({ + state.records.messages.push({ from: undefined, to: undefined, message: { @@ -484,18 +487,18 @@ export const apply = function (param) { addActor(param.actor, param.actor, param.description, param.draw); break; case 'createParticipant': - if (actors[param.actor]) { + if (state.records.actors[param.actor]) { throw new Error( "It is not possible to have actors with the same id, even if one is destroyed before the next is created. Use 'AS' aliases to simulate the behavior" ); } - lastCreated = param.actor; + state.records.lastCreated = param.actor; addActor(param.actor, param.actor, param.description, param.draw); - createdActors[param.actor] = messages.length; + state.records.createdActors[param.actor] = state.records.messages.length; break; case 'destroyParticipant': - lastDestroyed = param.actor; - destroyedActors[param.actor] = messages.length; + state.records.lastDestroyed = param.actor; + state.records.destroyedActors[param.actor] = state.records.messages.length; break; case 'activeStart': addSignal(param.actor, undefined, undefined, param.signalType); @@ -519,25 +522,28 @@ export const apply = function (param) { addDetails(param.actor, param.text); break; case 'addMessage': - if (lastCreated) { - if (param.to !== lastCreated) { + if (state.records.lastCreated) { + if (param.to !== state.records.lastCreated) { throw new Error( 'The created participant ' + - lastCreated + + state.records.lastCreated + ' does not have an associated creating message after its declaration. Please check the sequence diagram.' ); } else { - lastCreated = undefined; + state.records.lastCreated = undefined; } - } else if (lastDestroyed) { - if (param.to !== lastDestroyed && param.from !== lastDestroyed) { + } else if (state.records.lastDestroyed) { + if ( + param.to !== state.records.lastDestroyed && + param.from !== state.records.lastDestroyed + ) { throw new Error( 'The destroyed participant ' + - lastDestroyed + + state.records.lastDestroyed + ' does not have an associated destroying message after its declaration. Please check the sequence diagram.' ); } else { - lastDestroyed = undefined; + state.records.lastDestroyed = undefined; } } addSignal(param.from, param.to, param.msg, param.signalType, param.activate); diff --git a/packages/mermaid/src/utils/imperativeState.spec.ts b/packages/mermaid/src/utils/imperativeState.spec.ts new file mode 100644 index 000000000..e78a7d495 --- /dev/null +++ b/packages/mermaid/src/utils/imperativeState.spec.ts @@ -0,0 +1,78 @@ +import { createImperativeState, domain } from './imperativeState.js'; + +describe('domain.optional', () => { + it('should set undefined without args', () => { + expect(domain.optional()).toBeUndefined(); + }); + + it('should set identity with args', () => { + const value = {}; + expect(domain.optional(value)).toEqual(value); + }); +}); + +describe('domain.identity', () => { + it('should set identity', () => { + const value = {}; + expect(domain.identity(value)).toEqual(value); + }); +}); + +describe('createImperativeState', () => { + it('should create state with values from initializer', () => { + const baz = { + flag: false, + }; + + const state = createImperativeState(() => ({ + foo: domain.optional(), + bar: domain.identity([]), + baz, + })); + + expect(state.records.foo).toBeUndefined(); + expect(state.records.bar).toEqual([]); + expect(state.records.baz).toBe(baz); + }); + + it('should update records', () => { + const state = createImperativeState(() => ({ + foo: domain.optional(), + bar: domain.identity([]), + baz: { + flag: false, + }, + })); + + state.records.foo = 5; + state.records.bar = ['hello']; + state.records.baz.flag = true; + + expect(state.records.foo).toEqual(5); + expect(state.records.bar).toEqual(['hello']); + expect(state.records.baz).toEqual({ + flag: true, + }); + }); + + it('should reset records', () => { + const state = createImperativeState(() => ({ + foo: domain.optional(), + bar: domain.identity([]), + baz: { + flag: false, + }, + })); + + state.records.foo = 5; + state.records.bar = ['hello']; + state.records.baz.flag = true; + state.reset(); + + expect(state.records.foo).toBeUndefined(); + expect(state.records.bar).toEqual([]); + expect(state.records.baz).toEqual({ + flag: false, + }); + }); +}); diff --git a/packages/mermaid/src/utils/imperativeState.ts b/packages/mermaid/src/utils/imperativeState.ts new file mode 100644 index 000000000..bc63844b1 --- /dev/null +++ b/packages/mermaid/src/utils/imperativeState.ts @@ -0,0 +1,37 @@ +export const createImperativeState = >(init: () => S) => { + const state = init(); + + return { + get records() { + return state; + }, + reset: () => { + Object.keys(state).forEach((key) => { + delete state[key]; + }); + Object.entries(init()).forEach(([key, value]: [keyof S, any]) => { + state[key] = value; + }); + }, + }; +}; + +export const domain = { + optional: (value?: V) => value, + identity: (value: V) => value, +} as const; + +/* +const state = createImperativeState(() => ({ + foo: domain.optional(), + bar: domain.identity([]), + baz: domain.optional(1), +})); + +typeof state.records: +{ + foo: string | undefined, // actual: undefined + bar: number[], // actual: [] + baz: number | undefined, // actual: 1 +} +*/ From 18ea27ac58afb342a78167fd59bae1db97a80f09 Mon Sep 17 00:00:00 2001 From: Faris Nabiev Date: Fri, 13 Oct 2023 00:02:46 +0300 Subject: [PATCH 002/170] chore: add e2e test that shows db cleanup problem --- cypress/helpers/util.ts | 6 ++-- .../rendering/sequencediagram.spec.js | 28 +++++++++++++++++ .../platform/render-diagram-after-error.html | 31 +++++++++++++++++++ 3 files changed, 62 insertions(+), 3 deletions(-) create mode 100644 cypress/platform/render-diagram-after-error.html diff --git a/cypress/helpers/util.ts b/cypress/helpers/util.ts index c656f638d..aed5d7973 100644 --- a/cypress/helpers/util.ts +++ b/cypress/helpers/util.ts @@ -10,7 +10,7 @@ interface CypressConfig { type CypressMermaidConfig = MermaidConfig & CypressConfig; interface CodeObject { - code: string; + code: string | string[]; mermaid: CypressMermaidConfig; } @@ -25,7 +25,7 @@ const batchId: string = : Cypress.env('CYPRESS_COMMIT') || Date.now().toString()); export const mermaidUrl = ( - graphStr: string, + graphStr: string | string[], options: CypressMermaidConfig, api: boolean ): string => { @@ -82,7 +82,7 @@ export const urlSnapshotTest = ( }; export const renderGraph = ( - graphStr: string, + graphStr: string | string[], options: CypressMermaidConfig = {}, api = false ): void => { diff --git a/cypress/integration/rendering/sequencediagram.spec.js b/cypress/integration/rendering/sequencediagram.spec.js index 765913824..ca53986e8 100644 --- a/cypress/integration/rendering/sequencediagram.spec.js +++ b/cypress/integration/rendering/sequencediagram.spec.js @@ -930,4 +930,32 @@ context('Sequence diagram', () => { }); }); }); + context('db clear', () => { + it('should render diagram after fixing destroy participant error', () => { + renderGraph([ + `sequenceDiagram + Alice->>Bob: Hello Bob, how are you ? + Bob->>Alice: Fine, thank you. And you? + create participant Carl + Alice->>Carl: Hi Carl! + create actor D as Donald + Carl->>D: Hi! + destroy Carl + Alice-xCarl: We are too many + destroy Bo + Bob->>Alice: I agree`, + `sequenceDiagram + Alice->>Bob: Hello Bob, how are you ? + Bob->>Alice: Fine, thank you. And you? + create participant Carl + Alice->>Carl: Hi Carl! + create actor D as Donald + Carl->>D: Hi! + destroy Carl + Alice-xCarl: We are too many + destroy Bob + Bob->>Alice: I agree`, + ]); + }); + }); }); diff --git a/cypress/platform/render-diagram-after-error.html b/cypress/platform/render-diagram-after-error.html new file mode 100644 index 000000000..0adbba052 --- /dev/null +++ b/cypress/platform/render-diagram-after-error.html @@ -0,0 +1,31 @@ + + + + + + Mermaid Quick Test Page + + + +
+ + + + From 985eda2deeb180972f2b25ff20c53156c1eccb4b Mon Sep 17 00:00:00 2001 From: Faris Nabiev Date: Fri, 13 Oct 2023 00:43:48 +0300 Subject: [PATCH 003/170] chore: add e2e test that shows db cleanup problem --- cypress/integration/rendering/sequencediagram.spec.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/cypress/integration/rendering/sequencediagram.spec.js b/cypress/integration/rendering/sequencediagram.spec.js index ca53986e8..fa1db3ab2 100644 --- a/cypress/integration/rendering/sequencediagram.spec.js +++ b/cypress/integration/rendering/sequencediagram.spec.js @@ -932,6 +932,10 @@ context('Sequence diagram', () => { }); context('db clear', () => { it('should render diagram after fixing destroy participant error', () => { + cy.on('uncaught:exception', (err) => { + return false; + }); + renderGraph([ `sequenceDiagram Alice->>Bob: Hello Bob, how are you ? From 6eae46b927e1568a072b14eb1da0202c465db661 Mon Sep 17 00:00:00 2001 From: Faris Nabiev Date: Fri, 13 Oct 2023 00:48:05 +0300 Subject: [PATCH 004/170] chore: remove unused e2e tests file --- .../platform/render-diagram-after-error.html | 31 ------------------- 1 file changed, 31 deletions(-) delete mode 100644 cypress/platform/render-diagram-after-error.html diff --git a/cypress/platform/render-diagram-after-error.html b/cypress/platform/render-diagram-after-error.html deleted file mode 100644 index 0adbba052..000000000 --- a/cypress/platform/render-diagram-after-error.html +++ /dev/null @@ -1,31 +0,0 @@ - - - - - - Mermaid Quick Test Page - - - -
- - - - From fc0ade29851bf403fcc1740d6d0bc91933d375a7 Mon Sep 17 00:00:00 2001 From: Faris Nabiev Date: Fri, 13 Oct 2023 12:07:36 +0300 Subject: [PATCH 005/170] chore(sequence): update doc for actors/participant creation/deletion fix --- cypress/integration/rendering/sequencediagram.spec.js | 2 +- docs/syntax/sequenceDiagram.md | 8 ++++++++ packages/mermaid/src/docs/syntax/sequenceDiagram.md | 8 ++++++++ 3 files changed, 17 insertions(+), 1 deletion(-) diff --git a/cypress/integration/rendering/sequencediagram.spec.js b/cypress/integration/rendering/sequencediagram.spec.js index fa1db3ab2..27e03da9c 100644 --- a/cypress/integration/rendering/sequencediagram.spec.js +++ b/cypress/integration/rendering/sequencediagram.spec.js @@ -930,7 +930,7 @@ context('Sequence diagram', () => { }); }); }); - context('db clear', () => { + context('render after error', () => { it('should render diagram after fixing destroy participant error', () => { cy.on('uncaught:exception', (err) => { return false; diff --git a/docs/syntax/sequenceDiagram.md b/docs/syntax/sequenceDiagram.md index fbfa59d13..1172e2994 100644 --- a/docs/syntax/sequenceDiagram.md +++ b/docs/syntax/sequenceDiagram.md @@ -131,6 +131,14 @@ sequenceDiagram Bob->>Alice: I agree ``` +#### Unfixable actor/participant creation/deletion error (v\+) + +If an error of the following type occurs when creating or deleting an actor/participant: + +> The destroyed participant **participant-name** does not have an associated destroying message after its declaration. Please check the sequence diagram. + +And fixing diagram code does not get rid of this error and rendering of all other diagrams results in the same error, then you need to update the mermaid version. + ### Grouping / Box The actor(s) can be grouped in vertical boxes. You can define a color (if not, it will be transparent) and/or a descriptive label using the following notation: diff --git a/packages/mermaid/src/docs/syntax/sequenceDiagram.md b/packages/mermaid/src/docs/syntax/sequenceDiagram.md index cdcdaffeb..5f312fee5 100644 --- a/packages/mermaid/src/docs/syntax/sequenceDiagram.md +++ b/packages/mermaid/src/docs/syntax/sequenceDiagram.md @@ -83,6 +83,14 @@ sequenceDiagram Bob->>Alice: I agree ``` +#### Unfixable actor/participant creation/deletion error (v+) + +If an error of the following type occurs when creating or deleting an actor/participant: + +> The destroyed participant **participant-name** does not have an associated destroying message after its declaration. Please check the sequence diagram. + +And fixing diagram code does not get rid of this error and rendering of all other diagrams results in the same error, then you need to update the mermaid version. + ### Grouping / Box The actor(s) can be grouped in vertical boxes. You can define a color (if not, it will be transparent) and/or a descriptive label using the following notation: From 3128ba73a0be2dc06122ca8c0b4bae884a884958 Mon Sep 17 00:00:00 2001 From: Faris Date: Mon, 16 Oct 2023 19:36:44 +0300 Subject: [PATCH 006/170] chore(sequence): Update packages/mermaid/src/docs/syntax/sequenceDiagram.md Co-authored-by: Sidharth Vinod --- packages/mermaid/src/docs/syntax/sequenceDiagram.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/mermaid/src/docs/syntax/sequenceDiagram.md b/packages/mermaid/src/docs/syntax/sequenceDiagram.md index 5f312fee5..e7df5d8c9 100644 --- a/packages/mermaid/src/docs/syntax/sequenceDiagram.md +++ b/packages/mermaid/src/docs/syntax/sequenceDiagram.md @@ -83,13 +83,13 @@ sequenceDiagram Bob->>Alice: I agree ``` -#### Unfixable actor/participant creation/deletion error (v+) +#### Unfixable actor/participant creation/deletion error If an error of the following type occurs when creating or deleting an actor/participant: > The destroyed participant **participant-name** does not have an associated destroying message after its declaration. Please check the sequence diagram. -And fixing diagram code does not get rid of this error and rendering of all other diagrams results in the same error, then you need to update the mermaid version. +And fixing diagram code does not get rid of this error and rendering of all other diagrams results in the same error, then you need to update the mermaid version to (v+). ### Grouping / Box From 3b5f5c78430640cfe048e947ac42e9994efd3cd2 Mon Sep 17 00:00:00 2001 From: Faris Nabiev Date: Mon, 16 Oct 2023 19:47:58 +0300 Subject: [PATCH 007/170] chore: fix autogen docs --- docs/syntax/sequenceDiagram.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/syntax/sequenceDiagram.md b/docs/syntax/sequenceDiagram.md index 1172e2994..2dff973e4 100644 --- a/docs/syntax/sequenceDiagram.md +++ b/docs/syntax/sequenceDiagram.md @@ -131,13 +131,13 @@ sequenceDiagram Bob->>Alice: I agree ``` -#### Unfixable actor/participant creation/deletion error (v\+) +#### Unfixable actor/participant creation/deletion error If an error of the following type occurs when creating or deleting an actor/participant: > The destroyed participant **participant-name** does not have an associated destroying message after its declaration. Please check the sequence diagram. -And fixing diagram code does not get rid of this error and rendering of all other diagrams results in the same error, then you need to update the mermaid version. +And fixing diagram code does not get rid of this error and rendering of all other diagrams results in the same error, then you need to update the mermaid version to (v\+). ### Grouping / Box From 3e098ab73b320626e0b48b542e420ad6311cc427 Mon Sep 17 00:00:00 2001 From: Ronid1 Date: Wed, 22 Nov 2023 18:27:47 -0800 Subject: [PATCH 008/170] sort links alphabetically --- docs/ecosystem/integrations-community.md | 188 +++++++++--------- .../docs/ecosystem/integrations-community.md | 188 +++++++++--------- 2 files changed, 188 insertions(+), 188 deletions(-) diff --git a/docs/ecosystem/integrations-community.md b/docs/ecosystem/integrations-community.md index 846ec51ac..d74918e61 100644 --- a/docs/ecosystem/integrations-community.md +++ b/docs/ecosystem/integrations-community.md @@ -18,48 +18,48 @@ Below are a list of community plugins and integrations created with Mermaid. ✅ = Native support +- [Atlassian Products](https://www.atlassian.com) + - [Mermaid for Confluence](https://marketplace.atlassian.com/apps/1224722/mermaid-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Integration for Confluence](https://marketplace.atlassian.com/apps/1222792/mermaid-integration-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Charts & Diagrams for Confluence](https://marketplace.atlassian.com/apps/1222572/) + - [Mermaid Diagrams for Confluence](https://marketplace.atlassian.com/apps/1226945/mermaid-diagrams-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Macro for Confluence](https://marketplace.atlassian.com/apps/1231150/mermaid-macro-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Live Editor for Confluence Cloud](https://marketplace.atlassian.com/apps/1231571/mermaid-live-editor-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Plugin for Confluence](https://marketplace.atlassian.com/apps/1214124/mermaid-plugin-for-confluence?hosting=server&tab=overview) + - [EliteSoft Mermaid Charts and Diagrams](https://marketplace.atlassian.com/apps/1227286/elitesoft-mermaid-charts-and-diagrams?hosting=cloud&tab=overview) + - [Auto convert diagrams in Jira](https://github.com/coddingtonbear/jirafs-mermaid) + - [Mermaid for Jira Cloud - Draw UML diagrams easily](https://marketplace.atlassian.com/apps/1223053/mermaid-for-jira-cloud-draw-uml-diagrams-easily?hosting=cloud&tab=overview) + - [Mermaid Charts & Diagrams for Jira](https://marketplace.atlassian.com/apps/1224537/) + - [CloudScript.io Addon](https://marketplace.atlassian.com/apps/1219878/cloudscript-io-mermaid-addon?hosting=cloud&tab=overview) +- [Azure Devops](https://docs.microsoft.com/en-us/azure/devops/project/wiki/wiki-markdown-guidance?view=azure-devops#add-mermaid-diagrams-to-a-wiki-page) ✅ +- [Deepdwn](https://billiam.itch.io/deepdwn) ✅ +- [GitBook](https://gitbook.com) + - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid) + - [Markdown with Mermaid CLI](https://github.com/miao1007/gitbook-plugin-mermaid-cli) + - [Mermaid plugin for GitBook](https://github.com/wwformat/gitbook-plugin-mermaid-pdf) +- [Gitea](https://gitea.io) ✅ - [GitHub](https://github.com) ✅ - [Using code blocks](https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/) ✅ - [GitHub action: Compile mermaid to image](https://github.com/neenjaw/compile-mermaid-markdown-action) - [svg-generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator) - [GitHub Writer](https://github.com/ckeditor/github-writer) - [GitLab](https://docs.gitlab.com/ee/user/markdown.html#diagrams-and-flowcharts) ✅ -- [Gitea](https://gitea.io) ✅ -- [Azure Devops](https://docs.microsoft.com/en-us/azure/devops/project/wiki/wiki-markdown-guidance?view=azure-devops#add-mermaid-diagrams-to-a-wiki-page) ✅ +- [Mermaid Plugin for JetBrains IDEs](https://plugins.jetbrains.com/plugin/20146-mermaid) +- [Joplin](https://joplinapp.org) ✅ +- [LiveBook](https://livebook.dev) ✅ - [Tuleap](https://docs.tuleap.org/user-guide/writing-in-tuleap.html#graphs) ✅ - [Mermaid Flow Visual Editor](https://www.mermaidflow.app) ✅ -- [Deepdwn](https://billiam.itch.io/deepdwn) ✅ -- [Joplin](https://joplinapp.org) ✅ +- [mermerd](https://github.com/KarnerTh/mermerd) - [Slab](https://slab.com) ✅ - [Swimm](https://swimm.io) ✅ +- [NotesHub](https://noteshub.app) ✅ - [Notion](https://notion.so) ✅ - [Observable](https://observablehq.com/@observablehq/mermaid) ✅ - [Obsidian](https://help.obsidian.md/Editing+and+formatting/Advanced+formatting+syntax#Diagram) ✅ -- [NotesHub](https://noteshub.app) ✅ -- [GitBook](https://gitbook.com) - - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid) - - [Markdown with Mermaid CLI](https://github.com/miao1007/gitbook-plugin-mermaid-cli) - - [Mermaid plugin for GitBook](https://github.com/wwformat/gitbook-plugin-mermaid-pdf) -- [LiveBook](https://livebook.dev) ✅ -- [Atlassian Products](https://www.atlassian.com) - - [Mermaid for Confluence](https://marketplace.atlassian.com/apps/1224722/mermaid-for-confluence?hosting=cloud&tab=overview) - - [Mermaid Integration for Confluence](https://marketplace.atlassian.com/apps/1222792/mermaid-integration-for-confluence?hosting=cloud&tab=overview) - - [Mermaid Diagrams for Confluence](https://marketplace.atlassian.com/apps/1226945/mermaid-diagrams-for-confluence?hosting=cloud&tab=overview) - - [Mermaid Macro for Confluence](https://marketplace.atlassian.com/apps/1231150/mermaid-macro-for-confluence?hosting=cloud&tab=overview) - - [EliteSoft Mermaid Charts and Diagrams](https://marketplace.atlassian.com/apps/1227286/elitesoft-mermaid-charts-and-diagrams?hosting=cloud&tab=overview) - - [Mermaid for Jira Cloud - Draw UML diagrams easily](https://marketplace.atlassian.com/apps/1223053/mermaid-for-jira-cloud-draw-uml-diagrams-easily?hosting=cloud&tab=overview) - - [Mermaid Charts & Diagrams for Confluence](https://marketplace.atlassian.com/apps/1222572/) - - [Mermaid Charts & Diagrams for Jira](https://marketplace.atlassian.com/apps/1224537/) - - [Mermaid Live Editor for Confluence Cloud](https://marketplace.atlassian.com/apps/1231571/mermaid-live-editor-for-confluence?hosting=cloud&tab=overview) - - [Mermaid Plugin for Confluence](https://marketplace.atlassian.com/apps/1214124/mermaid-plugin-for-confluence?hosting=server&tab=overview) - - [CloudScript.io Addon](https://marketplace.atlassian.com/apps/1219878/cloudscript-io-mermaid-addon?hosting=cloud&tab=overview) - - [Auto convert diagrams in Jira](https://github.com/coddingtonbear/jirafs-mermaid) - [Redmine](https://redmine.org) - [Mermaid Macro](https://www.redmine.org/plugins/redmine_mermaid_macro) - [redmine-mermaid](https://github.com/styz/redmine_mermaid) - [markdown-for-mermaid-plugin](https://github.com/jamieh-mongolian/markdown-for-mermaid-plugin) -- [Mermaid Plugin for JetBrains IDEs](https://plugins.jetbrains.com/plugin/20146-mermaid) -- [mermerd](https://github.com/KarnerTh/mermerd) - Visual Studio Code [Polyglot Interactive Notebooks](https://github.com/dotnet/interactive#net-interactive) ### CRM/ERP @@ -72,27 +72,27 @@ Customer Relationship Management/Enterprise Resource Planning Blogging frameworks and platforms -- [WordPress](https://wordpress.org) - - [WordPress Markdown Editor](https://wordpress.org/plugins/wp-githuber-md) - - [WP-ReliableMD](https://wordpress.org/plugins/wp-reliablemd/) - [Hexo](https://hexo.io) - [hexo-filter-mermaid-diagrams](https://github.com/webappdevelp/hexo-filter-mermaid-diagrams) - [hexo-tag-mermaid](https://github.com/JameChou/hexo-tag-mermaid) - [hexo-mermaid-diagrams](https://github.com/mslxl/hexo-mermaid-diagrams) - [Nextra](https://nextra.site/) - [Mermaid](https://nextra.site/docs/guide/mermaid) +- [WordPress](https://wordpress.org) + - [WordPress Markdown Editor](https://wordpress.org/plugins/wp-githuber-md) + - [WP-ReliableMD](https://wordpress.org/plugins/wp-reliablemd/) ### CMS/ECM Content Management Systems/Enterprise Content Management +- [Grav CMS](https://getgrav.org/) + - [Mermaid Diagrams](https://github.com/DanielFlaum/grav-plugin-mermaid-diagrams) + - [GitLab Markdown Adapter](https://github.com/Goutte/grav-plugin-gitlab-markdown-adapter) - [VitePress](https://vitepress.vuejs.org/) - [Plugin for Mermaid.js](https://emersonbottero.github.io/vitepress-plugin-mermaid/) - [VuePress](https://vuepress.vuejs.org/) - [Plugin for Mermaid.js](https://github.com/eFrane/vuepress-plugin-mermaidjs) -- [Grav CMS](https://getgrav.org/) - - [Mermaid Diagrams](https://github.com/DanielFlaum/grav-plugin-mermaid-diagrams) - - [GitLab Markdown Adapter](https://github.com/Goutte/grav-plugin-gitlab-markdown-adapter) ### Communication @@ -102,31 +102,66 @@ Communication tools and platforms - [Mermaid Plugin](https://github.com/pnewell/discourse-mermaid), [And](https://github.com/unfoldingWord-dev/discourse-mermaid) - [Mattermost](https://mattermost.com/) - [Mermaid Plugin](https://github.com/SpikeTings/Mermaid) -- [phpBB](https://phpbb.com) - - [phpbb-ext-mermaid](https://github.com/AlfredoRamos/phpbb-ext-mermaid) - [NodeBB](https://nodebb.org) - [Mermaid Plugin](https://www.npmjs.com/package/nodebb-plugin-mermaid) +- [phpBB](https://phpbb.com) + - [phpbb-ext-mermaid](https://github.com/AlfredoRamos/phpbb-ext-mermaid) - [Slack](https://slack.com) - [Mermaid for Slack](https://github.com/JackuB/mermaid-for-slack) ### Wikis +- [DokuWiki](https://dokuwiki.org) + - [Mermaid Plugin](https://www.dokuwiki.org/plugin:mermaid) + - [ComboStrap](https://combostrap.com/mermaid) +- [Foswiki](https://foswiki.org) + - [Mermaid Plugin](https://foswiki.org/Extensions/MermaidPlugin) - [MediaWiki](https://www.mediawiki.org) - [Mermaid Extension](https://www.mediawiki.org/wiki/Extension:Mermaid) - [Flex Diagrams Extension](https://www.mediawiki.org/wiki/Extension:Flex_Diagrams) - [Semantic Media Wiki](https://semantic-mediawiki.org) - [Mermaid Plugin](https://github.com/SemanticMediaWiki/Mermaid) -- [Foswiki](https://foswiki.org) - - [Mermaid Plugin](https://foswiki.org/Extensions/MermaidPlugin) -- [DokuWiki](https://dokuwiki.org) - - [Mermaid Plugin](https://www.dokuwiki.org/plugin:mermaid) - - [ComboStrap](https://combostrap.com/mermaid) - [TiddlyWiki](https://tiddlywiki.com/) - [mermaid-tw5: full js library](https://github.com/efurlanm/mermaid-tw5) - [tw5-mermaid: wrapper for Mermaid Live](https://github.com/jasonmhoule/tw5-mermaid) ### Editor Plugins +- Atom _(Atom has been [archived.](https://github.blog/2022-06-08-sunsetting-atom/))_ + - [Markdown Preview Enhanced](https://github.com/shd101wyy/markdown-preview-enhanced) + - [Atom Mermaid](https://github.com/y-takey/atom-mermaid) + - [Language Mermaid Syntax Highlighter](https://github.com/ytisf/language-mermaid) +- [Astah](https://astah.net) + - [Export to Mermaid](https://github.com/Avens666/Astah_Jude_UML_export_to_Markdown-mermaid-Plantuml-) +- [Brackets](https://brackets.io/) + - [Mermaid Preview](https://github.com/AlanHohn/mermaid-preview) +- [CKEditor](https://github.com/ckeditor/ckeditor5) + - [CKEditor 5 Mermaid plugin](https://github.com/ckeditor/ckeditor5-mermaid) +- [Draw.io](https://draw.io) - [Plugin](https://github.com/nopeslide/drawio_mermaid_plugin) +- [GNU Emacs](https://www.gnu.org/software/emacs/) + - [Major mode for .mmd files](https://github.com/abrochard/mermaid-mode) + - [Org-Mode integration](https://github.com/arnm/ob-mermaid) +- [GNU Nano](https://www.nano-editor.org/) + - [Nano Mermaid](https://github.com/Yash-Singh1/nano-mermaid) +- [Google docs](https://docs.google.com/) + - [Mermaid plugin for google docs](https://workspace.google.com/marketplace/app/mermaid/636321283856) +- [Inkdrop](https://www.inkdrop.app) - [Plugin](https://github.com/inkdropapp/inkdrop-mermaid) +- [Iodide](https://github.com/iodide-project/iodide) + - [iodide-mermaid-plugin](https://github.com/iodide-project/iodide-mermaid-plugin) +- [Light Table](http://lighttable.com/) + - [Mermaid Plugin](https://github.com/cldwalker/Mermaid) +- [Markdown-It](https://github.com/markdown-it/markdown-it) + - [Textual UML Parser](https://github.com/manastalukdar/markdown-it-textual-uml) + - [Mermaid Plugin](https://github.com/tylingsoft/markdown-it-mermaid) + - [md-it-mermaid](https://github.com/iamcco/md-it-mermaid) + - [markdown-it-mermaid-fence-new](https://github.com/Revomatico/markdown-it-mermaid-fence-new) + - [markdown-it-mermaid-less](https://github.com/searKing/markdown-it-mermaid-less) +- [Podlite](https://github.com/zag/podlite-desktop) + - [Named block =Diagram](https://github.com/zag/podlite/tree/main/packages/podlite-diagrams) +- [Standard Notes](https://standardnotes.com/) + - [sn-mermaid](https://github.com/nienow/sn-mermaid) +- [Sublime Text 3](https://sublimetext.com) + - [Mermaid Package](https://packagecontrol.io/packages/Mermaid) - [VS Code](https://code.visualstudio.com/) - [Markdown Preview Mermaid Support](https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid) - [Mermaid Preview](https://marketplace.visualstudio.com/items?itemName=vstirbu.vscode-mermaid-preview) @@ -137,70 +172,35 @@ Communication tools and platforms - [Markdown PDF](https://marketplace.visualstudio.com/items?itemName=yzane.markdown-pdf) - [Preview](https://marketplace.visualstudio.com/items?itemName=searKing.preview-vscode) - [Preview Sequence Diagrams](https://marketplace.visualstudio.com/items?itemName=arichika.previewseqdiag-vscode) -- [Markdown-It](https://github.com/markdown-it/markdown-it) - - [Textual UML Parser](https://github.com/manastalukdar/markdown-it-textual-uml) - - [Mermaid Plugin](https://github.com/tylingsoft/markdown-it-mermaid) - - [md-it-mermaid](https://github.com/iamcco/md-it-mermaid) - - [markdown-it-mermaid-fence-new](https://github.com/Revomatico/markdown-it-mermaid-fence-new) - - [markdown-it-mermaid-less](https://github.com/searKing/markdown-it-mermaid-less) -- Atom _(Atom has been [archived.](https://github.blog/2022-06-08-sunsetting-atom/))_ - - [Markdown Preview Enhanced](https://github.com/shd101wyy/markdown-preview-enhanced) - - [Atom Mermaid](https://github.com/y-takey/atom-mermaid) - - [Language Mermaid Syntax Highlighter](https://github.com/ytisf/language-mermaid) -- [Sublime Text 3](https://sublimetext.com) - - [Mermaid Package](https://packagecontrol.io/packages/Mermaid) -- [Astah](https://astah.net) - - [Export to Mermaid](https://github.com/Avens666/Astah_Jude_UML_export_to_Markdown-mermaid-Plantuml-) -- [Light Table](http://lighttable.com/) - - [Mermaid Plugin](https://github.com/cldwalker/Mermaid) -- [Draw.io](https://draw.io) - [Plugin](https://github.com/nopeslide/drawio_mermaid_plugin) -- [Inkdrop](https://www.inkdrop.app) - [Plugin](https://github.com/inkdropapp/inkdrop-mermaid) - [Vim](https://www.vim.org) - [Official Vim Syntax and ftplugin](https://github.com/craigmac/vim-mermaid) - [Vim Diagram Syntax](https://github.com/zhaozg/vim-diagram) -- [GNU Emacs](https://www.gnu.org/software/emacs/) - - [Major mode for .mmd files](https://github.com/abrochard/mermaid-mode) - - [Org-Mode integration](https://github.com/arnm/ob-mermaid) -- [Brackets](https://brackets.io/) - - [Mermaid Preview](https://github.com/AlanHohn/mermaid-preview) -- [Iodide](https://github.com/iodide-project/iodide) - - [iodide-mermaid-plugin](https://github.com/iodide-project/iodide-mermaid-plugin) -- [Google docs](https://docs.google.com/) - - [Mermaid plugin for google docs](https://workspace.google.com/marketplace/app/mermaid/636321283856) -- [Podlite](https://github.com/zag/podlite-desktop) - - [Named block =Diagram](https://github.com/zag/podlite/tree/main/packages/podlite-diagrams) -- [GNU Nano](https://www.nano-editor.org/) - - [Nano Mermaid](https://github.com/Yash-Singh1/nano-mermaid) -- [CKEditor](https://github.com/ckeditor/ckeditor5) - - [CKEditor 5 Mermaid plugin](https://github.com/ckeditor/ckeditor5-mermaid) -- [Standard Notes](https://standardnotes.com/) - - [sn-mermaid](https://github.com/nienow/sn-mermaid) ### Document Generation +- [Codedoc](https://codedoc.cc/) + - [codedoc-mermaid-plugin](https://www.npmjs.com/package/codedoc-mermaid-plugin) +- [Docsy Hugo Theme](https://www.docsy.dev/docs/adding-content/lookandfeel/#diagrams-with-mermaid) (native support in theme) - [Docusaurus](https://docusaurus.io/docs/markdown-features/diagrams) ✅ -- [Swimm - Up-to-date diagrams with Swimm, the knowledge management tool for code](https://docs.swimm.io/features/diagrams-and-charts/#mermaid--swimm--up-to-date-diagrams-) -- [Sphinx](https://www.sphinx-doc.org/en/master/) - - [sphinxcontrib-mermaid](https://github.com/mgaitan/sphinxcontrib-mermaid) -- [remark](https://remark.js.org/) - - [remark-mermaidjs](https://github.com/remcohaszing/remark-mermaidjs) -- [rehype](https://github.com/rehypejs/rehype) - - [rehype-mermaid](https://github.com/remcohaszing/rehype-mermaid) - [Gatsby](https://www.gatsbyjs.com/) - [gatsby-remark-mermaid](https://github.com/remcohaszing/gatsby-remark-mermaid) - [JSDoc](https://jsdoc.app/) - [jsdoc-mermaid](https://github.com/Jellyvision/jsdoc-mermaid) +- [mdbook](https://rust-lang.github.io/mdBook/index.html) + - [mdbook-mermaid](https://github.com/badboy/mdbook-mermaid) - [MkDocs](https://www.mkdocs.org) - [mkdocs-mermaid2-plugin](https://github.com/fralau/mkdocs-mermaid2-plugin) - [mkdocs-material](https://github.com/squidfunk/mkdocs-material), check the [docs](https://squidfunk.github.io/mkdocs-material/reference/diagrams/) + - [Quarto](https://quarto.org/) +- [rehype](https://github.com/rehypejs/rehype) + - [rehype-mermaid](https://github.com/remcohaszing/rehype-mermaid) +- [remark](https://remark.js.org/) + - [remark-mermaidjs](https://github.com/remcohaszing/remark-mermaidjs) +- [Sphinx](https://www.sphinx-doc.org/en/master/) + - [sphinxcontrib-mermaid](https://github.com/mgaitan/sphinxcontrib-mermaid) +- [Swimm - Up-to-date diagrams with Swimm, the knowledge management tool for code](https://docs.swimm.io/features/diagrams-and-charts/#mermaid--swimm--up-to-date-diagrams-) - [Type Doc](https://typedoc.org/) - [typedoc-plugin-mermaid](https://www.npmjs.com/package/typedoc-plugin-mermaid) -- [Docsy Hugo Theme](https://www.docsy.dev/docs/adding-content/lookandfeel/#diagrams-with-mermaid) (native support in theme) -- [Codedoc](https://codedoc.cc/) - - [codedoc-mermaid-plugin](https://www.npmjs.com/package/codedoc-mermaid-plugin) -- [mdbook](https://rust-lang.github.io/mdBook/index.html) - - [mdbook-mermaid](https://github.com/badboy/mdbook-mermaid) -- [Quarto](https://quarto.org/) - [Typora](https://typora.io/) ([native support](https://support.typora.io/Draw-Diagrams-With-Markdown/#mermaid)) ### Browser Extensions @@ -220,19 +220,19 @@ Communication tools and platforms ### Other +- [Bisheng](https://www.npmjs.com/package/bisheng) + - [bisheng-plugin-mermaid](https://github.com/yct21/bisheng-plugin-mermaid) +- [ExDoc](https://github.com/elixir-lang/ex_doc) + - [Rendering Mermaid graphs](https://github.com/elixir-lang/ex_doc#rendering-mermaid-graphs) - [Jekyll](https://jekyllrb.com/) - [jekyll-mermaid](https://rubygems.org/gems/jekyll-mermaid) - [jekyll-mermaid-diagrams](https://github.com/fuzhibo/jekyll-mermaid-diagrams) -- [Reveal.js](https://github.com/hakimel/reveal.js) - - [reveal.js-mermaid-plugin](https://github.com/ludwick/reveal.js-mermaid-plugin) -- [Bisheng](https://www.npmjs.com/package/bisheng) - - [bisheng-plugin-mermaid](https://github.com/yct21/bisheng-plugin-mermaid) -- [Reveal CK](https://github.com/jedcn/reveal-ck) - - [reveal-ck-mermaid-plugin](https://github.com/tmtm/reveal-ck-mermaid-plugin) - [mermaid-isomorphic](https://github.com/remcohaszing/mermaid-isomorphic) - [mermaid-server: Generate diagrams using a HTTP request](https://github.com/TomWright/mermaid-server) -- [ExDoc](https://github.com/elixir-lang/ex_doc) - - [Rendering Mermaid graphs](https://github.com/elixir-lang/ex_doc#rendering-mermaid-graphs) - [NiceGUI: Let any browser be the frontend of your Python code](https://nicegui.io) - [ui.mermaid(...)](https://nicegui.io/reference#mermaid_diagrams) - [ui.markdown(..., extras=\['mermaid'\])](https://nicegui.io/reference#markdown_element) +- [Reveal.js](https://github.com/hakimel/reveal.js) + - [reveal.js-mermaid-plugin](https://github.com/ludwick/reveal.js-mermaid-plugin) +- [Reveal CK](https://github.com/jedcn/reveal-ck) + - [reveal-ck-mermaid-plugin](https://github.com/tmtm/reveal-ck-mermaid-plugin) diff --git a/packages/mermaid/src/docs/ecosystem/integrations-community.md b/packages/mermaid/src/docs/ecosystem/integrations-community.md index b3f721304..b48746bc4 100644 --- a/packages/mermaid/src/docs/ecosystem/integrations-community.md +++ b/packages/mermaid/src/docs/ecosystem/integrations-community.md @@ -16,48 +16,48 @@ Below are a list of community plugins and integrations created with Mermaid. ✅ = Native support +- [Atlassian Products](https://www.atlassian.com) + - [Mermaid for Confluence](https://marketplace.atlassian.com/apps/1224722/mermaid-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Integration for Confluence](https://marketplace.atlassian.com/apps/1222792/mermaid-integration-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Charts & Diagrams for Confluence](https://marketplace.atlassian.com/apps/1222572/) + - [Mermaid Diagrams for Confluence](https://marketplace.atlassian.com/apps/1226945/mermaid-diagrams-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Macro for Confluence](https://marketplace.atlassian.com/apps/1231150/mermaid-macro-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Live Editor for Confluence Cloud](https://marketplace.atlassian.com/apps/1231571/mermaid-live-editor-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Plugin for Confluence](https://marketplace.atlassian.com/apps/1214124/mermaid-plugin-for-confluence?hosting=server&tab=overview) + - [EliteSoft Mermaid Charts and Diagrams](https://marketplace.atlassian.com/apps/1227286/elitesoft-mermaid-charts-and-diagrams?hosting=cloud&tab=overview) + - [Auto convert diagrams in Jira](https://github.com/coddingtonbear/jirafs-mermaid) + - [Mermaid for Jira Cloud - Draw UML diagrams easily](https://marketplace.atlassian.com/apps/1223053/mermaid-for-jira-cloud-draw-uml-diagrams-easily?hosting=cloud&tab=overview) + - [Mermaid Charts & Diagrams for Jira](https://marketplace.atlassian.com/apps/1224537/) + - [CloudScript.io Addon](https://marketplace.atlassian.com/apps/1219878/cloudscript-io-mermaid-addon?hosting=cloud&tab=overview) +- [Azure Devops](https://docs.microsoft.com/en-us/azure/devops/project/wiki/wiki-markdown-guidance?view=azure-devops#add-mermaid-diagrams-to-a-wiki-page) ✅ +- [Deepdwn](https://billiam.itch.io/deepdwn) ✅ +- [GitBook](https://gitbook.com) + - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid) + - [Markdown with Mermaid CLI](https://github.com/miao1007/gitbook-plugin-mermaid-cli) + - [Mermaid plugin for GitBook](https://github.com/wwformat/gitbook-plugin-mermaid-pdf) +- [Gitea](https://gitea.io) ✅ - [GitHub](https://github.com) ✅ - [Using code blocks](https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/) ✅ - [GitHub action: Compile mermaid to image](https://github.com/neenjaw/compile-mermaid-markdown-action) - [svg-generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator) - [GitHub Writer](https://github.com/ckeditor/github-writer) - [GitLab](https://docs.gitlab.com/ee/user/markdown.html#diagrams-and-flowcharts) ✅ -- [Gitea](https://gitea.io) ✅ -- [Azure Devops](https://docs.microsoft.com/en-us/azure/devops/project/wiki/wiki-markdown-guidance?view=azure-devops#add-mermaid-diagrams-to-a-wiki-page) ✅ +- [Mermaid Plugin for JetBrains IDEs](https://plugins.jetbrains.com/plugin/20146-mermaid) +- [Joplin](https://joplinapp.org) ✅ +- [LiveBook](https://livebook.dev) ✅ - [Tuleap](https://docs.tuleap.org/user-guide/writing-in-tuleap.html#graphs) ✅ - [Mermaid Flow Visual Editor](https://www.mermaidflow.app) ✅ -- [Deepdwn](https://billiam.itch.io/deepdwn) ✅ -- [Joplin](https://joplinapp.org) ✅ +- [mermerd](https://github.com/KarnerTh/mermerd) - [Slab](https://slab.com) ✅ - [Swimm](https://swimm.io) ✅ +- [NotesHub](https://noteshub.app) ✅ - [Notion](https://notion.so) ✅ - [Observable](https://observablehq.com/@observablehq/mermaid) ✅ - [Obsidian](https://help.obsidian.md/Editing+and+formatting/Advanced+formatting+syntax#Diagram) ✅ -- [NotesHub](https://noteshub.app) ✅ -- [GitBook](https://gitbook.com) - - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid) - - [Markdown with Mermaid CLI](https://github.com/miao1007/gitbook-plugin-mermaid-cli) - - [Mermaid plugin for GitBook](https://github.com/wwformat/gitbook-plugin-mermaid-pdf) -- [LiveBook](https://livebook.dev) ✅ -- [Atlassian Products](https://www.atlassian.com) - - [Mermaid for Confluence](https://marketplace.atlassian.com/apps/1224722/mermaid-for-confluence?hosting=cloud&tab=overview) - - [Mermaid Integration for Confluence](https://marketplace.atlassian.com/apps/1222792/mermaid-integration-for-confluence?hosting=cloud&tab=overview) - - [Mermaid Diagrams for Confluence](https://marketplace.atlassian.com/apps/1226945/mermaid-diagrams-for-confluence?hosting=cloud&tab=overview) - - [Mermaid Macro for Confluence](https://marketplace.atlassian.com/apps/1231150/mermaid-macro-for-confluence?hosting=cloud&tab=overview) - - [EliteSoft Mermaid Charts and Diagrams](https://marketplace.atlassian.com/apps/1227286/elitesoft-mermaid-charts-and-diagrams?hosting=cloud&tab=overview) - - [Mermaid for Jira Cloud - Draw UML diagrams easily](https://marketplace.atlassian.com/apps/1223053/mermaid-for-jira-cloud-draw-uml-diagrams-easily?hosting=cloud&tab=overview) - - [Mermaid Charts & Diagrams for Confluence](https://marketplace.atlassian.com/apps/1222572/) - - [Mermaid Charts & Diagrams for Jira](https://marketplace.atlassian.com/apps/1224537/) - - [Mermaid Live Editor for Confluence Cloud](https://marketplace.atlassian.com/apps/1231571/mermaid-live-editor-for-confluence?hosting=cloud&tab=overview) - - [Mermaid Plugin for Confluence](https://marketplace.atlassian.com/apps/1214124/mermaid-plugin-for-confluence?hosting=server&tab=overview) - - [CloudScript.io Addon](https://marketplace.atlassian.com/apps/1219878/cloudscript-io-mermaid-addon?hosting=cloud&tab=overview) - - [Auto convert diagrams in Jira](https://github.com/coddingtonbear/jirafs-mermaid) - [Redmine](https://redmine.org) - [Mermaid Macro](https://www.redmine.org/plugins/redmine_mermaid_macro) - [redmine-mermaid](https://github.com/styz/redmine_mermaid) - [markdown-for-mermaid-plugin](https://github.com/jamieh-mongolian/markdown-for-mermaid-plugin) -- [Mermaid Plugin for JetBrains IDEs](https://plugins.jetbrains.com/plugin/20146-mermaid) -- [mermerd](https://github.com/KarnerTh/mermerd) - Visual Studio Code [Polyglot Interactive Notebooks](https://github.com/dotnet/interactive#net-interactive) ### CRM/ERP @@ -70,27 +70,27 @@ Customer Relationship Management/Enterprise Resource Planning Blogging frameworks and platforms -- [WordPress](https://wordpress.org) - - [WordPress Markdown Editor](https://wordpress.org/plugins/wp-githuber-md) - - [WP-ReliableMD](https://wordpress.org/plugins/wp-reliablemd/) - [Hexo](https://hexo.io) - [hexo-filter-mermaid-diagrams](https://github.com/webappdevelp/hexo-filter-mermaid-diagrams) - [hexo-tag-mermaid](https://github.com/JameChou/hexo-tag-mermaid) - [hexo-mermaid-diagrams](https://github.com/mslxl/hexo-mermaid-diagrams) - [Nextra](https://nextra.site/) - [Mermaid](https://nextra.site/docs/guide/mermaid) +- [WordPress](https://wordpress.org) + - [WordPress Markdown Editor](https://wordpress.org/plugins/wp-githuber-md) + - [WP-ReliableMD](https://wordpress.org/plugins/wp-reliablemd/) ### CMS/ECM Content Management Systems/Enterprise Content Management +- [Grav CMS](https://getgrav.org/) + - [Mermaid Diagrams](https://github.com/DanielFlaum/grav-plugin-mermaid-diagrams) + - [GitLab Markdown Adapter](https://github.com/Goutte/grav-plugin-gitlab-markdown-adapter) - [VitePress](https://vitepress.vuejs.org/) - [Plugin for Mermaid.js](https://emersonbottero.github.io/vitepress-plugin-mermaid/) - [VuePress](https://vuepress.vuejs.org/) - [Plugin for Mermaid.js](https://github.com/eFrane/vuepress-plugin-mermaidjs) -- [Grav CMS](https://getgrav.org/) - - [Mermaid Diagrams](https://github.com/DanielFlaum/grav-plugin-mermaid-diagrams) - - [GitLab Markdown Adapter](https://github.com/Goutte/grav-plugin-gitlab-markdown-adapter) ### Communication @@ -100,31 +100,66 @@ Communication tools and platforms - [Mermaid Plugin](https://github.com/pnewell/discourse-mermaid), [And](https://github.com/unfoldingWord-dev/discourse-mermaid) - [Mattermost](https://mattermost.com/) - [Mermaid Plugin](https://github.com/SpikeTings/Mermaid) -- [phpBB](https://phpbb.com) - - [phpbb-ext-mermaid](https://github.com/AlfredoRamos/phpbb-ext-mermaid) - [NodeBB](https://nodebb.org) - [Mermaid Plugin](https://www.npmjs.com/package/nodebb-plugin-mermaid) +- [phpBB](https://phpbb.com) + - [phpbb-ext-mermaid](https://github.com/AlfredoRamos/phpbb-ext-mermaid) - [Slack](https://slack.com) - [Mermaid for Slack](https://github.com/JackuB/mermaid-for-slack) ### Wikis +- [DokuWiki](https://dokuwiki.org) + - [Mermaid Plugin](https://www.dokuwiki.org/plugin:mermaid) + - [ComboStrap](https://combostrap.com/mermaid) +- [Foswiki](https://foswiki.org) + - [Mermaid Plugin](https://foswiki.org/Extensions/MermaidPlugin) - [MediaWiki](https://www.mediawiki.org) - [Mermaid Extension](https://www.mediawiki.org/wiki/Extension:Mermaid) - [Flex Diagrams Extension](https://www.mediawiki.org/wiki/Extension:Flex_Diagrams) - [Semantic Media Wiki](https://semantic-mediawiki.org) - [Mermaid Plugin](https://github.com/SemanticMediaWiki/Mermaid) -- [Foswiki](https://foswiki.org) - - [Mermaid Plugin](https://foswiki.org/Extensions/MermaidPlugin) -- [DokuWiki](https://dokuwiki.org) - - [Mermaid Plugin](https://www.dokuwiki.org/plugin:mermaid) - - [ComboStrap](https://combostrap.com/mermaid) - [TiddlyWiki](https://tiddlywiki.com/) - [mermaid-tw5: full js library](https://github.com/efurlanm/mermaid-tw5) - [tw5-mermaid: wrapper for Mermaid Live](https://github.com/jasonmhoule/tw5-mermaid) ### Editor Plugins +- Atom _(Atom has been [archived.](https://github.blog/2022-06-08-sunsetting-atom/))_ + - [Markdown Preview Enhanced](https://github.com/shd101wyy/markdown-preview-enhanced) + - [Atom Mermaid](https://github.com/y-takey/atom-mermaid) + - [Language Mermaid Syntax Highlighter](https://github.com/ytisf/language-mermaid) +- [Astah](https://astah.net) + - [Export to Mermaid](https://github.com/Avens666/Astah_Jude_UML_export_to_Markdown-mermaid-Plantuml-) +- [Brackets](https://brackets.io/) + - [Mermaid Preview](https://github.com/AlanHohn/mermaid-preview) +- [CKEditor](https://github.com/ckeditor/ckeditor5) + - [CKEditor 5 Mermaid plugin](https://github.com/ckeditor/ckeditor5-mermaid) +- [Draw.io](https://draw.io) - [Plugin](https://github.com/nopeslide/drawio_mermaid_plugin) +- [GNU Emacs](https://www.gnu.org/software/emacs/) + - [Major mode for .mmd files](https://github.com/abrochard/mermaid-mode) + - [Org-Mode integration](https://github.com/arnm/ob-mermaid) +- [GNU Nano](https://www.nano-editor.org/) + - [Nano Mermaid](https://github.com/Yash-Singh1/nano-mermaid) +- [Google docs](https://docs.google.com/) + - [Mermaid plugin for google docs](https://workspace.google.com/marketplace/app/mermaid/636321283856) +- [Inkdrop](https://www.inkdrop.app) - [Plugin](https://github.com/inkdropapp/inkdrop-mermaid) +- [Iodide](https://github.com/iodide-project/iodide) + - [iodide-mermaid-plugin](https://github.com/iodide-project/iodide-mermaid-plugin) +- [Light Table](http://lighttable.com/) + - [Mermaid Plugin](https://github.com/cldwalker/Mermaid) +- [Markdown-It](https://github.com/markdown-it/markdown-it) + - [Textual UML Parser](https://github.com/manastalukdar/markdown-it-textual-uml) + - [Mermaid Plugin](https://github.com/tylingsoft/markdown-it-mermaid) + - [md-it-mermaid](https://github.com/iamcco/md-it-mermaid) + - [markdown-it-mermaid-fence-new](https://github.com/Revomatico/markdown-it-mermaid-fence-new) + - [markdown-it-mermaid-less](https://github.com/searKing/markdown-it-mermaid-less) +- [Podlite](https://github.com/zag/podlite-desktop) + - [Named block =Diagram](https://github.com/zag/podlite/tree/main/packages/podlite-diagrams) +- [Standard Notes](https://standardnotes.com/) + - [sn-mermaid](https://github.com/nienow/sn-mermaid) +- [Sublime Text 3](https://sublimetext.com) + - [Mermaid Package](https://packagecontrol.io/packages/Mermaid) - [VS Code](https://code.visualstudio.com/) - [Markdown Preview Mermaid Support](https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid) - [Mermaid Preview](https://marketplace.visualstudio.com/items?itemName=vstirbu.vscode-mermaid-preview) @@ -135,70 +170,35 @@ Communication tools and platforms - [Markdown PDF](https://marketplace.visualstudio.com/items?itemName=yzane.markdown-pdf) - [Preview](https://marketplace.visualstudio.com/items?itemName=searKing.preview-vscode) - [Preview Sequence Diagrams](https://marketplace.visualstudio.com/items?itemName=arichika.previewseqdiag-vscode) -- [Markdown-It](https://github.com/markdown-it/markdown-it) - - [Textual UML Parser](https://github.com/manastalukdar/markdown-it-textual-uml) - - [Mermaid Plugin](https://github.com/tylingsoft/markdown-it-mermaid) - - [md-it-mermaid](https://github.com/iamcco/md-it-mermaid) - - [markdown-it-mermaid-fence-new](https://github.com/Revomatico/markdown-it-mermaid-fence-new) - - [markdown-it-mermaid-less](https://github.com/searKing/markdown-it-mermaid-less) -- Atom _(Atom has been [archived.](https://github.blog/2022-06-08-sunsetting-atom/))_ - - [Markdown Preview Enhanced](https://github.com/shd101wyy/markdown-preview-enhanced) - - [Atom Mermaid](https://github.com/y-takey/atom-mermaid) - - [Language Mermaid Syntax Highlighter](https://github.com/ytisf/language-mermaid) -- [Sublime Text 3](https://sublimetext.com) - - [Mermaid Package](https://packagecontrol.io/packages/Mermaid) -- [Astah](https://astah.net) - - [Export to Mermaid](https://github.com/Avens666/Astah_Jude_UML_export_to_Markdown-mermaid-Plantuml-) -- [Light Table](http://lighttable.com/) - - [Mermaid Plugin](https://github.com/cldwalker/Mermaid) -- [Draw.io](https://draw.io) - [Plugin](https://github.com/nopeslide/drawio_mermaid_plugin) -- [Inkdrop](https://www.inkdrop.app) - [Plugin](https://github.com/inkdropapp/inkdrop-mermaid) - [Vim](https://www.vim.org) - [Official Vim Syntax and ftplugin](https://github.com/craigmac/vim-mermaid) - [Vim Diagram Syntax](https://github.com/zhaozg/vim-diagram) -- [GNU Emacs](https://www.gnu.org/software/emacs/) - - [Major mode for .mmd files](https://github.com/abrochard/mermaid-mode) - - [Org-Mode integration](https://github.com/arnm/ob-mermaid) -- [Brackets](https://brackets.io/) - - [Mermaid Preview](https://github.com/AlanHohn/mermaid-preview) -- [Iodide](https://github.com/iodide-project/iodide) - - [iodide-mermaid-plugin](https://github.com/iodide-project/iodide-mermaid-plugin) -- [Google docs](https://docs.google.com/) - - [Mermaid plugin for google docs](https://workspace.google.com/marketplace/app/mermaid/636321283856) -- [Podlite](https://github.com/zag/podlite-desktop) - - [Named block =Diagram](https://github.com/zag/podlite/tree/main/packages/podlite-diagrams) -- [GNU Nano](https://www.nano-editor.org/) - - [Nano Mermaid](https://github.com/Yash-Singh1/nano-mermaid) -- [CKEditor](https://github.com/ckeditor/ckeditor5) - - [CKEditor 5 Mermaid plugin](https://github.com/ckeditor/ckeditor5-mermaid) -- [Standard Notes](https://standardnotes.com/) - - [sn-mermaid](https://github.com/nienow/sn-mermaid) ### Document Generation +- [Codedoc](https://codedoc.cc/) + - [codedoc-mermaid-plugin](https://www.npmjs.com/package/codedoc-mermaid-plugin) +- [Docsy Hugo Theme](https://www.docsy.dev/docs/adding-content/lookandfeel/#diagrams-with-mermaid) (native support in theme) - [Docusaurus](https://docusaurus.io/docs/markdown-features/diagrams) ✅ -- [Swimm - Up-to-date diagrams with Swimm, the knowledge management tool for code](https://docs.swimm.io/features/diagrams-and-charts/#mermaid--swimm--up-to-date-diagrams-) -- [Sphinx](https://www.sphinx-doc.org/en/master/) - - [sphinxcontrib-mermaid](https://github.com/mgaitan/sphinxcontrib-mermaid) -- [remark](https://remark.js.org/) - - [remark-mermaidjs](https://github.com/remcohaszing/remark-mermaidjs) -- [rehype](https://github.com/rehypejs/rehype) - - [rehype-mermaid](https://github.com/remcohaszing/rehype-mermaid) - [Gatsby](https://www.gatsbyjs.com/) - [gatsby-remark-mermaid](https://github.com/remcohaszing/gatsby-remark-mermaid) - [JSDoc](https://jsdoc.app/) - [jsdoc-mermaid](https://github.com/Jellyvision/jsdoc-mermaid) +- [mdbook](https://rust-lang.github.io/mdBook/index.html) + - [mdbook-mermaid](https://github.com/badboy/mdbook-mermaid) - [MkDocs](https://www.mkdocs.org) - [mkdocs-mermaid2-plugin](https://github.com/fralau/mkdocs-mermaid2-plugin) - [mkdocs-material](https://github.com/squidfunk/mkdocs-material), check the [docs](https://squidfunk.github.io/mkdocs-material/reference/diagrams/) + - [Quarto](https://quarto.org/) +- [rehype](https://github.com/rehypejs/rehype) + - [rehype-mermaid](https://github.com/remcohaszing/rehype-mermaid) +- [remark](https://remark.js.org/) + - [remark-mermaidjs](https://github.com/remcohaszing/remark-mermaidjs) +- [Sphinx](https://www.sphinx-doc.org/en/master/) + - [sphinxcontrib-mermaid](https://github.com/mgaitan/sphinxcontrib-mermaid) +- [Swimm - Up-to-date diagrams with Swimm, the knowledge management tool for code](https://docs.swimm.io/Features/diagrams-and-charts#mermaid--swimm--up-to-date-diagrams-) - [Type Doc](https://typedoc.org/) - [typedoc-plugin-mermaid](https://www.npmjs.com/package/typedoc-plugin-mermaid) -- [Docsy Hugo Theme](https://www.docsy.dev/docs/adding-content/lookandfeel/#diagrams-with-mermaid) (native support in theme) -- [Codedoc](https://codedoc.cc/) - - [codedoc-mermaid-plugin](https://www.npmjs.com/package/codedoc-mermaid-plugin) -- [mdbook](https://rust-lang.github.io/mdBook/index.html) - - [mdbook-mermaid](https://github.com/badboy/mdbook-mermaid) -- [Quarto](https://quarto.org/) - [Typora](https://typora.io/) ([native support](https://support.typora.io/Draw-Diagrams-With-Markdown/#mermaid)) ### Browser Extensions @@ -218,19 +218,19 @@ Communication tools and platforms ### Other +- [Bisheng](https://www.npmjs.com/package/bisheng) + - [bisheng-plugin-mermaid](https://github.com/yct21/bisheng-plugin-mermaid) +- [ExDoc](https://github.com/elixir-lang/ex_doc) + - [Rendering Mermaid graphs](https://github.com/elixir-lang/ex_doc#rendering-mermaid-graphs) - [Jekyll](https://jekyllrb.com/) - [jekyll-mermaid](https://rubygems.org/gems/jekyll-mermaid) - [jekyll-mermaid-diagrams](https://github.com/fuzhibo/jekyll-mermaid-diagrams) -- [Reveal.js](https://github.com/hakimel/reveal.js) - - [reveal.js-mermaid-plugin](https://github.com/ludwick/reveal.js-mermaid-plugin) -- [Bisheng](https://www.npmjs.com/package/bisheng) - - [bisheng-plugin-mermaid](https://github.com/yct21/bisheng-plugin-mermaid) -- [Reveal CK](https://github.com/jedcn/reveal-ck) - - [reveal-ck-mermaid-plugin](https://github.com/tmtm/reveal-ck-mermaid-plugin) - [mermaid-isomorphic](https://github.com/remcohaszing/mermaid-isomorphic) - [mermaid-server: Generate diagrams using a HTTP request](https://github.com/TomWright/mermaid-server) -- [ExDoc](https://github.com/elixir-lang/ex_doc) - - [Rendering Mermaid graphs](https://github.com/elixir-lang/ex_doc#rendering-mermaid-graphs) - [NiceGUI: Let any browser be the frontend of your Python code](https://nicegui.io) - [ui.mermaid(...)](https://nicegui.io/reference#mermaid_diagrams) - [ui.markdown(..., extras=['mermaid'])](https://nicegui.io/reference#markdown_element) +- [Reveal.js](https://github.com/hakimel/reveal.js) + - [reveal.js-mermaid-plugin](https://github.com/ludwick/reveal.js-mermaid-plugin) +- [Reveal CK](https://github.com/jedcn/reveal-ck) + - [reveal-ck-mermaid-plugin](https://github.com/tmtm/reveal-ck-mermaid-plugin) From 783becebf626d165d78a053f127a5fee0f2a1712 Mon Sep 17 00:00:00 2001 From: Ronid1 Date: Wed, 22 Nov 2023 18:48:52 -0800 Subject: [PATCH 009/170] alphabetically order sub categories --- docs/ecosystem/integrations-community.md | 26 +++++++++---------- .../docs/ecosystem/integrations-community.md | 26 +++++++++---------- 2 files changed, 26 insertions(+), 26 deletions(-) diff --git a/docs/ecosystem/integrations-community.md b/docs/ecosystem/integrations-community.md index d74918e61..0b560cc91 100644 --- a/docs/ecosystem/integrations-community.md +++ b/docs/ecosystem/integrations-community.md @@ -23,26 +23,26 @@ Below are a list of community plugins and integrations created with Mermaid. - [Mermaid Integration for Confluence](https://marketplace.atlassian.com/apps/1222792/mermaid-integration-for-confluence?hosting=cloud&tab=overview) - [Mermaid Charts & Diagrams for Confluence](https://marketplace.atlassian.com/apps/1222572/) - [Mermaid Diagrams for Confluence](https://marketplace.atlassian.com/apps/1226945/mermaid-diagrams-for-confluence?hosting=cloud&tab=overview) - - [Mermaid Macro for Confluence](https://marketplace.atlassian.com/apps/1231150/mermaid-macro-for-confluence?hosting=cloud&tab=overview) - [Mermaid Live Editor for Confluence Cloud](https://marketplace.atlassian.com/apps/1231571/mermaid-live-editor-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Macro for Confluence](https://marketplace.atlassian.com/apps/1231150/mermaid-macro-for-confluence?hosting=cloud&tab=overview) - [Mermaid Plugin for Confluence](https://marketplace.atlassian.com/apps/1214124/mermaid-plugin-for-confluence?hosting=server&tab=overview) - [EliteSoft Mermaid Charts and Diagrams](https://marketplace.atlassian.com/apps/1227286/elitesoft-mermaid-charts-and-diagrams?hosting=cloud&tab=overview) - [Auto convert diagrams in Jira](https://github.com/coddingtonbear/jirafs-mermaid) - - [Mermaid for Jira Cloud - Draw UML diagrams easily](https://marketplace.atlassian.com/apps/1223053/mermaid-for-jira-cloud-draw-uml-diagrams-easily?hosting=cloud&tab=overview) - [Mermaid Charts & Diagrams for Jira](https://marketplace.atlassian.com/apps/1224537/) + - [Mermaid for Jira Cloud - Draw UML diagrams easily](https://marketplace.atlassian.com/apps/1223053/mermaid-for-jira-cloud-draw-uml-diagrams-easily?hosting=cloud&tab=overview) - [CloudScript.io Addon](https://marketplace.atlassian.com/apps/1219878/cloudscript-io-mermaid-addon?hosting=cloud&tab=overview) - [Azure Devops](https://docs.microsoft.com/en-us/azure/devops/project/wiki/wiki-markdown-guidance?view=azure-devops#add-mermaid-diagrams-to-a-wiki-page) ✅ - [Deepdwn](https://billiam.itch.io/deepdwn) ✅ - [GitBook](https://gitbook.com) - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid) - - [Markdown with Mermaid CLI](https://github.com/miao1007/gitbook-plugin-mermaid-cli) - [Mermaid plugin for GitBook](https://github.com/wwformat/gitbook-plugin-mermaid-pdf) + - [Markdown with Mermaid CLI](https://github.com/miao1007/gitbook-plugin-mermaid-cli) - [Gitea](https://gitea.io) ✅ - [GitHub](https://github.com) ✅ - [Using code blocks](https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/) ✅ - [GitHub action: Compile mermaid to image](https://github.com/neenjaw/compile-mermaid-markdown-action) - - [svg-generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator) - [GitHub Writer](https://github.com/ckeditor/github-writer) + - [svg-generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator) - [GitLab](https://docs.gitlab.com/ee/user/markdown.html#diagrams-and-flowcharts) ✅ - [Mermaid Plugin for JetBrains IDEs](https://plugins.jetbrains.com/plugin/20146-mermaid) - [Joplin](https://joplinapp.org) ✅ @@ -58,8 +58,8 @@ Below are a list of community plugins and integrations created with Mermaid. - [Obsidian](https://help.obsidian.md/Editing+and+formatting/Advanced+formatting+syntax#Diagram) ✅ - [Redmine](https://redmine.org) - [Mermaid Macro](https://www.redmine.org/plugins/redmine_mermaid_macro) - - [redmine-mermaid](https://github.com/styz/redmine_mermaid) - [markdown-for-mermaid-plugin](https://github.com/jamieh-mongolian/markdown-for-mermaid-plugin) + - [redmine-mermaid](https://github.com/styz/redmine_mermaid) - Visual Studio Code [Polyglot Interactive Notebooks](https://github.com/dotnet/interactive#net-interactive) ### CRM/ERP @@ -112,13 +112,13 @@ Communication tools and platforms ### Wikis - [DokuWiki](https://dokuwiki.org) - - [Mermaid Plugin](https://www.dokuwiki.org/plugin:mermaid) - [ComboStrap](https://combostrap.com/mermaid) + - [Mermaid Plugin](https://www.dokuwiki.org/plugin:mermaid) - [Foswiki](https://foswiki.org) - [Mermaid Plugin](https://foswiki.org/Extensions/MermaidPlugin) - [MediaWiki](https://www.mediawiki.org) - - [Mermaid Extension](https://www.mediawiki.org/wiki/Extension:Mermaid) - [Flex Diagrams Extension](https://www.mediawiki.org/wiki/Extension:Flex_Diagrams) + - [Mermaid Extension](https://www.mediawiki.org/wiki/Extension:Mermaid) - [Semantic Media Wiki](https://semantic-mediawiki.org) - [Mermaid Plugin](https://github.com/SemanticMediaWiki/Mermaid) - [TiddlyWiki](https://tiddlywiki.com/) @@ -163,18 +163,18 @@ Communication tools and platforms - [Sublime Text 3](https://sublimetext.com) - [Mermaid Package](https://packagecontrol.io/packages/Mermaid) - [VS Code](https://code.visualstudio.com/) - - [Markdown Preview Mermaid Support](https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid) - - [Mermaid Preview](https://marketplace.visualstudio.com/items?itemName=vstirbu.vscode-mermaid-preview) - - [Markdown Preview Enhanced](https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced) - - [Mermaid Markdown Syntax Highlighting](https://marketplace.visualstudio.com/items?itemName=bpruitt-goddard.mermaid-markdown-syntax-highlighting) - [Mermaid Editor](https://marketplace.visualstudio.com/items?itemName=tomoyukim.vscode-mermaid-editor) - [Mermaid Export](https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.mermaid-export) - [Markdown PDF](https://marketplace.visualstudio.com/items?itemName=yzane.markdown-pdf) + - [Markdown Preview Mermaid Support](https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid) + - [Markdown Preview Enhanced](https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced) + - [Mermaid Preview](https://marketplace.visualstudio.com/items?itemName=vstirbu.vscode-mermaid-preview) - [Preview](https://marketplace.visualstudio.com/items?itemName=searKing.preview-vscode) - [Preview Sequence Diagrams](https://marketplace.visualstudio.com/items?itemName=arichika.previewseqdiag-vscode) + - [Mermaid Markdown Syntax Highlighting](https://marketplace.visualstudio.com/items?itemName=bpruitt-goddard.mermaid-markdown-syntax-highlighting) - [Vim](https://www.vim.org) - - [Official Vim Syntax and ftplugin](https://github.com/craigmac/vim-mermaid) - [Vim Diagram Syntax](https://github.com/zhaozg/vim-diagram) + - [Official Vim Syntax and ftplugin](https://github.com/craigmac/vim-mermaid) ### Document Generation @@ -230,8 +230,8 @@ Communication tools and platforms - [mermaid-isomorphic](https://github.com/remcohaszing/mermaid-isomorphic) - [mermaid-server: Generate diagrams using a HTTP request](https://github.com/TomWright/mermaid-server) - [NiceGUI: Let any browser be the frontend of your Python code](https://nicegui.io) - - [ui.mermaid(...)](https://nicegui.io/reference#mermaid_diagrams) - [ui.markdown(..., extras=\['mermaid'\])](https://nicegui.io/reference#markdown_element) + - [ui.mermaid(...)](https://nicegui.io/reference#mermaid_diagrams) - [Reveal.js](https://github.com/hakimel/reveal.js) - [reveal.js-mermaid-plugin](https://github.com/ludwick/reveal.js-mermaid-plugin) - [Reveal CK](https://github.com/jedcn/reveal-ck) diff --git a/packages/mermaid/src/docs/ecosystem/integrations-community.md b/packages/mermaid/src/docs/ecosystem/integrations-community.md index b48746bc4..d64f06875 100644 --- a/packages/mermaid/src/docs/ecosystem/integrations-community.md +++ b/packages/mermaid/src/docs/ecosystem/integrations-community.md @@ -21,26 +21,26 @@ Below are a list of community plugins and integrations created with Mermaid. - [Mermaid Integration for Confluence](https://marketplace.atlassian.com/apps/1222792/mermaid-integration-for-confluence?hosting=cloud&tab=overview) - [Mermaid Charts & Diagrams for Confluence](https://marketplace.atlassian.com/apps/1222572/) - [Mermaid Diagrams for Confluence](https://marketplace.atlassian.com/apps/1226945/mermaid-diagrams-for-confluence?hosting=cloud&tab=overview) - - [Mermaid Macro for Confluence](https://marketplace.atlassian.com/apps/1231150/mermaid-macro-for-confluence?hosting=cloud&tab=overview) - [Mermaid Live Editor for Confluence Cloud](https://marketplace.atlassian.com/apps/1231571/mermaid-live-editor-for-confluence?hosting=cloud&tab=overview) + - [Mermaid Macro for Confluence](https://marketplace.atlassian.com/apps/1231150/mermaid-macro-for-confluence?hosting=cloud&tab=overview) - [Mermaid Plugin for Confluence](https://marketplace.atlassian.com/apps/1214124/mermaid-plugin-for-confluence?hosting=server&tab=overview) - [EliteSoft Mermaid Charts and Diagrams](https://marketplace.atlassian.com/apps/1227286/elitesoft-mermaid-charts-and-diagrams?hosting=cloud&tab=overview) - [Auto convert diagrams in Jira](https://github.com/coddingtonbear/jirafs-mermaid) - - [Mermaid for Jira Cloud - Draw UML diagrams easily](https://marketplace.atlassian.com/apps/1223053/mermaid-for-jira-cloud-draw-uml-diagrams-easily?hosting=cloud&tab=overview) - [Mermaid Charts & Diagrams for Jira](https://marketplace.atlassian.com/apps/1224537/) + - [Mermaid for Jira Cloud - Draw UML diagrams easily](https://marketplace.atlassian.com/apps/1223053/mermaid-for-jira-cloud-draw-uml-diagrams-easily?hosting=cloud&tab=overview) - [CloudScript.io Addon](https://marketplace.atlassian.com/apps/1219878/cloudscript-io-mermaid-addon?hosting=cloud&tab=overview) - [Azure Devops](https://docs.microsoft.com/en-us/azure/devops/project/wiki/wiki-markdown-guidance?view=azure-devops#add-mermaid-diagrams-to-a-wiki-page) ✅ - [Deepdwn](https://billiam.itch.io/deepdwn) ✅ - [GitBook](https://gitbook.com) - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid) - - [Markdown with Mermaid CLI](https://github.com/miao1007/gitbook-plugin-mermaid-cli) - [Mermaid plugin for GitBook](https://github.com/wwformat/gitbook-plugin-mermaid-pdf) + - [Markdown with Mermaid CLI](https://github.com/miao1007/gitbook-plugin-mermaid-cli) - [Gitea](https://gitea.io) ✅ - [GitHub](https://github.com) ✅ - [Using code blocks](https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/) ✅ - [GitHub action: Compile mermaid to image](https://github.com/neenjaw/compile-mermaid-markdown-action) - - [svg-generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator) - [GitHub Writer](https://github.com/ckeditor/github-writer) + - [svg-generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator) - [GitLab](https://docs.gitlab.com/ee/user/markdown.html#diagrams-and-flowcharts) ✅ - [Mermaid Plugin for JetBrains IDEs](https://plugins.jetbrains.com/plugin/20146-mermaid) - [Joplin](https://joplinapp.org) ✅ @@ -56,8 +56,8 @@ Below are a list of community plugins and integrations created with Mermaid. - [Obsidian](https://help.obsidian.md/Editing+and+formatting/Advanced+formatting+syntax#Diagram) ✅ - [Redmine](https://redmine.org) - [Mermaid Macro](https://www.redmine.org/plugins/redmine_mermaid_macro) - - [redmine-mermaid](https://github.com/styz/redmine_mermaid) - [markdown-for-mermaid-plugin](https://github.com/jamieh-mongolian/markdown-for-mermaid-plugin) + - [redmine-mermaid](https://github.com/styz/redmine_mermaid) - Visual Studio Code [Polyglot Interactive Notebooks](https://github.com/dotnet/interactive#net-interactive) ### CRM/ERP @@ -110,13 +110,13 @@ Communication tools and platforms ### Wikis - [DokuWiki](https://dokuwiki.org) - - [Mermaid Plugin](https://www.dokuwiki.org/plugin:mermaid) - [ComboStrap](https://combostrap.com/mermaid) + - [Mermaid Plugin](https://www.dokuwiki.org/plugin:mermaid) - [Foswiki](https://foswiki.org) - [Mermaid Plugin](https://foswiki.org/Extensions/MermaidPlugin) - [MediaWiki](https://www.mediawiki.org) - - [Mermaid Extension](https://www.mediawiki.org/wiki/Extension:Mermaid) - [Flex Diagrams Extension](https://www.mediawiki.org/wiki/Extension:Flex_Diagrams) + - [Mermaid Extension](https://www.mediawiki.org/wiki/Extension:Mermaid) - [Semantic Media Wiki](https://semantic-mediawiki.org) - [Mermaid Plugin](https://github.com/SemanticMediaWiki/Mermaid) - [TiddlyWiki](https://tiddlywiki.com/) @@ -161,18 +161,18 @@ Communication tools and platforms - [Sublime Text 3](https://sublimetext.com) - [Mermaid Package](https://packagecontrol.io/packages/Mermaid) - [VS Code](https://code.visualstudio.com/) - - [Markdown Preview Mermaid Support](https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid) - - [Mermaid Preview](https://marketplace.visualstudio.com/items?itemName=vstirbu.vscode-mermaid-preview) - - [Markdown Preview Enhanced](https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced) - - [Mermaid Markdown Syntax Highlighting](https://marketplace.visualstudio.com/items?itemName=bpruitt-goddard.mermaid-markdown-syntax-highlighting) - [Mermaid Editor](https://marketplace.visualstudio.com/items?itemName=tomoyukim.vscode-mermaid-editor) - [Mermaid Export](https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.mermaid-export) - [Markdown PDF](https://marketplace.visualstudio.com/items?itemName=yzane.markdown-pdf) + - [Markdown Preview Mermaid Support](https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid) + - [Markdown Preview Enhanced](https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced) + - [Mermaid Preview](https://marketplace.visualstudio.com/items?itemName=vstirbu.vscode-mermaid-preview) - [Preview](https://marketplace.visualstudio.com/items?itemName=searKing.preview-vscode) - [Preview Sequence Diagrams](https://marketplace.visualstudio.com/items?itemName=arichika.previewseqdiag-vscode) + - [Mermaid Markdown Syntax Highlighting](https://marketplace.visualstudio.com/items?itemName=bpruitt-goddard.mermaid-markdown-syntax-highlighting) - [Vim](https://www.vim.org) - - [Official Vim Syntax and ftplugin](https://github.com/craigmac/vim-mermaid) - [Vim Diagram Syntax](https://github.com/zhaozg/vim-diagram) + - [Official Vim Syntax and ftplugin](https://github.com/craigmac/vim-mermaid) ### Document Generation @@ -228,8 +228,8 @@ Communication tools and platforms - [mermaid-isomorphic](https://github.com/remcohaszing/mermaid-isomorphic) - [mermaid-server: Generate diagrams using a HTTP request](https://github.com/TomWright/mermaid-server) - [NiceGUI: Let any browser be the frontend of your Python code](https://nicegui.io) - - [ui.mermaid(...)](https://nicegui.io/reference#mermaid_diagrams) - [ui.markdown(..., extras=['mermaid'])](https://nicegui.io/reference#markdown_element) + - [ui.mermaid(...)](https://nicegui.io/reference#mermaid_diagrams) - [Reveal.js](https://github.com/hakimel/reveal.js) - [reveal.js-mermaid-plugin](https://github.com/ludwick/reveal.js-mermaid-plugin) - [Reveal CK](https://github.com/jedcn/reveal-ck) From aaf9fd5f03d55d7389d4a1afbeb978dafeeeecb8 Mon Sep 17 00:00:00 2001 From: Ronid1 Date: Thu, 23 Nov 2023 16:21:12 -0800 Subject: [PATCH 010/170] update and verify links --- docs/ecosystem/integrations-community.md | 47 +++++++++--------- .../docs/ecosystem/integrations-community.md | 48 +++++++++---------- 2 files changed, 46 insertions(+), 49 deletions(-) diff --git a/docs/ecosystem/integrations-community.md b/docs/ecosystem/integrations-community.md index 0b560cc91..2db6b00e1 100644 --- a/docs/ecosystem/integrations-community.md +++ b/docs/ecosystem/integrations-community.md @@ -30,8 +30,8 @@ Below are a list of community plugins and integrations created with Mermaid. - [Auto convert diagrams in Jira](https://github.com/coddingtonbear/jirafs-mermaid) - [Mermaid Charts & Diagrams for Jira](https://marketplace.atlassian.com/apps/1224537/) - [Mermaid for Jira Cloud - Draw UML diagrams easily](https://marketplace.atlassian.com/apps/1223053/mermaid-for-jira-cloud-draw-uml-diagrams-easily?hosting=cloud&tab=overview) - - [CloudScript.io Addon](https://marketplace.atlassian.com/apps/1219878/cloudscript-io-mermaid-addon?hosting=cloud&tab=overview) -- [Azure Devops](https://docs.microsoft.com/en-us/azure/devops/project/wiki/wiki-markdown-guidance?view=azure-devops#add-mermaid-diagrams-to-a-wiki-page) ✅ + - [CloudScript.io Mermaid Addon](https://marketplace.atlassian.com/apps/1219878/cloudscript-io-mermaid-addon?hosting=cloud&tab=overview) +- [Azure Devops](https://learn.microsoft.com/en-us/azure/devops/project/wiki/markdown-guidance?view=azure-devops#add-mermaid-diagrams-to-a-wiki-page) ✅ - [Deepdwn](https://billiam.itch.io/deepdwn) ✅ - [GitBook](https://gitbook.com) - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid) @@ -42,23 +42,23 @@ Below are a list of community plugins and integrations created with Mermaid. - [Using code blocks](https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/) ✅ - [GitHub action: Compile mermaid to image](https://github.com/neenjaw/compile-mermaid-markdown-action) - [GitHub Writer](https://github.com/ckeditor/github-writer) - - [svg-generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator) + - [SVG diagram generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator) - [GitLab](https://docs.gitlab.com/ee/user/markdown.html#diagrams-and-flowcharts) ✅ - [Mermaid Plugin for JetBrains IDEs](https://plugins.jetbrains.com/plugin/20146-mermaid) - [Joplin](https://joplinapp.org) ✅ - [LiveBook](https://livebook.dev) ✅ - [Tuleap](https://docs.tuleap.org/user-guide/writing-in-tuleap.html#graphs) ✅ - [Mermaid Flow Visual Editor](https://www.mermaidflow.app) ✅ -- [mermerd](https://github.com/KarnerTh/mermerd) +- [Mermerd](https://github.com/KarnerTh/mermerd) - [Slab](https://slab.com) ✅ -- [Swimm](https://swimm.io) ✅ +- [Swimm](https://docs.swimm.io/Features/diagrams-and-charts) ✅ - [NotesHub](https://noteshub.app) ✅ - [Notion](https://notion.so) ✅ - [Observable](https://observablehq.com/@observablehq/mermaid) ✅ - [Obsidian](https://help.obsidian.md/Editing+and+formatting/Advanced+formatting+syntax#Diagram) ✅ - [Redmine](https://redmine.org) - [Mermaid Macro](https://www.redmine.org/plugins/redmine_mermaid_macro) - - [markdown-for-mermaid-plugin](https://github.com/jamieh-mongolian/markdown-for-mermaid-plugin) + - [Markdown for mermaid plugin](https://github.com/jamieh-mongolian/markdown-for-mermaid-plugin) - [redmine-mermaid](https://github.com/styz/redmine_mermaid) - Visual Studio Code [Polyglot Interactive Notebooks](https://github.com/dotnet/interactive#net-interactive) @@ -87,7 +87,7 @@ Blogging frameworks and platforms Content Management Systems/Enterprise Content Management - [Grav CMS](https://getgrav.org/) - - [Mermaid Diagrams](https://github.com/DanielFlaum/grav-plugin-mermaid-diagrams) + - [Mermaid Diagrams Plugin](https://github.com/DanielFlaum/grav-plugin-mermaid-diagrams) - [GitLab Markdown Adapter](https://github.com/Goutte/grav-plugin-gitlab-markdown-adapter) - [VitePress](https://vitepress.vuejs.org/) - [Plugin for Mermaid.js](https://emersonbottero.github.io/vitepress-plugin-mermaid/) @@ -99,15 +99,15 @@ Content Management Systems/Enterprise Content Management Communication tools and platforms - [Discourse](https://discourse.org) - - [Mermaid Plugin](https://github.com/pnewell/discourse-mermaid), [And](https://github.com/unfoldingWord-dev/discourse-mermaid) + - [Mermaid Plugin](https://github.com/pnewell/discourse-mermaid) - [Mattermost](https://mattermost.com/) - [Mermaid Plugin](https://github.com/SpikeTings/Mermaid) - [NodeBB](https://nodebb.org) - - [Mermaid Plugin](https://www.npmjs.com/package/nodebb-plugin-mermaid) + - [Mermaid Parser Plugin](https://www.npmjs.com/package/nodebb-plugin-mermaid) - [phpBB](https://phpbb.com) - [phpbb-ext-mermaid](https://github.com/AlfredoRamos/phpbb-ext-mermaid) - [Slack](https://slack.com) - - [Mermaid for Slack](https://github.com/JackuB/mermaid-for-slack) + - [Mermaid Preview](https://github.com/JackuB/mermaid-for-slack) ### Wikis @@ -122,8 +122,8 @@ Communication tools and platforms - [Semantic Media Wiki](https://semantic-mediawiki.org) - [Mermaid Plugin](https://github.com/SemanticMediaWiki/Mermaid) - [TiddlyWiki](https://tiddlywiki.com/) - - [mermaid-tw5: full js library](https://github.com/efurlanm/mermaid-tw5) - - [tw5-mermaid: wrapper for Mermaid Live](https://github.com/jasonmhoule/tw5-mermaid) + - [mermaid-tw5: wrapper for Mermaid Live](https://github.com/efurlanm/mermaid-tw5) + - [tw5-mermaid: plugin for managing Mermaid.js tiddlers](https://github.com/jasonmhoule/tw5-mermaid) ### Editor Plugins @@ -137,7 +137,8 @@ Communication tools and platforms - [Mermaid Preview](https://github.com/AlanHohn/mermaid-preview) - [CKEditor](https://github.com/ckeditor/ckeditor5) - [CKEditor 5 Mermaid plugin](https://github.com/ckeditor/ckeditor5-mermaid) -- [Draw.io](https://draw.io) - [Plugin](https://github.com/nopeslide/drawio_mermaid_plugin) +- [Draw.io](https://draw.io) + - [Mermaid Plugin](https://github.com/nopeslide/drawio_mermaid_plugin) - [GNU Emacs](https://www.gnu.org/software/emacs/) - [Major mode for .mmd files](https://github.com/abrochard/mermaid-mode) - [Org-Mode integration](https://github.com/arnm/ob-mermaid) @@ -145,9 +146,8 @@ Communication tools and platforms - [Nano Mermaid](https://github.com/Yash-Singh1/nano-mermaid) - [Google docs](https://docs.google.com/) - [Mermaid plugin for google docs](https://workspace.google.com/marketplace/app/mermaid/636321283856) -- [Inkdrop](https://www.inkdrop.app) - [Plugin](https://github.com/inkdropapp/inkdrop-mermaid) -- [Iodide](https://github.com/iodide-project/iodide) - - [iodide-mermaid-plugin](https://github.com/iodide-project/iodide-mermaid-plugin) +- [Inkdrop](https://www.inkdrop.app) + - [Mermaid Plugin](https://github.com/inkdropapp/inkdrop-mermaid) - [Light Table](http://lighttable.com/) - [Mermaid Plugin](https://github.com/cldwalker/Mermaid) - [Markdown-It](https://github.com/markdown-it/markdown-it) @@ -157,9 +157,9 @@ Communication tools and platforms - [markdown-it-mermaid-fence-new](https://github.com/Revomatico/markdown-it-mermaid-fence-new) - [markdown-it-mermaid-less](https://github.com/searKing/markdown-it-mermaid-less) - [Podlite](https://github.com/zag/podlite-desktop) - - [Named block =Diagram](https://github.com/zag/podlite/tree/main/packages/podlite-diagrams) + - [=Diagram block](https://github.com/zag/podlite/tree/main/packages/podlite-diagrams) - [Standard Notes](https://standardnotes.com/) - - [sn-mermaid](https://github.com/nienow/sn-mermaid) + - [Mermaid Extension](https://github.com/nienow/sn-mermaid) - [Sublime Text 3](https://sublimetext.com) - [Mermaid Package](https://packagecontrol.io/packages/Mermaid) - [VS Code](https://code.visualstudio.com/) @@ -174,7 +174,7 @@ Communication tools and platforms - [Mermaid Markdown Syntax Highlighting](https://marketplace.visualstudio.com/items?itemName=bpruitt-goddard.mermaid-markdown-syntax-highlighting) - [Vim](https://www.vim.org) - [Vim Diagram Syntax](https://github.com/zhaozg/vim-diagram) - - [Official Vim Syntax and ftplugin](https://github.com/craigmac/vim-mermaid) + - [Official Vim Syntax and ft plugin](https://github.com/craigmac/vim-mermaid) ### Document Generation @@ -186,7 +186,7 @@ Communication tools and platforms - [gatsby-remark-mermaid](https://github.com/remcohaszing/gatsby-remark-mermaid) - [JSDoc](https://jsdoc.app/) - [jsdoc-mermaid](https://github.com/Jellyvision/jsdoc-mermaid) -- [mdbook](https://rust-lang.github.io/mdBook/index.html) +- [mdBook](https://rust-lang.github.io/mdBook/index.html) - [mdbook-mermaid](https://github.com/badboy/mdbook-mermaid) - [MkDocs](https://www.mkdocs.org) - [mkdocs-mermaid2-plugin](https://github.com/fralau/mkdocs-mermaid2-plugin) @@ -201,7 +201,7 @@ Communication tools and platforms - [Swimm - Up-to-date diagrams with Swimm, the knowledge management tool for code](https://docs.swimm.io/features/diagrams-and-charts/#mermaid--swimm--up-to-date-diagrams-) - [Type Doc](https://typedoc.org/) - [typedoc-plugin-mermaid](https://www.npmjs.com/package/typedoc-plugin-mermaid) -- [Typora](https://typora.io/) ([native support](https://support.typora.io/Draw-Diagrams-With-Markdown/#mermaid)) +- [Typora](https://support.typora.io/Draw-Diagrams-With-Markdown/#mermaid) ✅ ### Browser Extensions @@ -212,7 +212,7 @@ Communication tools and platforms | Diagram Tab | - | - | - | - | [🐙🔗](https://github.com/khafast/diagramtab) | | Markdown Diagrams | [🎡🔗](https://chrome.google.com/webstore/detail/markdown-diagrams/pmoglnmodacnbbofbgcagndelmgaclel/) | [🦊🔗](https://addons.mozilla.org/en-US/firefox/addon/markdown-diagrams/) | [🔴🔗](https://addons.opera.com/en/extensions/details/markdown-diagrams/) | [🌀🔗](https://microsoftedge.microsoft.com/addons/detail/markdown-diagrams/hceenoomhhdkjjijnmlclkpenkapfihe) | [🐙🔗](https://github.com/marcozaccari/markdown-diagrams-browser-extension/tree/master/doc/examples) | | Markdown Viewer | - | [🦊🔗](https://addons.mozilla.org/en-US/firefox/addon/markdown-viewer-chrome/) | - | - | [🐙🔗](https://github.com/simov/markdown-viewer) | -| Extensions for Mermaid | - | [🦊🔗](https://addons.mozilla.org/en-US/firefox/addon/markdown-viewer-chrome/) | [🔴🔗](https://addons.opera.com/en/extensions/details/extensions-for-mermaid/) | - | [🐙🔗](https://github.com/Stefan-S/mermaid-extension) | +| Extensions for Mermaid | - | - | [🔴🔗](https://addons.opera.com/en/extensions/details/extensions-for-mermaid/) | - | [🐙🔗](https://github.com/Stefan-S/mermaid-extension) | | Chrome Diagrammer | [🎡🔗](https://chrome.google.com/webstore/detail/chrome-diagrammer/bkpbgjmkomfoakfklcjeoegkklgjnnpk) | - | - | - | - | | Mermaid Diagrams | [🎡🔗](https://chrome.google.com/webstore/detail/mermaid-diagrams/phfcghedmopjadpojhmmaffjmfiakfil) | - | - | - | - | | Monkeys | [🎡🔗](https://chrome.google.com/webstore/detail/monkeys-mermaid-for-githu/cplfdpoajbclbgphaphphcldamfkjlgi) | - | - | - | - | @@ -230,8 +230,7 @@ Communication tools and platforms - [mermaid-isomorphic](https://github.com/remcohaszing/mermaid-isomorphic) - [mermaid-server: Generate diagrams using a HTTP request](https://github.com/TomWright/mermaid-server) - [NiceGUI: Let any browser be the frontend of your Python code](https://nicegui.io) - - [ui.markdown(..., extras=\['mermaid'\])](https://nicegui.io/reference#markdown_element) - - [ui.mermaid(...)](https://nicegui.io/reference#mermaid_diagrams) + - [ui.mermaid(...)](https://nicegui.io/documentation/mermaid) - [Reveal.js](https://github.com/hakimel/reveal.js) - [reveal.js-mermaid-plugin](https://github.com/ludwick/reveal.js-mermaid-plugin) - [Reveal CK](https://github.com/jedcn/reveal-ck) diff --git a/packages/mermaid/src/docs/ecosystem/integrations-community.md b/packages/mermaid/src/docs/ecosystem/integrations-community.md index d64f06875..8fab1daa8 100644 --- a/packages/mermaid/src/docs/ecosystem/integrations-community.md +++ b/packages/mermaid/src/docs/ecosystem/integrations-community.md @@ -28,8 +28,8 @@ Below are a list of community plugins and integrations created with Mermaid. - [Auto convert diagrams in Jira](https://github.com/coddingtonbear/jirafs-mermaid) - [Mermaid Charts & Diagrams for Jira](https://marketplace.atlassian.com/apps/1224537/) - [Mermaid for Jira Cloud - Draw UML diagrams easily](https://marketplace.atlassian.com/apps/1223053/mermaid-for-jira-cloud-draw-uml-diagrams-easily?hosting=cloud&tab=overview) - - [CloudScript.io Addon](https://marketplace.atlassian.com/apps/1219878/cloudscript-io-mermaid-addon?hosting=cloud&tab=overview) -- [Azure Devops](https://docs.microsoft.com/en-us/azure/devops/project/wiki/wiki-markdown-guidance?view=azure-devops#add-mermaid-diagrams-to-a-wiki-page) ✅ + - [CloudScript.io Mermaid Addon](https://marketplace.atlassian.com/apps/1219878/cloudscript-io-mermaid-addon?hosting=cloud&tab=overview) +- [Azure Devops](https://learn.microsoft.com/en-us/azure/devops/project/wiki/markdown-guidance?view=azure-devops#add-mermaid-diagrams-to-a-wiki-page) ✅ - [Deepdwn](https://billiam.itch.io/deepdwn) ✅ - [GitBook](https://gitbook.com) - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid) @@ -40,23 +40,23 @@ Below are a list of community plugins and integrations created with Mermaid. - [Using code blocks](https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/) ✅ - [GitHub action: Compile mermaid to image](https://github.com/neenjaw/compile-mermaid-markdown-action) - [GitHub Writer](https://github.com/ckeditor/github-writer) - - [svg-generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator) + - [SVG diagram generator](https://github.com/SimonKenyonShepard/mermaidjs-github-svg-generator) - [GitLab](https://docs.gitlab.com/ee/user/markdown.html#diagrams-and-flowcharts) ✅ - [Mermaid Plugin for JetBrains IDEs](https://plugins.jetbrains.com/plugin/20146-mermaid) - [Joplin](https://joplinapp.org) ✅ - [LiveBook](https://livebook.dev) ✅ - [Tuleap](https://docs.tuleap.org/user-guide/writing-in-tuleap.html#graphs) ✅ - [Mermaid Flow Visual Editor](https://www.mermaidflow.app) ✅ -- [mermerd](https://github.com/KarnerTh/mermerd) +- [Mermerd](https://github.com/KarnerTh/mermerd) - [Slab](https://slab.com) ✅ -- [Swimm](https://swimm.io) ✅ +- [Swimm](https://docs.swimm.io/Features/diagrams-and-charts#mermaid--swimm--up-to-date-diagrams-) ✅ - [NotesHub](https://noteshub.app) ✅ - [Notion](https://notion.so) ✅ - [Observable](https://observablehq.com/@observablehq/mermaid) ✅ - [Obsidian](https://help.obsidian.md/Editing+and+formatting/Advanced+formatting+syntax#Diagram) ✅ - [Redmine](https://redmine.org) - [Mermaid Macro](https://www.redmine.org/plugins/redmine_mermaid_macro) - - [markdown-for-mermaid-plugin](https://github.com/jamieh-mongolian/markdown-for-mermaid-plugin) + - [Markdown for mermaid plugin](https://github.com/jamieh-mongolian/markdown-for-mermaid-plugin) - [redmine-mermaid](https://github.com/styz/redmine_mermaid) - Visual Studio Code [Polyglot Interactive Notebooks](https://github.com/dotnet/interactive#net-interactive) @@ -85,7 +85,7 @@ Blogging frameworks and platforms Content Management Systems/Enterprise Content Management - [Grav CMS](https://getgrav.org/) - - [Mermaid Diagrams](https://github.com/DanielFlaum/grav-plugin-mermaid-diagrams) + - [Mermaid Diagrams Plugin](https://github.com/DanielFlaum/grav-plugin-mermaid-diagrams) - [GitLab Markdown Adapter](https://github.com/Goutte/grav-plugin-gitlab-markdown-adapter) - [VitePress](https://vitepress.vuejs.org/) - [Plugin for Mermaid.js](https://emersonbottero.github.io/vitepress-plugin-mermaid/) @@ -97,15 +97,15 @@ Content Management Systems/Enterprise Content Management Communication tools and platforms - [Discourse](https://discourse.org) - - [Mermaid Plugin](https://github.com/pnewell/discourse-mermaid), [And](https://github.com/unfoldingWord-dev/discourse-mermaid) + - [Mermaid Plugin](https://github.com/pnewell/discourse-mermaid) - [Mattermost](https://mattermost.com/) - [Mermaid Plugin](https://github.com/SpikeTings/Mermaid) - [NodeBB](https://nodebb.org) - - [Mermaid Plugin](https://www.npmjs.com/package/nodebb-plugin-mermaid) + - [Mermaid Parser Plugin](https://www.npmjs.com/package/nodebb-plugin-mermaid) - [phpBB](https://phpbb.com) - [phpbb-ext-mermaid](https://github.com/AlfredoRamos/phpbb-ext-mermaid) - [Slack](https://slack.com) - - [Mermaid for Slack](https://github.com/JackuB/mermaid-for-slack) + - [Mermaid Preview](https://github.com/JackuB/mermaid-for-slack) ### Wikis @@ -120,8 +120,8 @@ Communication tools and platforms - [Semantic Media Wiki](https://semantic-mediawiki.org) - [Mermaid Plugin](https://github.com/SemanticMediaWiki/Mermaid) - [TiddlyWiki](https://tiddlywiki.com/) - - [mermaid-tw5: full js library](https://github.com/efurlanm/mermaid-tw5) - - [tw5-mermaid: wrapper for Mermaid Live](https://github.com/jasonmhoule/tw5-mermaid) + - [mermaid-tw5: wrapper for Mermaid Live](https://github.com/efurlanm/mermaid-tw5) + - [tw5-mermaid: plugin for managing Mermaid.js tiddlers](https://github.com/jasonmhoule/tw5-mermaid) ### Editor Plugins @@ -135,7 +135,8 @@ Communication tools and platforms - [Mermaid Preview](https://github.com/AlanHohn/mermaid-preview) - [CKEditor](https://github.com/ckeditor/ckeditor5) - [CKEditor 5 Mermaid plugin](https://github.com/ckeditor/ckeditor5-mermaid) -- [Draw.io](https://draw.io) - [Plugin](https://github.com/nopeslide/drawio_mermaid_plugin) +- [Draw.io](https://draw.io) + - [Mermaid Plugin](https://github.com/nopeslide/drawio_mermaid_plugin) - [GNU Emacs](https://www.gnu.org/software/emacs/) - [Major mode for .mmd files](https://github.com/abrochard/mermaid-mode) - [Org-Mode integration](https://github.com/arnm/ob-mermaid) @@ -143,9 +144,8 @@ Communication tools and platforms - [Nano Mermaid](https://github.com/Yash-Singh1/nano-mermaid) - [Google docs](https://docs.google.com/) - [Mermaid plugin for google docs](https://workspace.google.com/marketplace/app/mermaid/636321283856) -- [Inkdrop](https://www.inkdrop.app) - [Plugin](https://github.com/inkdropapp/inkdrop-mermaid) -- [Iodide](https://github.com/iodide-project/iodide) - - [iodide-mermaid-plugin](https://github.com/iodide-project/iodide-mermaid-plugin) +- [Inkdrop](https://www.inkdrop.app) + - [Mermaid Plugin](https://github.com/inkdropapp/inkdrop-mermaid) - [Light Table](http://lighttable.com/) - [Mermaid Plugin](https://github.com/cldwalker/Mermaid) - [Markdown-It](https://github.com/markdown-it/markdown-it) @@ -155,9 +155,9 @@ Communication tools and platforms - [markdown-it-mermaid-fence-new](https://github.com/Revomatico/markdown-it-mermaid-fence-new) - [markdown-it-mermaid-less](https://github.com/searKing/markdown-it-mermaid-less) - [Podlite](https://github.com/zag/podlite-desktop) - - [Named block =Diagram](https://github.com/zag/podlite/tree/main/packages/podlite-diagrams) + - [=Diagram block](https://github.com/zag/podlite/tree/main/packages/podlite-diagrams) - [Standard Notes](https://standardnotes.com/) - - [sn-mermaid](https://github.com/nienow/sn-mermaid) + - [Mermaid Extension](https://github.com/nienow/sn-mermaid) - [Sublime Text 3](https://sublimetext.com) - [Mermaid Package](https://packagecontrol.io/packages/Mermaid) - [VS Code](https://code.visualstudio.com/) @@ -172,7 +172,7 @@ Communication tools and platforms - [Mermaid Markdown Syntax Highlighting](https://marketplace.visualstudio.com/items?itemName=bpruitt-goddard.mermaid-markdown-syntax-highlighting) - [Vim](https://www.vim.org) - [Vim Diagram Syntax](https://github.com/zhaozg/vim-diagram) - - [Official Vim Syntax and ftplugin](https://github.com/craigmac/vim-mermaid) + - [Official Vim Syntax and ft plugin](https://github.com/craigmac/vim-mermaid) ### Document Generation @@ -184,7 +184,7 @@ Communication tools and platforms - [gatsby-remark-mermaid](https://github.com/remcohaszing/gatsby-remark-mermaid) - [JSDoc](https://jsdoc.app/) - [jsdoc-mermaid](https://github.com/Jellyvision/jsdoc-mermaid) -- [mdbook](https://rust-lang.github.io/mdBook/index.html) +- [mdBook](https://rust-lang.github.io/mdBook/index.html) - [mdbook-mermaid](https://github.com/badboy/mdbook-mermaid) - [MkDocs](https://www.mkdocs.org) - [mkdocs-mermaid2-plugin](https://github.com/fralau/mkdocs-mermaid2-plugin) @@ -196,10 +196,9 @@ Communication tools and platforms - [remark-mermaidjs](https://github.com/remcohaszing/remark-mermaidjs) - [Sphinx](https://www.sphinx-doc.org/en/master/) - [sphinxcontrib-mermaid](https://github.com/mgaitan/sphinxcontrib-mermaid) -- [Swimm - Up-to-date diagrams with Swimm, the knowledge management tool for code](https://docs.swimm.io/Features/diagrams-and-charts#mermaid--swimm--up-to-date-diagrams-) - [Type Doc](https://typedoc.org/) - [typedoc-plugin-mermaid](https://www.npmjs.com/package/typedoc-plugin-mermaid) -- [Typora](https://typora.io/) ([native support](https://support.typora.io/Draw-Diagrams-With-Markdown/#mermaid)) +- [Typora](https://support.typora.io/Draw-Diagrams-With-Markdown/#mermaid) ✅ ### Browser Extensions @@ -210,7 +209,7 @@ Communication tools and platforms | Diagram Tab | - | - | - | - | [🐙🔗](https://github.com/khafast/diagramtab) | | Markdown Diagrams | [🎡🔗](https://chrome.google.com/webstore/detail/markdown-diagrams/pmoglnmodacnbbofbgcagndelmgaclel/) | [🦊🔗](https://addons.mozilla.org/en-US/firefox/addon/markdown-diagrams/) | [🔴🔗](https://addons.opera.com/en/extensions/details/markdown-diagrams/) | [🌀🔗](https://microsoftedge.microsoft.com/addons/detail/markdown-diagrams/hceenoomhhdkjjijnmlclkpenkapfihe) | [🐙🔗](https://github.com/marcozaccari/markdown-diagrams-browser-extension/tree/master/doc/examples) | | Markdown Viewer | - | [🦊🔗](https://addons.mozilla.org/en-US/firefox/addon/markdown-viewer-chrome/) | - | - | [🐙🔗](https://github.com/simov/markdown-viewer) | -| Extensions for Mermaid | - | [🦊🔗](https://addons.mozilla.org/en-US/firefox/addon/markdown-viewer-chrome/) | [🔴🔗](https://addons.opera.com/en/extensions/details/extensions-for-mermaid/) | - | [🐙🔗](https://github.com/Stefan-S/mermaid-extension) | +| Extensions for Mermaid | - | - | [🔴🔗](https://addons.opera.com/en/extensions/details/extensions-for-mermaid/) | - | [🐙🔗](https://github.com/Stefan-S/mermaid-extension) | | Chrome Diagrammer | [🎡🔗](https://chrome.google.com/webstore/detail/chrome-diagrammer/bkpbgjmkomfoakfklcjeoegkklgjnnpk) | - | - | - | - | | Mermaid Diagrams | [🎡🔗](https://chrome.google.com/webstore/detail/mermaid-diagrams/phfcghedmopjadpojhmmaffjmfiakfil) | - | - | - | - | | Monkeys | [🎡🔗](https://chrome.google.com/webstore/detail/monkeys-mermaid-for-githu/cplfdpoajbclbgphaphphcldamfkjlgi) | - | - | - | - | @@ -228,8 +227,7 @@ Communication tools and platforms - [mermaid-isomorphic](https://github.com/remcohaszing/mermaid-isomorphic) - [mermaid-server: Generate diagrams using a HTTP request](https://github.com/TomWright/mermaid-server) - [NiceGUI: Let any browser be the frontend of your Python code](https://nicegui.io) - - [ui.markdown(..., extras=['mermaid'])](https://nicegui.io/reference#markdown_element) - - [ui.mermaid(...)](https://nicegui.io/reference#mermaid_diagrams) + - [ui.mermaid(...)](https://nicegui.io/documentation/mermaid) - [Reveal.js](https://github.com/hakimel/reveal.js) - [reveal.js-mermaid-plugin](https://github.com/ludwick/reveal.js-mermaid-plugin) - [Reveal CK](https://github.com/jedcn/reveal-ck) From 201016ccc5bfa73e13577702369caffef6fb56a1 Mon Sep 17 00:00:00 2001 From: Ronid1 Date: Thu, 23 Nov 2023 20:57:43 -0800 Subject: [PATCH 011/170] update build docs --- docs/ecosystem/integrations-community.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/docs/ecosystem/integrations-community.md b/docs/ecosystem/integrations-community.md index 2db6b00e1..804641766 100644 --- a/docs/ecosystem/integrations-community.md +++ b/docs/ecosystem/integrations-community.md @@ -51,7 +51,7 @@ Below are a list of community plugins and integrations created with Mermaid. - [Mermaid Flow Visual Editor](https://www.mermaidflow.app) ✅ - [Mermerd](https://github.com/KarnerTh/mermerd) - [Slab](https://slab.com) ✅ -- [Swimm](https://docs.swimm.io/Features/diagrams-and-charts) ✅ +- [Swimm](https://docs.swimm.io/Features/diagrams-and-charts#mermaid--swimm--up-to-date-diagrams-) ✅ - [NotesHub](https://noteshub.app) ✅ - [Notion](https://notion.so) ✅ - [Observable](https://observablehq.com/@observablehq/mermaid) ✅ @@ -198,7 +198,6 @@ Communication tools and platforms - [remark-mermaidjs](https://github.com/remcohaszing/remark-mermaidjs) - [Sphinx](https://www.sphinx-doc.org/en/master/) - [sphinxcontrib-mermaid](https://github.com/mgaitan/sphinxcontrib-mermaid) -- [Swimm - Up-to-date diagrams with Swimm, the knowledge management tool for code](https://docs.swimm.io/features/diagrams-and-charts/#mermaid--swimm--up-to-date-diagrams-) - [Type Doc](https://typedoc.org/) - [typedoc-plugin-mermaid](https://www.npmjs.com/package/typedoc-plugin-mermaid) - [Typora](https://support.typora.io/Draw-Diagrams-With-Markdown/#mermaid) ✅ From 5b705cf94ff3a595885077d8ad640801c27f591c Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 24 Nov 2023 14:11:49 +0530 Subject: [PATCH 012/170] v10.6.2-rc.1 --- packages/mermaid/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/package.json b/packages/mermaid/package.json index 17f60d879..dc1ae320a 100644 --- a/packages/mermaid/package.json +++ b/packages/mermaid/package.json @@ -1,6 +1,6 @@ { "name": "mermaid", - "version": "10.6.1", + "version": "10.6.2-rc.1", "description": "Markdown-ish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.", "type": "module", "module": "./dist/mermaid.core.mjs", From c0b80df1cbd75ab28f151ff20b2f21184ccfda34 Mon Sep 17 00:00:00 2001 From: Steph <35910788+huynhicode@users.noreply.github.com> Date: Mon, 27 Nov 2023 11:36:56 -0800 Subject: [PATCH 013/170] update announcement bar verbiage --- .../src/docs/.vitepress/components/TopBar.vue | 19 +++++++++++-------- .../src/docs/.vitepress/theme/index.ts | 6 +++--- 2 files changed, 14 insertions(+), 11 deletions(-) diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue index d0a202c58..16da73c91 100644 --- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue +++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue @@ -2,13 +2,16 @@
- - We've made our Product Hunt debut!   - Show us some love and help spread the word, plus receive 25% - off on annual Pro subscription! +

+ Happy Holidays! Get AI, team collaboration, storage, and more with + Mermaid Chart Pro. Use promo code: HOLIDAYS2023 to get + 25% off.View more details here. +

diff --git a/packages/mermaid/src/docs/.vitepress/theme/index.ts b/packages/mermaid/src/docs/.vitepress/theme/index.ts index 656157810..344d602bd 100644 --- a/packages/mermaid/src/docs/.vitepress/theme/index.ts +++ b/packages/mermaid/src/docs/.vitepress/theme/index.ts @@ -6,8 +6,8 @@ import Mermaid from './Mermaid.vue'; import Contributors from '../components/Contributors.vue'; // @ts-ignore import HomePage from '../components/HomePage.vue'; -// // @ts-ignore -// import TopBar from '../components/TopBar.vue'; +// @ts-ignore +import TopBar from '../components/TopBar.vue'; import { getRedirect } from './redirect.js'; @@ -22,7 +22,7 @@ export default { Layout() { return h(Theme.Layout, null, { // Keeping this as comment as it took a lot of time to figure out how to add a component to the top bar. - // 'home-hero-before': () => h(TopBar), + 'home-hero-before': () => h(TopBar), 'home-features-after': () => h(HomePage), }); }, From 8d53fa17da50627afc34fda2634395f6a8fdea84 Mon Sep 17 00:00:00 2001 From: Steph <35910788+huynhicode@users.noreply.github.com> Date: Mon, 27 Nov 2023 11:44:47 -0800 Subject: [PATCH 014/170] update announcements page --- docs/news/announcements.md | 13 +++++++++---- packages/mermaid/src/docs/news/announcements.md | 17 +++++++++++++---- 2 files changed, 22 insertions(+), 8 deletions(-) diff --git a/docs/news/announcements.md b/docs/news/announcements.md index 79e32f2f0..ec1525f26 100644 --- a/docs/news/announcements.md +++ b/docs/news/announcements.md @@ -6,10 +6,15 @@ # Announcements -Check out our latest blog posts below. See more blog posts [here](blog.md). +## [Mermaid Chart](https://www.mermaidchart.com/) is running a Holiday promotion 🎉 -## [5 Reasons You Should Be Using Mermaid Chart As Your Diagram Generator](https://www.mermaidchart.com/blog/posts/5-reasons-you-should-be-using-mermaid-chart-as-your-diagram-generator/) +### Use HOLIDAYS2023 to get 25% off a Pro subscription -14 November 2023 · 5 mins +With a Pro subscription, you will get access to: -Mermaid Chart, a user-friendly, code-based diagram generator with AI integrations, templates, collaborative tools, and plugins for developers, streamlines the process of creating and sharing diagrams, enhancing both creativity and collaboration. +- AI functionality +- Team collaboration and multi-user editing +- Unlimited diagrams +- and more! + +View details on how to redeem the promo code on the [Mermaid Chart website](https://www.mermaidchart.com/holiday-promo). diff --git a/packages/mermaid/src/docs/news/announcements.md b/packages/mermaid/src/docs/news/announcements.md index 7093d6fba..3f0b1352d 100644 --- a/packages/mermaid/src/docs/news/announcements.md +++ b/packages/mermaid/src/docs/news/announcements.md @@ -1,9 +1,18 @@ +--- +outline: 'deep' # shows all h3 headings in outline in Vitepress +--- + # Announcements -Check out our latest blog posts below. See more blog posts [here](blog.md). +## [Mermaid Chart](https://www.mermaidchart.com/) is running a Holiday promotion 🎉 -## [5 Reasons You Should Be Using Mermaid Chart As Your Diagram Generator](https://www.mermaidchart.com/blog/posts/5-reasons-you-should-be-using-mermaid-chart-as-your-diagram-generator/) +### Use HOLIDAYS2023 to get 25% off a Pro subscription -14 November 2023 · 5 mins +With a Pro subscription, you will get access to: -Mermaid Chart, a user-friendly, code-based diagram generator with AI integrations, templates, collaborative tools, and plugins for developers, streamlines the process of creating and sharing diagrams, enhancing both creativity and collaboration. +- AI functionality +- Team collaboration and multi-user editing +- Unlimited diagrams +- and more! + +View details on how to redeem the promo code on the [Mermaid Chart website](https://www.mermaidchart.com/holiday-promo). From af9566df75f897d5e304cc8b9f2e27e119903724 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Tue, 28 Nov 2023 11:42:04 +0530 Subject: [PATCH 015/170] Update packages/mermaid/src/docs/.vitepress/components/TopBar.vue --- packages/mermaid/src/docs/.vitepress/components/TopBar.vue | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue index 16da73c91..025bfcf1a 100644 --- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue +++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue @@ -8,7 +8,6 @@ 25% off.View more details here. From a1563c9f7d023371c358b654f904027b5e94dac1 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Tue, 28 Nov 2023 13:39:46 +0530 Subject: [PATCH 016/170] docs: Holiday promo v2 --- .../src/docs/.vitepress/components/TopBar.vue | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue index 025bfcf1a..ec68cff13 100644 --- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue +++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue @@ -3,14 +3,16 @@ class="w-full top-bar bg-gradient-to-r from-[#bd34fe] to-[#ff3670] flex items-center text-center justify-center p-1 text-white" >

- Happy Holidays! Get AI, team collaboration, storage, and more with - Mermaid Chart Pro. Use promo code: HOLIDAYS2023 to get - 25% off.View more details here. + Get AI, team collaboration, storage, and more with + Mermaid Chart Pro. Start free trial today & get 25% off. +

From 9be9601927ac7a62450e1794d7c8c8be1a61f8d8 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 1 Dec 2023 12:04:30 +0530 Subject: [PATCH 017/170] chore: Update promo link --- docs/news/announcements.md | 2 +- packages/mermaid/src/docs/.vitepress/components/TopBar.vue | 2 +- packages/mermaid/src/docs/news/announcements.md | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/news/announcements.md b/docs/news/announcements.md index ec1525f26..d1eaa525e 100644 --- a/docs/news/announcements.md +++ b/docs/news/announcements.md @@ -17,4 +17,4 @@ With a Pro subscription, you will get access to: - Unlimited diagrams - and more! -View details on how to redeem the promo code on the [Mermaid Chart website](https://www.mermaidchart.com/holiday-promo). +View details on how to redeem the promo code on the [Mermaid Chart website](https://www.mermaidchart.com/app/user/billing/checkout?coupon=HOLIDAYS2023). diff --git a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue index ec68cff13..6fdf78c61 100644 --- a/packages/mermaid/src/docs/.vitepress/components/TopBar.vue +++ b/packages/mermaid/src/docs/.vitepress/components/TopBar.vue @@ -4,7 +4,7 @@ >

diff --git a/packages/mermaid/src/docs/news/announcements.md b/packages/mermaid/src/docs/news/announcements.md index 3f0b1352d..6e947065f 100644 --- a/packages/mermaid/src/docs/news/announcements.md +++ b/packages/mermaid/src/docs/news/announcements.md @@ -15,4 +15,4 @@ With a Pro subscription, you will get access to: - Unlimited diagrams - and more! -View details on how to redeem the promo code on the [Mermaid Chart website](https://www.mermaidchart.com/holiday-promo). +View details on how to redeem the promo code on the [Mermaid Chart website](https://www.mermaidchart.com/app/user/billing/checkout?coupon=HOLIDAYS2023). From f02dfe60afb84cd7b3b482c8c37e4ff7c9080d43 Mon Sep 17 00:00:00 2001 From: futzmonitor Date: Sat, 2 Dec 2023 10:18:58 -0500 Subject: [PATCH 018/170] Changes to gnatt.jison 1. Removed the hash and semicolon symbols from the title regex to allow for their use. 2. Removed the hash and semicolon symbols from the section regex to allow for their use. 3. Removed the hash and semicolon symbols for the taskTxt regex to allow for their use. I did not remove the colon because the parser fails to recognize when the actual taskData begins if that distinctions isn't kept. 4. Removed the regex \#[^\n]* which skipped comments to fix some bugs with hash symbols in the taskTxt. I tested this changed by putting it back and using the comment to see if it was recognized as a comment, but I would receive a syntax error and the diagram would not be rendered. So, I think we can safely remove that line, BUT it would be best practice if someone else tested this change to ensure that this will not break anyone's Gantt diagrams. --- packages/mermaid/src/diagrams/gantt/parser/gantt.jison | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/packages/mermaid/src/diagrams/gantt/parser/gantt.jison b/packages/mermaid/src/diagrams/gantt/parser/gantt.jison index b4daab5dc..5479629ff 100644 --- a/packages/mermaid/src/diagrams/gantt/parser/gantt.jison +++ b/packages/mermaid/src/diagrams/gantt/parser/gantt.jison @@ -5,7 +5,7 @@ */ %lex -%options case-insensitive +%options case-insensitivegit %x click %x href @@ -31,7 +31,6 @@ accDescr\s*"{"\s* { this.begin("acc_descr_multili [\n]+ return 'NL'; \s+ /* skip whitespace */ -\#[^\n]* /* skip comments */ \%%[^\n]* /* skip comments */ /* @@ -86,10 +85,10 @@ weekday\s+friday return 'weekday_friday' weekday\s+saturday return 'weekday_saturday' weekday\s+sunday return 'weekday_sunday' \d\d\d\d"-"\d\d"-"\d\d return 'date'; -"title"\s[^#\n;]+ return 'title'; +"title"\s[^\n]+ return 'title'; "accDescription"\s[^#\n;]+ return 'accDescription' -"section"\s[^#:\n;]+ return 'section'; -[^#:\n;]+ return 'taskTxt'; +"section"\s[^\n]+ return 'section'; +[^:\n]+ return 'taskTxt'; ":"[^#\n;]+ return 'taskData'; ":" return ':'; <> return 'EOF'; From 68ff352f2db2a3d2b696ee494ee808b807817d34 Mon Sep 17 00:00:00 2001 From: futzmonitor Date: Sat, 2 Dec 2023 10:26:46 -0500 Subject: [PATCH 019/170] Changes to gantt.jison 1. Removed typo --- packages/mermaid/src/diagrams/gantt/parser/gantt.jison | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/gantt/parser/gantt.jison b/packages/mermaid/src/diagrams/gantt/parser/gantt.jison index 5479629ff..9866e8ba0 100644 --- a/packages/mermaid/src/diagrams/gantt/parser/gantt.jison +++ b/packages/mermaid/src/diagrams/gantt/parser/gantt.jison @@ -5,7 +5,7 @@ */ %lex -%options case-insensitivegit +%options case-insensitive %x click %x href From 8e95cdb8832722c0b646b5db3455bb2555c37a0d Mon Sep 17 00:00:00 2001 From: futzmonitor Date: Sat, 2 Dec 2023 12:56:58 -0500 Subject: [PATCH 020/170] Changes to gantt.jison 1. Consistent spacing on line 30 --- packages/mermaid/src/diagrams/gantt/parser/gantt.jison | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/gantt/parser/gantt.jison b/packages/mermaid/src/diagrams/gantt/parser/gantt.jison index 9866e8ba0..d6027fee9 100644 --- a/packages/mermaid/src/diagrams/gantt/parser/gantt.jison +++ b/packages/mermaid/src/diagrams/gantt/parser/gantt.jison @@ -27,7 +27,7 @@ accDescr\s*"{"\s* { this.begin("acc_descr_multili \%\%(?!\{)*[^\n]* /* skip comments */ [^\}]\%\%*[^\n]* /* skip comments */ -\%\%*[^\n]*[\n]* /* do nothing */ +\%\%*[^\n]*[\n]* /* do nothing */ [\n]+ return 'NL'; \s+ /* skip whitespace */ From 60ea9a29720a951af2dc1e44c3b422d47d0e3325 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Mon, 4 Dec 2023 12:20:40 +0530 Subject: [PATCH 021/170] v10.6.2-rc.2 --- packages/mermaid/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/package.json b/packages/mermaid/package.json index dc1ae320a..654955fe5 100644 --- a/packages/mermaid/package.json +++ b/packages/mermaid/package.json @@ -1,6 +1,6 @@ { "name": "mermaid", - "version": "10.6.2-rc.1", + "version": "10.6.2-rc.2", "description": "Markdown-ish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.", "type": "module", "module": "./dist/mermaid.core.mjs", From 80fa3e959783d4b8bd64231289d0b8249fc03609 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Mon, 4 Dec 2023 12:28:05 +0530 Subject: [PATCH 022/170] update docs --- docs/syntax/classDiagram.md | 6 +++--- packages/mermaid/src/docs/syntax/classDiagram.md | 6 +++--- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/syntax/classDiagram.md b/docs/syntax/classDiagram.md index 2f2c3da88..1701b374e 100644 --- a/docs/syntax/classDiagram.md +++ b/docs/syntax/classDiagram.md @@ -459,9 +459,9 @@ The different cardinality options are : - `0..1` Zero or One - `1..*` One or more - `*` Many -- `n` n {where n>1} -- `0..n` zero to n {where n>1} -- `1..n` one to n {where n>1} +- `n` n (where n>1) +- `0..n` zero to n (where n>1) +- `1..n` one to n (where n>1) Cardinality can be easily defined by placing the text option within quotes `"` before or after a given arrow. For example: diff --git a/packages/mermaid/src/docs/syntax/classDiagram.md b/packages/mermaid/src/docs/syntax/classDiagram.md index f02ae67be..9d87cc337 100644 --- a/packages/mermaid/src/docs/syntax/classDiagram.md +++ b/packages/mermaid/src/docs/syntax/classDiagram.md @@ -304,9 +304,9 @@ The different cardinality options are : - `0..1` Zero or One - `1..*` One or more - `*` Many -- `n` n {where n>1} -- `0..n` zero to n {where n>1} -- `1..n` one to n {where n>1} +- `n` n (where n>1) +- `0..n` zero to n (where n>1) +- `1..n` one to n (where n>1) Cardinality can be easily defined by placing the text option within quotes `"` before or after a given arrow. For example: From 78c44bf7938c05a45e896367f0ba78807068f931 Mon Sep 17 00:00:00 2001 From: Steph <35910788+huynhicode@users.noreply.github.com> Date: Mon, 4 Dec 2023 11:07:55 -0800 Subject: [PATCH 023/170] add blog post --- docs/news/announcements.md | 12 ++++++++++-- docs/news/blog.md | 6 ++++++ packages/mermaid/src/docs/news/announcements.md | 12 ++++++++++-- packages/mermaid/src/docs/news/blog.md | 6 ++++++ 4 files changed, 32 insertions(+), 4 deletions(-) diff --git a/docs/news/announcements.md b/docs/news/announcements.md index d1eaa525e..6e1daa81a 100644 --- a/docs/news/announcements.md +++ b/docs/news/announcements.md @@ -6,7 +6,7 @@ # Announcements -## [Mermaid Chart](https://www.mermaidchart.com/) is running a Holiday promotion 🎉 +## 🎉 [Mermaid Chart](https://www.mermaidchart.com/) is running a Holiday promotion ### Use HOLIDAYS2023 to get 25% off a Pro subscription @@ -17,4 +17,12 @@ With a Pro subscription, you will get access to: - Unlimited diagrams - and more! -View details on how to redeem the promo code on the [Mermaid Chart website](https://www.mermaidchart.com/app/user/billing/checkout?coupon=HOLIDAYS2023). +Redeem the promo code on the [Mermaid Chart website](https://www.mermaidchart.com/app/user/billing/checkout?coupon=HOLIDAYS2023). + +## 🤓 Read our latest blog post + +### [7 best practices (+ examples) for good developer documentation](https://www.mermaidchart.com/blog/posts/7-best-practices-for-good-documentation/) + +4 December 2023 · 11 min + +Essential strategies for crafting grate developer documentation, with practical examples and insights from leading tech companies. diff --git a/docs/news/blog.md b/docs/news/blog.md index da20ed1bb..7c9deb012 100644 --- a/docs/news/blog.md +++ b/docs/news/blog.md @@ -6,6 +6,12 @@ # Blog +## [7 best practices (+ examples) for good developer documentation](https://www.mermaidchart.com/blog/posts/7-best-practices-for-good-documentation/) + +4 December 2023 · 11 min + +Essential strategies for crafting grate developer documentation, with practical examples and insights from leading tech companies. + ## [5 Reasons You Should Be Using Mermaid Chart As Your Diagram Generator](https://www.mermaidchart.com/blog/posts/5-reasons-you-should-be-using-mermaid-chart-as-your-diagram-generator/) 14 November 2023 · 5 mins diff --git a/packages/mermaid/src/docs/news/announcements.md b/packages/mermaid/src/docs/news/announcements.md index 6e947065f..430fc74d1 100644 --- a/packages/mermaid/src/docs/news/announcements.md +++ b/packages/mermaid/src/docs/news/announcements.md @@ -4,7 +4,7 @@ outline: 'deep' # shows all h3 headings in outline in Vitepress # Announcements -## [Mermaid Chart](https://www.mermaidchart.com/) is running a Holiday promotion 🎉 +## 🎉 [Mermaid Chart](https://www.mermaidchart.com/) is running a Holiday promotion ### Use HOLIDAYS2023 to get 25% off a Pro subscription @@ -15,4 +15,12 @@ With a Pro subscription, you will get access to: - Unlimited diagrams - and more! -View details on how to redeem the promo code on the [Mermaid Chart website](https://www.mermaidchart.com/app/user/billing/checkout?coupon=HOLIDAYS2023). +Redeem the promo code on the [Mermaid Chart website](https://www.mermaidchart.com/app/user/billing/checkout?coupon=HOLIDAYS2023). + +## 🤓 Read our latest blog post + +### [7 best practices (+ examples) for good developer documentation](https://www.mermaidchart.com/blog/posts/7-best-practices-for-good-documentation/) + +4 December 2023 · 11 min + +Essential strategies for crafting grate developer documentation, with practical examples and insights from leading tech companies. diff --git a/packages/mermaid/src/docs/news/blog.md b/packages/mermaid/src/docs/news/blog.md index d9bf6a8b7..9192774f5 100644 --- a/packages/mermaid/src/docs/news/blog.md +++ b/packages/mermaid/src/docs/news/blog.md @@ -1,5 +1,11 @@ # Blog +## [7 best practices (+ examples) for good developer documentation](https://www.mermaidchart.com/blog/posts/7-best-practices-for-good-documentation/) + +4 December 2023 · 11 min + +Essential strategies for crafting grate developer documentation, with practical examples and insights from leading tech companies. + ## [5 Reasons You Should Be Using Mermaid Chart As Your Diagram Generator](https://www.mermaidchart.com/blog/posts/5-reasons-you-should-be-using-mermaid-chart-as-your-diagram-generator/) 14 November 2023 · 5 mins From 239fad94ee142a114f8c3c710c1072c0821edbe4 Mon Sep 17 00:00:00 2001 From: Justin Greywolf Date: Mon, 4 Dec 2023 13:28:31 -0800 Subject: [PATCH 024/170] Grammar/rendering for setting style on class node --- .../rendering/classDiagram-v2.spec.js | 10 +++++++ docs/syntax/classDiagram.md | 23 +++++++++++++++- packages/mermaid/src/dagre-wrapper/nodes.js | 1 + .../mermaid/src/diagrams/class/classDb.ts | 20 ++++++++++++++ .../class/classDiagram-styles.spec.js | 13 +++++++++ .../src/diagrams/class/classRenderer-v2.ts | 2 +- .../mermaid/src/diagrams/class/classTypes.ts | 1 + .../diagrams/class/parser/classDiagram.jison | 27 +++++++++++++++++-- 8 files changed, 93 insertions(+), 4 deletions(-) diff --git a/cypress/integration/rendering/classDiagram-v2.spec.js b/cypress/integration/rendering/classDiagram-v2.spec.js index 37e9cada0..20a1aea0a 100644 --- a/cypress/integration/rendering/classDiagram-v2.spec.js +++ b/cypress/integration/rendering/classDiagram-v2.spec.js @@ -571,4 +571,14 @@ class C13["With Città foreign language"] { logLevel: 1, flowchart: { htmlLabels: false } } ); }); + it('should render a simple class diagram with style definition', () => { + imgSnapshotTest( + ` + classDiagram-v2 + class Class10 + style Class10 fill:#f9f,stroke:#333,stroke-width:4px + `, + { logLevel: 1, flowchart: { htmlLabels: false } } + ); + }); }); diff --git a/docs/syntax/classDiagram.md b/docs/syntax/classDiagram.md index 2f2c3da88..b2d5a8c89 100644 --- a/docs/syntax/classDiagram.md +++ b/docs/syntax/classDiagram.md @@ -768,7 +768,28 @@ Beginner's tip—a full example using interactive links in an HTML page: ### Styling a node -It is possible to apply specific styles such as a thicker border or a different background color to individual nodes. This is done by predefining classes in css styles that can be applied from the graph definition using the `cssClass` statement or the `:::` short hand. +It is possible to apply specific styles such as a thicker border or a different background color to a node. + +```mermaid-example +classDiagram + class Animal + class Mineral + style Animal fill:#f9f,stroke:#333,stroke-width:4px + style Mineral fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5 +``` + +```mermaid +classDiagram + class Animal + class Mineral + style Animal fill:#f9f,stroke:#333,stroke-width:4px + style Mineral fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5 +``` + +#### Classes + +More convenient than defining the style every time is to define a class of styles and attach this class to the nodes that +should have a different look. This is done by predefining classes in css styles that can be applied from the graph definition using the `cssClass` statement or the `:::` short hand. ```html + + + + + + + + +

+
+ +

Gantt diagrams

+
+

+ A Gantt chart is a type of bar chart, first developed by Karol Adamiecki in 1896, and + independently by Henry Gantt in the 1910s, that illustrates a project schedule and the + amount of time it would take for any one project to finish. Gantt charts illustrate + number of days between the start and finish dates of the terminal elements and summary + elements of a project. +

+
+

A note to users

+

+ Gantt Charts will record each scheduled task as one continuous bar that extends from the + left to the right. The x axis represents time and the y records the different tasks and + the order in which they are to be completed. +

+

+ It is important to remember that when a date, day, or collection of dates specific to a + task are "excluded", the Gantt Chart will accommodate those changes by extending an equal + number of days, towards the right, not by creating a gap inside the task. As shown here + +

+

+ However, if the excluded dates are between two tasks that are set to start consecutively, + the excluded dates will be skipped graphically and left blank, and the following task will + begin after the end of the excluded dates. As shown here + +

+

+ A Gantt chart is useful for tracking the amount of time it would take before a project is + finished, but it can also be used to graphically represent "non-working days", with a few + tweaks. +

+

+ Mermaid can render Gantt diagrams as SVG, PNG or a MarkDown link that can be pasted into + docs. +

+ 
gantt
+    title A Gantt Diagram
+    dateFormat YYYY-MM-DD
+    section Section
+        A task          :a1, 2014-01-01, 30d
+        Another task    :after a1, 20d
+    section Another
+        Task in Another :2014-01-12, 12d
+        another task    :24d
+

Syntax

+ 
gantt
+    dateFormat  YYYY-MM-DD
+    title       Adding GANTT diagram functionality to mermaid
+    excludes    weekends
+    %% (`excludes` accepts specific dates in YYYY-MM-DD format, days of the week ("sunday") or "weekends", but not the word "weekdays".)
+
+    section A section
+    Completed task            :done,    des1, 2014-01-06,2014-01-08
+    Active task               :active,  des2, 2014-01-09, 3d
+    Future task               :         des3, after des2, 5d
+    Future task2              :         des4, after des3, 5d
+
+    section Critical tasks
+    Completed task in the critical line :crit, done, 2014-01-06,24h
+    Implement parser and jison          :crit, done, after des1, 2d
+    Create tests for parser             :crit, active, 3d
+    Future task in critical line        :crit, 5d
+    Create tests for renderer           :2d
+    Add to mermaid                      :1d
+    Functionality added                 :milestone, 2014-01-25, 0d
+
+    section Documentation
+    Describe gantt syntax               :active, a1, after des1, 3d
+    Add gantt diagram to demo page      :after a1  , 20h
+    Add another diagram to demo page    :doc1, after a1  , 48h
+
+    section Last section
+    Describe gantt syntax               :after doc1, 3d
+    Add gantt diagram to demo page      :20h
+    Add another diagram to demo page    :48h
+

+ Tasks are by default sequential. A task start date defaults to the end date of the + preceding task. +

+

+ A colon, :, separates the task title from its metadata. Metadata items are + separated by a comma, ,. Valid tags are active, + done, crit, and milestone. Tags are optional, but + if used, they must be specified first. After processing the tags, the remaining metadata + items are interpreted as follows: +

+
    +
  1. + If a single item is specified, it determines when the task ends. It can either be a + specific date/time or a duration. If a duration is specified, it is added to the start + date of the task to determine the end date of the task, taking into account any + exclusions. +
    2. +
  2. + If two items are specified, the last item is interpreted as in the previous case. The + first item can either specify an explicit start date/time (in the format specified by + dateFormat) or reference another task using + after <otherTaskID> [[otherTaskID2 [otherTaskID3]]...]. In the latter + case, the start date of the task will be set according to the latest end date of any + referenced task. +
    3. +
  3. + If three items are specified, the last two will be interpreted as in the previous case. + The first item will denote the ID of the task, which can be referenced using the + later <taskID> syntax. +
    4. +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Metadata syntaxStart dateEnd dateID
<taskID>, <startDate>, <endDate>startdate as interpreted using dateformatendDate as interpreted using dateformattaskID
<taskID>, <startDate>, <length>startdate as interpreted using dateformatStart date + lengthtaskID
<taskID>, after <otherTaskId>, <endDate>End date of previously specified task otherTaskIDendDate as interpreted using dateformattaskID
<taskID>, after <otherTaskId>, <length>End date of previously specified task otherTaskIDStart date + lengthtaskID
<startDate>, <endDate>startdate as interpreted using dateformatenddate as interpreted using dateformatn/a
<startDate>, <length>startdate as interpreted using dateformatStart date + lengthn/a
after <otherTaskID>, <endDate>End date of previously specified task otherTaskIDenddate as interpreted using dateformatn/a
after <otherTaskID>, <length>End date of previously specified task otherTaskIDStart date + lengthn/a
<endDate>End date of preceding taskenddate as interpreted using dateformatn/a
<length>End date of preceding taskStart date + lengthn/a
+

+ For simplicity, the table does not show the use of multiple tasks listed with the + after keyword. Here is an example of how to use it and how it's interpreted: +

+ 
gantt
+    apple :a, 2017-07-20, 1w
+    banana :crit, b, 2017-07-23, 1d
+    cherry :active, c, after b a, 1d
+

Title

+

+ The title is an optional string to be displayed at the top of the + Gantt chart to describe the chart as a whole. +

+

Section statements

+

+ You can divide the chart into various sections, for example to separate different parts of + a project like development and documentation. +

+

+ To do so, start a line with the section keyword and give it a name. (Note + that unlike with the title for the entire chart, this name is + required. +

+

Milestones

+

+ You can add milestones to the diagrams. Milestones differ from tasks as they represent a + single instant in time and are identified by the keyword milestone. Below is + an example on how to use milestones. As you may notice, the exact location of the + milestone is determined by the initial date for the milestone and the "duration" of the + task this way: initial date+duration/2. +

+ 
gantt
+    dateFormat HH:mm
+    axisFormat %H:%M
+    Initial milestone : milestone, m1, 17:49, 2m
+    Task A : 10m
+    Task B : 5m
+    Final milestone : milestone, m2, 18:08, 4m
+

Setting dates

+

+ dateFormat defines the format of the date input of your + gantt elements. How these dates are represented in the rendered chart + output are defined by axisFormat. +

+

Input date format

+

+ The default input date format is YYYY-MM-DD. You can define your custom + dateFormat. +

+ 
dateFormat YYYY-MM-DD
+
+

The following formatting options are supported:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
InputExampleDescription
YYYY20144 digit year
YY142 digit year
Q1..4Quarter of year. Sets month to first month in quarter.
M MM1..12Month number
MMM MMMMJanuary..DecMonth name in locale set by dayjs.locale()
D DD1..31Day of month
Do1st..31stDay of month with ordinal
DDD DDDD1..365Day of year
X1410715640.579Unix timestamp
x1410715640579Unix ms timestamp
H HH0..2324 hour time
h hh1..1212 hour time used with a A.
a Aam pmPost or ante meridiem
m mm0..59Minutes
s ss0..59Seconds
S0..9Tenths of a second
SS0..99Hundreds of a second
SSS0..999Thousandths of a second
Z ZZ+12:00Offset from UTC as +-HH:mm, +-HHmm, or Z
+

+ More info in: + https://day.js.org/docs/en/parse/string-format/ +

+

Output date format on the axis

+

+ The default output date format is YYYY-MM-DD. You can define your custom + axisFormat, like 2020-Q1 for the first quarter of the year 2020. +

+ 
axisFormat %Y-%m-%d
+
+

The following formatting strings are supported:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FormatDefinition
%aabbreviated weekday name
%Afull weekday name
%babbreviated month name
%Bfull month name
%cdate and time, as "%a %b %e %H:%M:%S %Y"
%dzero-padded day of the month as a decimal number [01,31]
%espace-padded day of the month as a decimal number [ 1,31]; equivalent to %_d
%Hhour (24-hour clock) as a decimal number [00,23]
%Ihour (12-hour clock) as a decimal number [01,12]
%jday of the year as a decimal number [001,366]
%mmonth as a decimal number [01,12]
%Mminute as a decimal number [00,59]
%Lmilliseconds as a decimal number [000, 999]
%peither AM or PM
%Ssecond as a decimal number [00,61]
%U + week number of the year (Sunday as the first day of the week) as a decimal number + [00,53] +
%wweekday as a decimal number [0(Sunday),6]
%W + week number of the year (Monday as the first day of the week) as a decimal number + [00,53] +
%xdate, as "%m/%d/%Y"
%Xtime, as "%H:%M:%S"
%yyear without century as a decimal number [00,99]
%Yyear with century as a decimal number
%Ztime zone offset, such as "-0700"
%%a literal "%" character
+

+ More info in: + https://github.com/d3/d3-time-format/tree/v4.0.0#locale_format +

+

Axis ticks (v10.3.0+)

+

+ The default output ticks are auto. You can custom your tickInterval, like + 1day or 1week. +

+ 
tickInterval 1day
+
+

The pattern is:

+ 
/^([1-9][0-9]*)(millisecond|second|minute|hour|day|week|month)$/;
+
+

+ More info in: + https://github.com/d3/d3-time#interval_every +

+

+ Week-based tickIntervals start the week on sunday by default. If you wish to + specify another weekday on which the tickInterval should start, use the + weekday option: +

+ 
gantt
+  tickInterval 1week
+  weekday monday
+ 
`millisecond` and `second` support was added in vMERMAID_RELEASE_VERSION
+
+

Output in compact mode

+

+ The compact mode allows you to display multiple tasks in the same row. Compact mode can be + enabled for a gantt chart by setting the display mode of the graph via preceeding YAML + settings. +

+ 
---
+displayMode: compact
+---
+gantt
+    title A Gantt Diagram
+    dateFormat  YYYY-MM-DD
+
+    section Section
+    A task           :a1, 2014-01-01, 30d
+    Another task     :a2, 2014-01-20, 25d
+    Another one      :a3, 2014-02-10, 20d
+

Comments

+

+ Comments can be entered within a gantt chart, which will be ignored by the parser. + Comments need to be on their own line and must be prefaced with %% (double + percent signs). Any text after the start of the comment to the next newline will be + treated as a comment, including any diagram syntax. +

+ 
gantt
+    title A Gantt Diagram
+    %% This is a comment
+    dateFormat YYYY-MM-DD
+    section Section
+        A task          :a1, 2014-01-01, 30d
+        Another task    :after a1, 20d
+    section Another
+        Task in Another :2014-01-12, 12d
+        another task    :24d
+

Styling

+

+ Styling of the Gantt diagram is done by defining a number of CSS classes. During + rendering, these classes are extracted from the file located at + src/diagrams/gantt/styles.js +

+

Classes used

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ClassDescription
grid.tickStyling for the Grid Lines
grid.pathStyling for the Grid's borders
.taskTextTask Text Styling
.taskTextOutsideRightStyling for Task Text that exceeds the activity bar towards the right.
.taskTextOutsideLeftStyling for Task Text that exceeds the activity bar, towards the left.
todayMarkerToggle and Styling for the "Today Marker"
+

Sample stylesheet

+ 
.grid .tick {
+  stroke: lightgrey;
+  opacity: 0.3;
+  shape-rendering: crispEdges;
+}
+.grid path {
+  stroke-width: 0;
+}
+
+#tag {
+  color: white;
+  background: #fa283d;
+  width: 150px;
+  position: absolute;
+  display: none;
+  padding: 3px 6px;
+  margin-left: -80px;
+  font-size: 11px;
+}
+
+#tag:before {
+  border: solid transparent;
+  content: ' ';
+  height: 0;
+  left: 50%;
+  margin-left: -5px;
+  position: absolute;
+  width: 0;
+  border-width: 10px;
+  border-bottom-color: #fa283d;
+  top: -20px;
+}
+.taskText {
+  fill: white;
+  text-anchor: middle;
+}
+.taskTextOutsideRight {
+  fill: black;
+  text-anchor: start;
+}
+.taskTextOutsideLeft {
+  fill: black;
+  text-anchor: end;
+}
+
+

Today marker

+

+ You can style or hide the marker for the current date. To style it, add a value for the + todayMarker key. +

+ 
todayMarker stroke-width:5px,stroke:#0f0,opacity:0.5
+
+

To hide the marker, set todayMarker to off.

+ 
todayMarker off
+
+

Configuration

+

It is possible to adjust the margins for rendering the gantt diagram.

+

+ This is done by defining the ganttConfig part of the configuration object. + How to use the CLI is described in the + mermaidCLI page. +

+

+ mermaid.ganttConfig can be set to a JSON string with config parameters or the + corresponding object. +

+ 
mermaid.ganttConfig = {
+  titleTopMargin: 25,
+  barHeight: 20,
+  barGap: 4,
+  topPadding: 75,
+  sidePadding: 75,
+};
+
+

Possible configuration params:

+ + + + + + + + + + + + + + + + + + + + +
ParamDescriptionDefault value
mirrorActorTurns on/off the rendering of actors below the diagram as well as above itfalse
bottomMarginAdj + Adjusts how far down the graph ended. Wide borders styles with css could generate + unwanted clipping which is why this config param exists. + 1
+

Interaction

+

+ It is possible to bind a click event to a task. The click can lead to either a javascript + callback or to a link which will be opened in the current browser tab. + Note: This functionality is disabled when using + securityLevel='strict' and enabled when using + securityLevel='loose'. +

+ 
click taskId call callback(arguments)
+click taskId href URL
+
+
    +
  • taskId is the id of the task
    • +
  • + callback is the name of a javascript function defined on the page displaying the graph, + the function will be called with the taskId as the parameter if no other arguments are + specified. +
    • +
+

Beginner's tip—a full example using interactive links in an html context:

+ 
<body>
+  <pre class="mermaid">
+    gantt
+      dateFormat  YYYY-MM-DD
+
+      section Clickable
+      Visit mermaidjs         :active, cl1, 2014-01-07, 3d
+      Print arguments         :cl2, after cl1, 3d
+      Print task              :cl3, after cl2, 3d
+
+      click cl1 href "https://mermaidjs.github.io/"
+      click cl2 call printArguments("test1", "test2", test3)
+      click cl3 call printTask()
+  </pre>
+
+  <script>
+    const printArguments = function (arg1, arg2, arg3) {
+      alert('printArguments called with arguments: ' + arg1 + ', ' + arg2 + ', ' + arg3);
+    };
+    const printTask = function (taskId) {
+      alert('taskId: ' + taskId);
+    };
+    const config = {
+      startOnLoad: true,
+      securityLevel: 'loose',
+    };
+    mermaid.initialize(config);
+  </script>
+</body>
+
+

Examples

+

Bar chart (using gantt chart)

+ 
gantt
+    title Git Issues - days since last update
+    dateFormat X
+    axisFormat %s
+    section Issue19062
+    71   : 0, 71
+    section Issue19401
+    36   : 0, 36
+    section Issue193
+    34   : 0, 34
+    section Issue7441
+    9    : 0, 9
+    section Issue1300
+    5    : 0, 5
+
+
+ + + + + diff --git a/docs/syntax/gantt.md b/docs/syntax/gantt.md index 33c2740e5..071cb0ec0 100644 --- a/docs/syntax/gantt.md +++ b/docs/syntax/gantt.md @@ -114,7 +114,30 @@ gantt Add another diagram to demo page :48h ``` -It is possible to set multiple dependencies separated by space: +Tasks are by default sequential. A task start date defaults to the end date of the preceding task. + +A colon, `:`, separates the task title from its metadata. +Metadata items are separated by a comma, `,`. Valid tags are `active`, `done`, `crit`, and `milestone`. Tags are optional, but if used, they must be specified first. +After processing the tags, the remaining metadata items are interpreted as follows: + +1. If a single item is specified, it determines when the task ends. It can either be a specific date/time or a duration. If a duration is specified, it is added to the start date of the task to determine the end date of the task, taking into account any exclusions. +2. If two items are specified, the last item is interpreted as in the previous case. The first item can either specify an explicit start date/time (in the format specified by `dateFormat`) or reference another task using `after [[otherTaskID2 [otherTaskID3]]...]`. In the latter case, the start date of the task will be set according to the latest end date of any referenced task. +3. If three items are specified, the last two will be interpreted as in the previous case. The first item will denote the ID of the task, which can be referenced using the `later ` syntax. + +| Metadata syntax | Start date | End date | ID | +| ------------------------------------------ | --------------------------------------------------- | ------------------------------------------- | -------- | +| `, , ` | `startdate` as interpreted using `dateformat` | `endDate` as interpreted using `dateformat` | `taskID` | +| `, , ` | `startdate` as interpreted using `dateformat` | Start date + `length` | `taskID` | +| `, after , ` | End date of previously specified task `otherTaskID` | `endDate` as interpreted using `dateformat` | `taskID` | +| `, after , ` | End date of previously specified task `otherTaskID` | Start date + `length` | `taskID` | +| `, ` | `startdate` as interpreted using `dateformat` | `enddate` as interpreted using `dateformat` | n/a | +| `, ` | `startdate` as interpreted using `dateformat` | Start date + `length` | n/a | +| `after , ` | End date of previously specified task `otherTaskID` | `enddate` as interpreted using `dateformat` | n/a | +| `after , ` | End date of previously specified task `otherTaskID` | Start date + `length` | n/a | +| `` | End date of preceding task | `enddate` as interpreted using `dateformat` | n/a | +| `` | End date of preceding task | Start date + `length` | n/a | + +For simplicity, the table does not show the use of multiple tasks listed with the `after` keyword. Here is an example of how to use it and how it's interpreted: ```mermaid-example gantt diff --git a/packages/mermaid/src/docs/syntax/gantt.md b/packages/mermaid/src/docs/syntax/gantt.md index a0cebc560..56fdc75a7 100644 --- a/packages/mermaid/src/docs/syntax/gantt.md +++ b/packages/mermaid/src/docs/syntax/gantt.md @@ -63,7 +63,30 @@ gantt Add another diagram to demo page :48h ``` -It is possible to set multiple dependencies separated by space: +Tasks are by default sequential. A task start date defaults to the end date of the preceding task. + +A colon, `:`, separates the task title from its metadata. +Metadata items are separated by a comma, `,`. Valid tags are `active`, `done`, `crit`, and `milestone`. Tags are optional, but if used, they must be specified first. +After processing the tags, the remaining metadata items are interpreted as follows: + +1. If a single item is specified, it determines when the task ends. It can either be a specific date/time or a duration. If a duration is specified, it is added to the start date of the task to determine the end date of the task, taking into account any exclusions. +2. If two items are specified, the last item is interpreted as in the previous case. The first item can either specify an explicit start date/time (in the format specified by `dateFormat`) or reference another task using `after [[otherTaskID2 [otherTaskID3]]...]`. In the latter case, the start date of the task will be set according to the latest end date of any referenced task. +3. If three items are specified, the last two will be interpreted as in the previous case. The first item will denote the ID of the task, which can be referenced using the `later ` syntax. + +| Metadata syntax | Start date | End date | ID | +| ------------------------------------------ | --------------------------------------------------- | ------------------------------------------- | -------- | +| `, , ` | `startdate` as interpreted using `dateformat` | `endDate` as interpreted using `dateformat` | `taskID` | +| `, , ` | `startdate` as interpreted using `dateformat` | Start date + `length` | `taskID` | +| `, after , ` | End date of previously specified task `otherTaskID` | `endDate` as interpreted using `dateformat` | `taskID` | +| `, after , ` | End date of previously specified task `otherTaskID` | Start date + `length` | `taskID` | +| `, ` | `startdate` as interpreted using `dateformat` | `enddate` as interpreted using `dateformat` | n/a | +| `, ` | `startdate` as interpreted using `dateformat` | Start date + `length` | n/a | +| `after , ` | End date of previously specified task `otherTaskID` | `enddate` as interpreted using `dateformat` | n/a | +| `after , ` | End date of previously specified task `otherTaskID` | Start date + `length` | n/a | +| `` | End date of preceding task | `enddate` as interpreted using `dateformat` | n/a | +| `` | End date of preceding task | Start date + `length` | n/a | + +For simplicity, the table does not show the use of multiple tasks listed with the `after` keyword. Here is an example of how to use it and how it's interpreted: ```mermaid-example gantt From bf55d940b68b8aacbcb352be1a7834d0c731b751 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Thu, 18 Jan 2024 22:34:20 +0530 Subject: [PATCH 130/170] Delete docs/syntax/gantt.html --- docs/syntax/gantt.html | 179939 -------------------------------------- 1 file changed, 179939 deletions(-) delete mode 100644 docs/syntax/gantt.html diff --git a/docs/syntax/gantt.html b/docs/syntax/gantt.html deleted file mode 100644 index 4a3156ac7..000000000 --- a/docs/syntax/gantt.html +++ /dev/null @@ -1,179939 +0,0 @@ - - - - - Gantt diagrams - - - - - - - - - -
-
- -

Gantt diagrams

-
-

- A Gantt chart is a type of bar chart, first developed by Karol Adamiecki in 1896, and - independently by Henry Gantt in the 1910s, that illustrates a project schedule and the - amount of time it would take for any one project to finish. Gantt charts illustrate - number of days between the start and finish dates of the terminal elements and summary - elements of a project. -

-
-

A note to users

-

- Gantt Charts will record each scheduled task as one continuous bar that extends from the - left to the right. The x axis represents time and the y records the different tasks and - the order in which they are to be completed. -

-

- It is important to remember that when a date, day, or collection of dates specific to a - task are "excluded", the Gantt Chart will accommodate those changes by extending an equal - number of days, towards the right, not by creating a gap inside the task. As shown here - -

-

- However, if the excluded dates are between two tasks that are set to start consecutively, - the excluded dates will be skipped graphically and left blank, and the following task will - begin after the end of the excluded dates. As shown here - -

-

- A Gantt chart is useful for tracking the amount of time it would take before a project is - finished, but it can also be used to graphically represent "non-working days", with a few - tweaks. -

-

- Mermaid can render Gantt diagrams as SVG, PNG or a MarkDown link that can be pasted into - docs. -

- 
gantt
-    title A Gantt Diagram
-    dateFormat YYYY-MM-DD
-    section Section
-        A task          :a1, 2014-01-01, 30d
-        Another task    :after a1, 20d
-    section Another
-        Task in Another :2014-01-12, 12d
-        another task    :24d
-

Syntax

- 
gantt
-    dateFormat  YYYY-MM-DD
-    title       Adding GANTT diagram functionality to mermaid
-    excludes    weekends
-    %% (`excludes` accepts specific dates in YYYY-MM-DD format, days of the week ("sunday") or "weekends", but not the word "weekdays".)
-
-    section A section
-    Completed task            :done,    des1, 2014-01-06,2014-01-08
-    Active task               :active,  des2, 2014-01-09, 3d
-    Future task               :         des3, after des2, 5d
-    Future task2              :         des4, after des3, 5d
-
-    section Critical tasks
-    Completed task in the critical line :crit, done, 2014-01-06,24h
-    Implement parser and jison          :crit, done, after des1, 2d
-    Create tests for parser             :crit, active, 3d
-    Future task in critical line        :crit, 5d
-    Create tests for renderer           :2d
-    Add to mermaid                      :1d
-    Functionality added                 :milestone, 2014-01-25, 0d
-
-    section Documentation
-    Describe gantt syntax               :active, a1, after des1, 3d
-    Add gantt diagram to demo page      :after a1  , 20h
-    Add another diagram to demo page    :doc1, after a1  , 48h
-
-    section Last section
-    Describe gantt syntax               :after doc1, 3d
-    Add gantt diagram to demo page      :20h
-    Add another diagram to demo page    :48h
-

- Tasks are by default sequential. A task start date defaults to the end date of the - preceding task. -

-

- A colon, :, separates the task title from its metadata. Metadata items are - separated by a comma, ,. Valid tags are active, - done, crit, and milestone. Tags are optional, but - if used, they must be specified first. After processing the tags, the remaining metadata - items are interpreted as follows: -

-
    -
  1. - If a single item is specified, it determines when the task ends. It can either be a - specific date/time or a duration. If a duration is specified, it is added to the start - date of the task to determine the end date of the task, taking into account any - exclusions. -
    2. -
  2. - If two items are specified, the last item is interpreted as in the previous case. The - first item can either specify an explicit start date/time (in the format specified by - dateFormat) or reference another task using - after <otherTaskID> [[otherTaskID2 [otherTaskID3]]...]. In the latter - case, the start date of the task will be set according to the latest end date of any - referenced task. -
    3. -
  3. - If three items are specified, the last two will be interpreted as in the previous case. - The first item will denote the ID of the task, which can be referenced using the - later <taskID> syntax. -
    4. -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Metadata syntaxStart dateEnd dateID
<taskID>, <startDate>, <endDate>startdate as interpreted using dateformatendDate as interpreted using dateformattaskID
<taskID>, <startDate>, <length>startdate as interpreted using dateformatStart date + lengthtaskID
<taskID>, after <otherTaskId>, <endDate>End date of previously specified task otherTaskIDendDate as interpreted using dateformattaskID
<taskID>, after <otherTaskId>, <length>End date of previously specified task otherTaskIDStart date + lengthtaskID
<startDate>, <endDate>startdate as interpreted using dateformatenddate as interpreted using dateformatn/a
<startDate>, <length>startdate as interpreted using dateformatStart date + lengthn/a
after <otherTaskID>, <endDate>End date of previously specified task otherTaskIDenddate as interpreted using dateformatn/a
after <otherTaskID>, <length>End date of previously specified task otherTaskIDStart date + lengthn/a
<endDate>End date of preceding taskenddate as interpreted using dateformatn/a
<length>End date of preceding taskStart date + lengthn/a
-

- For simplicity, the table does not show the use of multiple tasks listed with the - after keyword. Here is an example of how to use it and how it's interpreted: -

- 
gantt
-    apple :a, 2017-07-20, 1w
-    banana :crit, b, 2017-07-23, 1d
-    cherry :active, c, after b a, 1d
-

Title

-

- The title is an optional string to be displayed at the top of the - Gantt chart to describe the chart as a whole. -

-

Section statements

-

- You can divide the chart into various sections, for example to separate different parts of - a project like development and documentation. -

-

- To do so, start a line with the section keyword and give it a name. (Note - that unlike with the title for the entire chart, this name is - required. -

-

Milestones

-

- You can add milestones to the diagrams. Milestones differ from tasks as they represent a - single instant in time and are identified by the keyword milestone. Below is - an example on how to use milestones. As you may notice, the exact location of the - milestone is determined by the initial date for the milestone and the "duration" of the - task this way: initial date+duration/2. -

- 
gantt
-    dateFormat HH:mm
-    axisFormat %H:%M
-    Initial milestone : milestone, m1, 17:49, 2m
-    Task A : 10m
-    Task B : 5m
-    Final milestone : milestone, m2, 18:08, 4m
-

Setting dates

-

- dateFormat defines the format of the date input of your - gantt elements. How these dates are represented in the rendered chart - output are defined by axisFormat. -

-

Input date format

-

- The default input date format is YYYY-MM-DD. You can define your custom - dateFormat. -

- 
dateFormat YYYY-MM-DD
-
-

The following formatting options are supported:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
InputExampleDescription
YYYY20144 digit year
YY142 digit year
Q1..4Quarter of year. Sets month to first month in quarter.
M MM1..12Month number
MMM MMMMJanuary..DecMonth name in locale set by dayjs.locale()
D DD1..31Day of month
Do1st..31stDay of month with ordinal
DDD DDDD1..365Day of year
X1410715640.579Unix timestamp
x1410715640579Unix ms timestamp
H HH0..2324 hour time
h hh1..1212 hour time used with a A.
a Aam pmPost or ante meridiem
m mm0..59Minutes
s ss0..59Seconds
S0..9Tenths of a second
SS0..99Hundreds of a second
SSS0..999Thousandths of a second
Z ZZ+12:00Offset from UTC as +-HH:mm, +-HHmm, or Z
-

- More info in: - https://day.js.org/docs/en/parse/string-format/ -

-

Output date format on the axis

-

- The default output date format is YYYY-MM-DD. You can define your custom - axisFormat, like 2020-Q1 for the first quarter of the year 2020. -

- 
axisFormat %Y-%m-%d
-
-

The following formatting strings are supported:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FormatDefinition
%aabbreviated weekday name
%Afull weekday name
%babbreviated month name
%Bfull month name
%cdate and time, as "%a %b %e %H:%M:%S %Y"
%dzero-padded day of the month as a decimal number [01,31]
%espace-padded day of the month as a decimal number [ 1,31]; equivalent to %_d
%Hhour (24-hour clock) as a decimal number [00,23]
%Ihour (12-hour clock) as a decimal number [01,12]
%jday of the year as a decimal number [001,366]
%mmonth as a decimal number [01,12]
%Mminute as a decimal number [00,59]
%Lmilliseconds as a decimal number [000, 999]
%peither AM or PM
%Ssecond as a decimal number [00,61]
%U - week number of the year (Sunday as the first day of the week) as a decimal number - [00,53] -
%wweekday as a decimal number [0(Sunday),6]
%W - week number of the year (Monday as the first day of the week) as a decimal number - [00,53] -
%xdate, as "%m/%d/%Y"
%Xtime, as "%H:%M:%S"
%yyear without century as a decimal number [00,99]
%Yyear with century as a decimal number
%Ztime zone offset, such as "-0700"
%%a literal "%" character
-

- More info in: - https://github.com/d3/d3-time-format/tree/v4.0.0#locale_format -

-

Axis ticks (v10.3.0+)

-

- The default output ticks are auto. You can custom your tickInterval, like - 1day or 1week. -

- 
tickInterval 1day
-
-

The pattern is:

- 
/^([1-9][0-9]*)(millisecond|second|minute|hour|day|week|month)$/;
-
-

- More info in: - https://github.com/d3/d3-time#interval_every -

-

- Week-based tickIntervals start the week on sunday by default. If you wish to - specify another weekday on which the tickInterval should start, use the - weekday option: -

- 
gantt
-  tickInterval 1week
-  weekday monday
- 
`millisecond` and `second` support was added in vMERMAID_RELEASE_VERSION
-
-

Output in compact mode

-

- The compact mode allows you to display multiple tasks in the same row. Compact mode can be - enabled for a gantt chart by setting the display mode of the graph via preceeding YAML - settings. -

- 
---
-displayMode: compact
----
-gantt
-    title A Gantt Diagram
-    dateFormat  YYYY-MM-DD
-
-    section Section
-    A task           :a1, 2014-01-01, 30d
-    Another task     :a2, 2014-01-20, 25d
-    Another one      :a3, 2014-02-10, 20d
-

Comments

-

- Comments can be entered within a gantt chart, which will be ignored by the parser. - Comments need to be on their own line and must be prefaced with %% (double - percent signs). Any text after the start of the comment to the next newline will be - treated as a comment, including any diagram syntax. -

- 
gantt
-    title A Gantt Diagram
-    %% This is a comment
-    dateFormat YYYY-MM-DD
-    section Section
-        A task          :a1, 2014-01-01, 30d
-        Another task    :after a1, 20d
-    section Another
-        Task in Another :2014-01-12, 12d
-        another task    :24d
-

Styling

-

- Styling of the Gantt diagram is done by defining a number of CSS classes. During - rendering, these classes are extracted from the file located at - src/diagrams/gantt/styles.js -

-

Classes used

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
ClassDescription
grid.tickStyling for the Grid Lines
grid.pathStyling for the Grid's borders
.taskTextTask Text Styling
.taskTextOutsideRightStyling for Task Text that exceeds the activity bar towards the right.
.taskTextOutsideLeftStyling for Task Text that exceeds the activity bar, towards the left.
todayMarkerToggle and Styling for the "Today Marker"
-

Sample stylesheet

- 
.grid .tick {
-  stroke: lightgrey;
-  opacity: 0.3;
-  shape-rendering: crispEdges;
-}
-.grid path {
-  stroke-width: 0;
-}
-
-#tag {
-  color: white;
-  background: #fa283d;
-  width: 150px;
-  position: absolute;
-  display: none;
-  padding: 3px 6px;
-  margin-left: -80px;
-  font-size: 11px;
-}
-
-#tag:before {
-  border: solid transparent;
-  content: ' ';
-  height: 0;
-  left: 50%;
-  margin-left: -5px;
-  position: absolute;
-  width: 0;
-  border-width: 10px;
-  border-bottom-color: #fa283d;
-  top: -20px;
-}
-.taskText {
-  fill: white;
-  text-anchor: middle;
-}
-.taskTextOutsideRight {
-  fill: black;
-  text-anchor: start;
-}
-.taskTextOutsideLeft {
-  fill: black;
-  text-anchor: end;
-}
-
-

Today marker

-

- You can style or hide the marker for the current date. To style it, add a value for the - todayMarker key. -

- 
todayMarker stroke-width:5px,stroke:#0f0,opacity:0.5
-
-

To hide the marker, set todayMarker to off.

- 
todayMarker off
-
-

Configuration

-

It is possible to adjust the margins for rendering the gantt diagram.

-

- This is done by defining the ganttConfig part of the configuration object. - How to use the CLI is described in the - mermaidCLI page. -

-

- mermaid.ganttConfig can be set to a JSON string with config parameters or the - corresponding object. -

- 
mermaid.ganttConfig = {
-  titleTopMargin: 25,
-  barHeight: 20,
-  barGap: 4,
-  topPadding: 75,
-  sidePadding: 75,
-};
-
-

Possible configuration params:

- - - - - - - - - - - - - - - - - - - - -
ParamDescriptionDefault value
mirrorActorTurns on/off the rendering of actors below the diagram as well as above itfalse
bottomMarginAdj - Adjusts how far down the graph ended. Wide borders styles with css could generate - unwanted clipping which is why this config param exists. - 1
-

Interaction

-

- It is possible to bind a click event to a task. The click can lead to either a javascript - callback or to a link which will be opened in the current browser tab. - Note: This functionality is disabled when using - securityLevel='strict' and enabled when using - securityLevel='loose'. -

- 
click taskId call callback(arguments)
-click taskId href URL
-
-
    -
  • taskId is the id of the task
    • -
  • - callback is the name of a javascript function defined on the page displaying the graph, - the function will be called with the taskId as the parameter if no other arguments are - specified. -
    • -
-

Beginner's tip—a full example using interactive links in an html context:

- 
<body>
-  <pre class="mermaid">
-    gantt
-      dateFormat  YYYY-MM-DD
-
-      section Clickable
-      Visit mermaidjs         :active, cl1, 2014-01-07, 3d
-      Print arguments         :cl2, after cl1, 3d
-      Print task              :cl3, after cl2, 3d
-
-      click cl1 href "https://mermaidjs.github.io/"
-      click cl2 call printArguments("test1", "test2", test3)
-      click cl3 call printTask()
-  </pre>
-
-  <script>
-    const printArguments = function (arg1, arg2, arg3) {
-      alert('printArguments called with arguments: ' + arg1 + ', ' + arg2 + ', ' + arg3);
-    };
-    const printTask = function (taskId) {
-      alert('taskId: ' + taskId);
-    };
-    const config = {
-      startOnLoad: true,
-      securityLevel: 'loose',
-    };
-    mermaid.initialize(config);
-  </script>
-</body>
-
-

Examples

-

Bar chart (using gantt chart)

- 
gantt
-    title Git Issues - days since last update
-    dateFormat X
-    axisFormat %s
-    section Issue19062
-    71   : 0, 71
-    section Issue19401
-    36   : 0, 36
-    section Issue193
-    34   : 0, 34
-    section Issue7441
-    9    : 0, 9
-    section Issue1300
-    5    : 0, 5
-
-
- - - - - From d2c82c18022957f8743d656b0e6017be05ba0b53 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 12:06:53 +0530 Subject: [PATCH 131/170] Use cache to store snapshots --- .github/workflows/e2e.yml | 49 +++++++++++++++++++ cSpell.json | 1 + cypress.config.cjs | 11 ++++- .../integration/other/configuration.spec.js | 1 - cypress/integration/other/rerender.spec.js | 2 - cypress/integration/rendering/gantt.spec.js | 13 +++-- cypress/support/commands.js | 12 +++-- 7 files changed, 77 insertions(+), 12 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 71806a9c4..09e8546ff 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -9,8 +9,44 @@ permissions: contents: read jobs: + cache: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v4 + - uses: pnpm/action-setup@v2 + - name: Setup Node.js + uses: actions/setup-node@v4 + with: + node-version: 18.x + + - name: Cache snapshots + id: cache-snapshot + uses: actions/cache@v4 + with: + save-always: true + path: ./cypress/snapshots + key: ${{ runner.os }}-snapshots + + - name: Switch to base branch + if: ${{ steps.cache-snapshot.outputs.cache-hit != 'true' }} + uses: actions/checkout@v4 + with: + ref: ${{ github.event_name == 'pull_request' && github.event.pull_request.base.sha || github.event_name == 'merge_group' && github.event.merge_group.base.sha || 'develop' }} + + - name: Cypress run + uses: cypress-io/github-action@v4 + id: cypress-snapshot-gen + if: ${{ steps.cache-snapshot.outputs.cache-hit != 'true' }} + with: + start: pnpm run dev + wait-on: 'http://localhost:9000' + browser: chrome + spec: | + cypress/integration/rendering/flowchart-v2.spec.js + e2e: runs-on: ubuntu-latest + needs: cache strategy: fail-fast: false matrix: @@ -27,6 +63,13 @@ jobs: with: node-version: ${{ matrix.node-version }} + - name: Cache snapshots + id: cache-snapshot + uses: actions/cache/restore@v3 + with: + path: ./cypress/snapshots + key: ${{ runner.os }}-snapshots + # Install NPM dependencies, cache them correctly # and run all Cypress tests - name: Cypress run @@ -38,14 +81,19 @@ jobs: with: start: pnpm run dev:coverage wait-on: 'http://localhost:9000' + browser: chrome # Disable recording if we don't have an API key # e.g. if this action was run from a fork record: ${{ secrets.CYPRESS_RECORD_KEY != '' }} parallel: ${{ secrets.CYPRESS_RECORD_KEY != '' }} + # TODO: Remove + spec: | + cypress/integration/rendering/flowchart-v2.spec.js env: CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }} VITEST_COVERAGE: true CYPRESS_COMMIT: ${{ github.sha }} + - name: Upload Coverage to Codecov uses: codecov/codecov-action@v3 # Run step only pushes to develop and pull_requests @@ -57,6 +105,7 @@ jobs: fail_ci_if_error: false verbose: true token: 6845cc80-77ee-4e17-85a1-026cd95e0766 + - name: Upload Artifacts uses: actions/upload-artifact@v3 if: ${{ failure() && steps.cypress.conclusion == 'failure' }} diff --git a/cSpell.json b/cSpell.json index 3ea9594f7..82c1c81c4 100644 --- a/cSpell.json +++ b/cSpell.json @@ -124,6 +124,7 @@ "sidharth", "sidharthv", "sphinxcontrib", + "ssim", "startx", "starty", "statediagram", diff --git a/cypress.config.cjs b/cypress.config.cjs index 30076c56e..c754b465f 100644 --- a/cypress.config.cjs +++ b/cypress.config.cjs @@ -4,12 +4,21 @@ const { defineConfig } = require('cypress'); const { addMatchImageSnapshotPlugin } = require('cypress-image-snapshot/plugin'); const coverage = require('@cypress/code-coverage/task'); + module.exports = defineConfig({ projectId: 'n2sma2', + viewportWidth: 1440, + viewportHeight: 1024, e2e: { - specPattern: 'cypress/integration/**/*.{js,jsx,ts,tsx}', + specPattern: 'cypress/integration/**/*.{js,ts}', setupNodeEvents(on, config) { coverage(on, config); + on('before:browser:launch', (browser = {}, launchOptions) => { + if (browser.name === 'chrome' && browser.isHeadless) { + launchOptions.args.push('--window-size=1440,1024', '--force-device-scale-factor=1'); + } + return launchOptions; + }); addMatchImageSnapshotPlugin(on, config); // copy any needed variables from process.env to config.env config.env.useAppli = process.env.USE_APPLI ? true : false; diff --git a/cypress/integration/other/configuration.spec.js b/cypress/integration/other/configuration.spec.js index 7cbc5d105..23338271f 100644 --- a/cypress/integration/other/configuration.spec.js +++ b/cypress/integration/other/configuration.spec.js @@ -117,7 +117,6 @@ describe('Configuration', () => { }); it('should not taint the initial configuration when using multiple directives', () => { const url = 'http://localhost:9000/regression/issue-1874.html'; - cy.viewport(1440, 1024); cy.visit(url); cy.get('svg'); diff --git a/cypress/integration/other/rerender.spec.js b/cypress/integration/other/rerender.spec.js index f160a2e27..d14c6257e 100644 --- a/cypress/integration/other/rerender.spec.js +++ b/cypress/integration/other/rerender.spec.js @@ -1,14 +1,12 @@ describe('Rerendering', () => { it('should be able to render after an error has occurred', () => { const url = 'http://localhost:9000/render-after-error.html'; - cy.viewport(1440, 1024); cy.visit(url); cy.get('#graphDiv').should('exist'); }); it('should be able to render and rerender a graph via API', () => { const url = 'http://localhost:9000/rerender.html'; - cy.viewport(1440, 1024); cy.visit(url); cy.get('#graph [id^=flowchart-A]').should('have.text', 'XMas'); diff --git a/cypress/integration/rendering/gantt.spec.js b/cypress/integration/rendering/gantt.spec.js index 998a092c2..73ff4ee00 100644 --- a/cypress/integration/rendering/gantt.spec.js +++ b/cypress/integration/rendering/gantt.spec.js @@ -245,7 +245,10 @@ describe('Gantt diagram', () => { const style = svg.attr('style'); expect(style).to.match(/^max-width: [\d.]+px;$/); const maxWidthValue = parseFloat(style.match(/[\d.]+/g).join('')); - expect(maxWidthValue).to.be.within(984 * 0.95, 984 * 1.05); + expect(maxWidthValue).to.be.within( + Cypress.config().viewportWidth * 0.95, + Cypress.config().viewportWidth * 1.05 + ); }); }); @@ -285,11 +288,11 @@ describe('Gantt diagram', () => { { gantt: { useMaxWidth: false } } ); cy.get('svg').should((svg) => { - // const height = parseFloat(svg.attr('height')); const width = parseFloat(svg.attr('width')); - // use within because the absolute value can be slightly different depending on the environment ±5% - // expect(height).to.be.within(484 * 0.95, 484 * 1.05); - expect(width).to.be.within(984 * 0.95, 984 * 1.05); + expect(width).to.be.within( + Cypress.config().viewportWidth * 0.95, + Cypress.config().viewportWidth * 1.05 + ); expect(svg).to.not.have.attr('style'); }); }); diff --git a/cypress/support/commands.js b/cypress/support/commands.js index 3589640d9..7a77b3ba6 100644 --- a/cypress/support/commands.js +++ b/cypress/support/commands.js @@ -24,8 +24,14 @@ // -- This is will overwrite an existing command -- // Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... }) -// import '@percy/cypress'; - import { addMatchImageSnapshotCommand } from 'cypress-image-snapshot/command'; -addMatchImageSnapshotCommand(); +addMatchImageSnapshotCommand({ + comparisonMethod: 'ssim', + failureThreshold: 0.01, + failureThresholdType: 'percent', + customDiffConfig: { + ssim: 'fast', + }, + blur: 1, +}); From 76dacf8e90388042cf6171b5aa5aac704d34c7e3 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 12:10:39 +0530 Subject: [PATCH 132/170] E2E test --- cypress/integration/rendering/flowchart-v2.spec.js | 1 - 1 file changed, 1 deletion(-) diff --git a/cypress/integration/rendering/flowchart-v2.spec.js b/cypress/integration/rendering/flowchart-v2.spec.js index e23820ffa..fa625159d 100644 --- a/cypress/integration/rendering/flowchart-v2.spec.js +++ b/cypress/integration/rendering/flowchart-v2.spec.js @@ -6,7 +6,6 @@ describe('Flowchart v2', () => { `flowchart TD A[Christmas] -->|Get money| B(Go shopping) B --> C{Let me think} - C -->|One| D[Laptop] C -->|Two| E[iPhone] C -->|Three| F[fa:fa-car Car] `, From 7805e054957b019efa138ba2bece6889ac62ecf3 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 12:15:01 +0530 Subject: [PATCH 133/170] Update lockfile --- pnpm-lock.yaml | 121 ++++++++----------------------------------------- 1 file changed, 19 insertions(+), 102 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b9c49e0a0..2484f6312 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -377,7 +377,7 @@ importers: version: 1.0.0-alpha.72(@algolia/client-search@4.19.1)(@types/node@18.17.5)(search-insights@2.7.0) vitepress-plugin-search: specifier: ^1.0.4-alpha.20 - version: 1.0.4-alpha.20(flexsearch@0.7.31)(vitepress@1.0.0-alpha.72)(vue@3.3.8) + version: 1.0.4-alpha.20(flexsearch@0.7.31)(vitepress@1.0.0-alpha.72)(vue@3.4.15) packages/mermaid-example-diagram: dependencies: @@ -464,7 +464,7 @@ importers: version: 1.1.0 unocss: specifier: ^0.58.0 - version: 0.58.0(postcss@8.4.31)(rollup@2.79.1)(vite@4.5.0) + version: 0.58.0(postcss@8.4.33)(rollup@2.79.1)(vite@4.5.0) unplugin-vue-components: specifier: ^0.26.0 version: 0.26.0(rollup@2.79.1)(vue@3.3.4) @@ -476,7 +476,7 @@ importers: version: 0.17.0(vite@4.5.0)(workbox-build@7.0.0)(workbox-window@7.0.0) vitepress: specifier: 1.0.0-rc.39 - version: 1.0.0-rc.39(@algolia/client-search@4.19.1)(@types/node@18.17.5)(postcss@8.4.31)(search-insights@2.7.0)(typescript@5.1.6) + version: 1.0.0-rc.39(@algolia/client-search@4.19.1)(@types/node@18.17.5)(postcss@8.4.33)(search-insights@2.7.0)(typescript@5.1.6) workbox-window: specifier: ^7.0.0 version: 7.0.0 @@ -5593,7 +5593,7 @@ packages: sirv: 2.0.3 dev: true - /@unocss/postcss@0.58.0(postcss@8.4.31): + /@unocss/postcss@0.58.0(postcss@8.4.33): resolution: {integrity: sha512-2hAwLbfUFqysi8FN1cn3xkHy5GhLMlYy6W4NrAZ2ws7F2MKpsCT2xCj7dT5cI2tW8ulD2YoVbKH15dBhNsMNUA==} engines: {node: '>=14'} peerDependencies: @@ -5605,7 +5605,7 @@ packages: css-tree: 2.3.1 fast-glob: 3.3.2 magic-string: 0.30.5 - postcss: 8.4.31 + postcss: 8.4.33 dev: true /@unocss/preset-attributify@0.58.0: @@ -5876,15 +5876,6 @@ packages: estree-walker: 2.0.2 source-map-js: 1.0.2 - /@vue/compiler-core@3.3.8: - resolution: {integrity: sha512-hN/NNBUECw8SusQvDSqqcVv6gWq8L6iAktUR0UF3vGu2OhzRqcOiAno0FmBJWwxhYEXRlQJT5XnoKsVq1WZx4g==} - dependencies: - '@babel/parser': 7.23.5 - '@vue/shared': 3.3.8 - estree-walker: 2.0.2 - source-map-js: 1.0.2 - dev: true - /@vue/compiler-core@3.4.15: resolution: {integrity: sha512-XcJQVOaxTKCnth1vCxEChteGuwG6wqnUHxAm1DO3gCz0+uXKaJNx8/digSz4dLALCy8n2lKq24jSUs8segoqIw==} dependencies: @@ -5901,13 +5892,6 @@ packages: '@vue/compiler-core': 3.3.4 '@vue/shared': 3.3.4 - /@vue/compiler-dom@3.3.8: - resolution: {integrity: sha512-+PPtv+p/nWDd0AvJu3w8HS0RIm/C6VGBIRe24b9hSyNWOAPEUosFZ5diwawwP8ip5sJ8n0Pe87TNNNHnvjs0FQ==} - dependencies: - '@vue/compiler-core': 3.3.8 - '@vue/shared': 3.3.8 - dev: true - /@vue/compiler-dom@3.4.15: resolution: {integrity: sha512-wox0aasVV74zoXyblarOM3AZQz/Z+OunYcIHe1OsGclCHt8RsRm04DObjefaI82u6XDzv+qGWZ24tIsRAIi5MQ==} dependencies: @@ -5929,21 +5913,6 @@ packages: postcss: 8.4.31 source-map-js: 1.0.2 - /@vue/compiler-sfc@3.3.8: - resolution: {integrity: sha512-WMzbUrlTjfYF8joyT84HfwwXo+8WPALuPxhy+BZ6R4Aafls+jDBnSz8PDz60uFhuqFbl3HxRfxvDzrUf3THwpA==} - dependencies: - '@babel/parser': 7.23.5 - '@vue/compiler-core': 3.3.8 - '@vue/compiler-dom': 3.3.8 - '@vue/compiler-ssr': 3.3.8 - '@vue/reactivity-transform': 3.3.8 - '@vue/shared': 3.3.8 - estree-walker: 2.0.2 - magic-string: 0.30.5 - postcss: 8.4.31 - source-map-js: 1.0.2 - dev: true - /@vue/compiler-sfc@3.4.15: resolution: {integrity: sha512-LCn5M6QpkpFsh3GQvs2mJUOAlBQcCco8D60Bcqmf3O3w5a+KWS5GvYbrrJBkgvL1BDnTp+e8q0lXCLgHhKguBA==} dependencies: @@ -5964,13 +5933,6 @@ packages: '@vue/compiler-dom': 3.3.4 '@vue/shared': 3.3.4 - /@vue/compiler-ssr@3.3.8: - resolution: {integrity: sha512-hXCqQL/15kMVDBuoBYpUnSYT8doDNwsjvm3jTefnXr+ytn294ySnT8NlsFHmTgKNjwpuFy7XVV8yTeLtNl/P6w==} - dependencies: - '@vue/compiler-dom': 3.3.8 - '@vue/shared': 3.3.8 - dev: true - /@vue/compiler-ssr@3.4.15: resolution: {integrity: sha512-1jdeQyiGznr8gjFDadVmOJqZiLNSsMa5ZgqavkPZ8O2wjHv0tVuAEsw5hTdUoUW4232vpBbL/wJhzVW/JwY1Uw==} dependencies: @@ -5994,27 +5956,11 @@ packages: estree-walker: 2.0.2 magic-string: 0.30.5 - /@vue/reactivity-transform@3.3.8: - resolution: {integrity: sha512-49CvBzmZNtcHua0XJ7GdGifM8GOXoUMOX4dD40Y5DxI3R8OUhMlvf2nvgUAcPxaXiV5MQQ1Nwy09ADpnLQUqRw==} - dependencies: - '@babel/parser': 7.23.5 - '@vue/compiler-core': 3.3.8 - '@vue/shared': 3.3.8 - estree-walker: 2.0.2 - magic-string: 0.30.5 - dev: true - /@vue/reactivity@3.3.4: resolution: {integrity: sha512-kLTDLwd0B1jG08NBF3R5rqULtv/f8x3rOFByTDz4J53ttIQEDmALqKqXY0J+XQeN0aV2FBxY8nJDf88yvOPAqQ==} dependencies: '@vue/shared': 3.3.4 - /@vue/reactivity@3.3.8: - resolution: {integrity: sha512-ctLWitmFBu6mtddPyOKpHg8+5ahouoTCRtmAHZAXmolDtuZXfjL2T3OJ6DL6ezBPQB1SmMnpzjiWjCiMYmpIuw==} - dependencies: - '@vue/shared': 3.3.8 - dev: true - /@vue/reactivity@3.4.15: resolution: {integrity: sha512-55yJh2bsff20K5O84MxSvXKPHHt17I2EomHznvFiJCAZpJTNW8IuLj1xZWMLELRhBK3kkFV/1ErZGHJfah7i7w==} dependencies: @@ -6027,13 +5973,6 @@ packages: '@vue/reactivity': 3.3.4 '@vue/shared': 3.3.4 - /@vue/runtime-core@3.3.8: - resolution: {integrity: sha512-qurzOlb6q26KWQ/8IShHkMDOuJkQnQcTIp1sdP4I9MbCf9FJeGVRXJFr2mF+6bXh/3Zjr9TDgURXrsCr9bfjUw==} - dependencies: - '@vue/reactivity': 3.3.8 - '@vue/shared': 3.3.8 - dev: true - /@vue/runtime-core@3.4.15: resolution: {integrity: sha512-6E3by5m6v1AkW0McCeAyhHTw+3y17YCOKG0U0HDKDscV4Hs0kgNT5G+GCHak16jKgcCDHpI9xe5NKb8sdLCLdw==} dependencies: @@ -6048,14 +5987,6 @@ packages: '@vue/shared': 3.3.4 csstype: 3.1.2 - /@vue/runtime-dom@3.3.8: - resolution: {integrity: sha512-Noy5yM5UIf9UeFoowBVgghyGGPIDPy1Qlqt0yVsUdAVbqI8eeMSsTqBtauaEoT2UFXUk5S64aWVNJN4MJ2vRdA==} - dependencies: - '@vue/runtime-core': 3.3.8 - '@vue/shared': 3.3.8 - csstype: 3.1.2 - dev: true - /@vue/runtime-dom@3.4.15: resolution: {integrity: sha512-EVW8D6vfFVq3V/yDKNPBFkZKGMFSvZrUQmx196o/v2tHKdwWdiZjYUBS+0Ez3+ohRyF8Njwy/6FH5gYJ75liUw==} dependencies: @@ -6073,16 +6004,6 @@ packages: '@vue/shared': 3.3.4 vue: 3.3.4 - /@vue/server-renderer@3.3.8(vue@3.3.8): - resolution: {integrity: sha512-zVCUw7RFskvPuNlPn/8xISbrf0zTWsTSdYTsUTN1ERGGZGVnRxM2QZ3x1OR32+vwkkCm0IW6HmJ49IsPm7ilLg==} - peerDependencies: - vue: 3.3.8 - dependencies: - '@vue/compiler-ssr': 3.3.8 - '@vue/shared': 3.3.8 - vue: 3.3.8(typescript@5.0.4) - dev: true - /@vue/server-renderer@3.4.15(vue@3.4.15): resolution: {integrity: sha512-3HYzaidu9cHjrT+qGUuDhFYvF/j643bHC6uUN9BgM11DVy+pM6ATsG6uPBLnkwOgs7BpJABReLmpL3ZPAsUaqw==} peerDependencies: @@ -6090,16 +6011,12 @@ packages: dependencies: '@vue/compiler-ssr': 3.4.15 '@vue/shared': 3.4.15 - vue: 3.4.15(typescript@5.1.6) + vue: 3.4.15(typescript@5.0.4) dev: true /@vue/shared@3.3.4: resolution: {integrity: sha512-7OjdcV8vQ74eiz1TZLzZP4JwqM5fA94K6yntPS5Z25r9HDuGNzaGdgvwKYq6S+MxwF0TFRwe50fIR/MYnakdkQ==} - /@vue/shared@3.3.8: - resolution: {integrity: sha512-8PGwybFwM4x8pcfgqEQFy70NaQxASvOC5DJwLQfpArw1UDfUXrJkdxD3BhVTMS+0Lef/TU7YO0Jvr0jJY8T+mw==} - dev: true - /@vue/shared@3.4.15: resolution: {integrity: sha512-KzfPTxVaWfB+eGcGdbSf4CWdaXcGDqckoeXUh7SB3fZdEtzPCK2Vq9B/lRRL3yutax/LWITz+SwvgyOxz5V75g==} dev: true @@ -16175,7 +16092,7 @@ packages: engines: {node: '>= 10.0.0'} dev: true - /unocss@0.58.0(postcss@8.4.31)(rollup@2.79.1)(vite@4.5.0): + /unocss@0.58.0(postcss@8.4.33)(rollup@2.79.1)(vite@4.5.0): resolution: {integrity: sha512-MSPRHxBqWN+1AHGV+J5uUy4//e6ZBK6O+ISzD0qrXcCD/GNtxk1+lYjOK2ltkUiKX539+/KF91vNxzhhwEf+xA==} engines: {node: '>=14'} peerDependencies: @@ -16191,7 +16108,7 @@ packages: '@unocss/cli': 0.58.0(rollup@2.79.1) '@unocss/core': 0.58.0 '@unocss/extractor-arbitrary-variants': 0.58.0 - '@unocss/postcss': 0.58.0(postcss@8.4.31) + '@unocss/postcss': 0.58.0(postcss@8.4.33) '@unocss/preset-attributify': 0.58.0 '@unocss/preset-icons': 0.58.0 '@unocss/preset-mini': 0.58.0 @@ -16530,7 +16447,7 @@ packages: fsevents: 2.3.3 dev: true - /vitepress-plugin-search@1.0.4-alpha.20(flexsearch@0.7.31)(vitepress@1.0.0-alpha.72)(vue@3.3.8): + /vitepress-plugin-search@1.0.4-alpha.20(flexsearch@0.7.31)(vitepress@1.0.0-alpha.72)(vue@3.4.15): resolution: {integrity: sha512-zG+ev9pw1Mg7htABlFCNXb8XwnKN+qfTKw+vU0Ers6RIrABx+45EAAFBoaL1mEpl1FRFn1o/dQ7F4b8GP6HdGQ==} engines: {node: ^14.13.1 || ^16.7.0 || >=18} peerDependencies: @@ -16544,7 +16461,7 @@ packages: glob-to-regexp: 0.4.1 markdown-it: 13.0.1 vitepress: 1.0.0-alpha.72(@algolia/client-search@4.19.1)(@types/node@18.17.5)(search-insights@2.7.0) - vue: 3.3.8(typescript@5.0.4) + vue: 3.4.15(typescript@5.0.4) dev: true /vitepress@1.0.0-alpha.72(@algolia/client-search@4.19.1)(@types/node@18.17.5)(search-insights@2.7.0): @@ -16578,7 +16495,7 @@ packages: - terser dev: true - /vitepress@1.0.0-rc.39(@algolia/client-search@4.19.1)(@types/node@18.17.5)(postcss@8.4.31)(search-insights@2.7.0)(typescript@5.1.6): + /vitepress@1.0.0-rc.39(@algolia/client-search@4.19.1)(@types/node@18.17.5)(postcss@8.4.33)(search-insights@2.7.0)(typescript@5.1.6): resolution: {integrity: sha512-EcgoRlAAp37WOxUOYv45oxyhLrcy3Upey+mKpqW3ldsg6Ol4trPndRBk2GO0QiSvEKlb9BMerk49D/bFICN6kg==} hasBin: true peerDependencies: @@ -16600,7 +16517,7 @@ packages: focus-trap: 7.5.4 mark.js: 8.11.1 minisearch: 6.3.0 - postcss: 8.4.31 + postcss: 8.4.33 shikiji: 0.9.19 shikiji-core: 0.9.19 shikiji-transformers: 0.9.19 @@ -16788,19 +16705,19 @@ packages: '@vue/server-renderer': 3.3.4(vue@3.3.4) '@vue/shared': 3.3.4 - /vue@3.3.8(typescript@5.0.4): - resolution: {integrity: sha512-5VSX/3DabBikOXMsxzlW8JyfeLKlG9mzqnWgLQLty88vdZL7ZJgrdgBOmrArwxiLtmS+lNNpPcBYqrhE6TQW5w==} + /vue@3.4.15(typescript@5.0.4): + resolution: {integrity: sha512-jC0GH4KkWLWJOEQjOpkqU1bQsBwf4R1rsFtw5GQJbjHVKWDzO6P0nWWBTmjp1xSemAioDFj1jdaK1qa3DnMQoQ==} peerDependencies: typescript: '*' peerDependenciesMeta: typescript: optional: true dependencies: - '@vue/compiler-dom': 3.3.8 - '@vue/compiler-sfc': 3.3.8 - '@vue/runtime-dom': 3.3.8 - '@vue/server-renderer': 3.3.8(vue@3.3.8) - '@vue/shared': 3.3.8 + '@vue/compiler-dom': 3.4.15 + '@vue/compiler-sfc': 3.4.15 + '@vue/runtime-dom': 3.4.15 + '@vue/server-renderer': 3.4.15(vue@3.4.15) + '@vue/shared': 3.4.15 typescript: 5.0.4 dev: true From 448756ab54480e5e82b5290c00ec3350c6f34879 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 12:17:20 +0530 Subject: [PATCH 134/170] Fix lint --- .github/workflows/e2e.yml | 4 ++-- cypress.config.cjs | 1 - 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 09e8546ff..a357c1c99 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -32,7 +32,7 @@ jobs: uses: actions/checkout@v4 with: ref: ${{ github.event_name == 'pull_request' && github.event.pull_request.base.sha || github.event_name == 'merge_group' && github.event.merge_group.base.sha || 'develop' }} - + - name: Cypress run uses: cypress-io/github-action@v4 id: cypress-snapshot-gen @@ -43,7 +43,7 @@ jobs: browser: chrome spec: | cypress/integration/rendering/flowchart-v2.spec.js - + e2e: runs-on: ubuntu-latest needs: cache diff --git a/cypress.config.cjs b/cypress.config.cjs index c754b465f..33633920a 100644 --- a/cypress.config.cjs +++ b/cypress.config.cjs @@ -4,7 +4,6 @@ const { defineConfig } = require('cypress'); const { addMatchImageSnapshotPlugin } = require('cypress-image-snapshot/plugin'); const coverage = require('@cypress/code-coverage/task'); - module.exports = defineConfig({ projectId: 'n2sma2', viewportWidth: 1440, From d6e738ac4cf2e208326b0ca3a8702d940cb846ec Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 12:21:51 +0530 Subject: [PATCH 135/170] Run all tests --- .github/workflows/e2e.yml | 5 ----- cypress/integration/rendering/flowchart-v2.spec.js | 1 + 2 files changed, 1 insertion(+), 5 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index a357c1c99..996fc6673 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -41,8 +41,6 @@ jobs: start: pnpm run dev wait-on: 'http://localhost:9000' browser: chrome - spec: | - cypress/integration/rendering/flowchart-v2.spec.js e2e: runs-on: ubuntu-latest @@ -86,9 +84,6 @@ jobs: # e.g. if this action was run from a fork record: ${{ secrets.CYPRESS_RECORD_KEY != '' }} parallel: ${{ secrets.CYPRESS_RECORD_KEY != '' }} - # TODO: Remove - spec: | - cypress/integration/rendering/flowchart-v2.spec.js env: CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }} VITEST_COVERAGE: true diff --git a/cypress/integration/rendering/flowchart-v2.spec.js b/cypress/integration/rendering/flowchart-v2.spec.js index fa625159d..e23820ffa 100644 --- a/cypress/integration/rendering/flowchart-v2.spec.js +++ b/cypress/integration/rendering/flowchart-v2.spec.js @@ -6,6 +6,7 @@ describe('Flowchart v2', () => { `flowchart TD A[Christmas] -->|Get money| B(Go shopping) B --> C{Let me think} + C -->|One| D[Laptop] C -->|Two| E[iPhone] C -->|Three| F[fa:fa-car Car] `, From cb0ee5aa419849427b4de5b553ef734d22840cae Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 13:17:14 +0530 Subject: [PATCH 136/170] Use pixelmatch for image comparison --- cSpell.json | 1 + cypress/support/commands.js | 22 +++++++++++++--------- 2 files changed, 14 insertions(+), 9 deletions(-) diff --git a/cSpell.json b/cSpell.json index 82c1c81c4..4b8772347 100644 --- a/cSpell.json +++ b/cSpell.json @@ -102,6 +102,7 @@ "pathe", "pbrolin", "phpbb", + "pixelmatch", "plantuml", "playfair", "pnpm", diff --git a/cypress/support/commands.js b/cypress/support/commands.js index 7a77b3ba6..6fc1fe17d 100644 --- a/cypress/support/commands.js +++ b/cypress/support/commands.js @@ -26,12 +26,16 @@ import { addMatchImageSnapshotCommand } from 'cypress-image-snapshot/command'; -addMatchImageSnapshotCommand({ - comparisonMethod: 'ssim', - failureThreshold: 0.01, - failureThresholdType: 'percent', - customDiffConfig: { - ssim: 'fast', - }, - blur: 1, -}); +// The SSIM comparison method can be used if the pixelmatch is throwing lots of false positives. +// SSIM actually does not catch minute changes in the image, so it is not as accurate as pixelmatch. +// addMatchImageSnapshotCommand({ +// comparisonMethod: 'ssim', +// failureThreshold: 0.01, +// failureThresholdType: 'percent', +// customDiffConfig: { +// ssim: 'fast', +// }, +// blur: 1, +// }); + +addMatchImageSnapshotCommand(); From 658af081ee2781cc159dbc2826857def3765f281 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 14:42:51 +0530 Subject: [PATCH 137/170] Flatten uploaded images --- .github/workflows/e2e.yml | 26 ++++++++++++++++++++++++-- 1 file changed, 24 insertions(+), 2 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 996fc6673..436624968 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -102,8 +102,30 @@ jobs: token: 6845cc80-77ee-4e17-85a1-026cd95e0766 - name: Upload Artifacts - uses: actions/upload-artifact@v3 + uses: actions/upload-artifact@v4 if: ${{ failure() && steps.cypress.conclusion == 'failure' }} with: - name: error-snapshots + name: error-snapshots-${{ matrix.containers }} + retention-days: 1 path: cypress/snapshots/**/__diff_output__/* + + combineArtifacts: + needs: e2e + runs-on: ubuntu-latest + steps: + - name: Download All Artifacts + uses: actions/download-artifact@v4 + with: + path: snapshots + pattern: error-snapshots-* + merge-multiple: true + - run: | + mkdir errors + cd snapshots + find . -mindepth 2 -type f -print -exec mv {} ../errors/ \; + - name: Upload Artifacts + uses: actions/upload-artifact@v4 + with: + name: error-snapshots + retention-days: 10 + path: errors/ \ No newline at end of file From 4ce5d071250ec7b281ad9009e557551bc68ceeca Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 14:46:21 +0530 Subject: [PATCH 138/170] Flatten uploaded images --- .github/workflows/e2e.yml | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 436624968..29bd6eab5 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -113,19 +113,19 @@ jobs: needs: e2e runs-on: ubuntu-latest steps: - - name: Download All Artifacts - uses: actions/download-artifact@v4 - with: - path: snapshots - pattern: error-snapshots-* - merge-multiple: true - - run: | - mkdir errors - cd snapshots - find . -mindepth 2 -type f -print -exec mv {} ../errors/ \; - - name: Upload Artifacts - uses: actions/upload-artifact@v4 - with: - name: error-snapshots - retention-days: 10 - path: errors/ \ No newline at end of file + - name: Download All Artifacts + uses: actions/download-artifact@v4 + with: + path: snapshots + pattern: error-snapshots-* + merge-multiple: true + - run: | + mkdir errors + cd snapshots + find . -mindepth 2 -type f -print -exec mv {} ../errors/ \; + - name: Upload Artifacts + uses: actions/upload-artifact@v4 + with: + name: error-snapshots + retention-days: 10 + path: errors/ From f58a86d747ab5a773fddf905e23176ebf8581c5e Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 15:30:18 +0530 Subject: [PATCH 139/170] Notify users --- .github/workflows/e2e.yml | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 29bd6eab5..cfc8a45d2 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -111,6 +111,7 @@ jobs: combineArtifacts: needs: e2e + if: ${{ failure() }} runs-on: ubuntu-latest steps: - name: Download All Artifacts @@ -125,7 +126,12 @@ jobs: find . -mindepth 2 -type f -print -exec mv {} ../errors/ \; - name: Upload Artifacts uses: actions/upload-artifact@v4 + id: upload-artifacts with: name: error-snapshots retention-days: 10 path: errors/ + - name: Notify Users + run: | + echo "::error,title=Visual tests failed::You can view images that failed by downloading the error-snapshots artifact: ${{ steps.upload-artifacts.outputs.artifact-url }}" + From a9a8a208a6dc011db8c737cbee4c0eb228af2abb Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 15:50:40 +0530 Subject: [PATCH 140/170] Update cache key --- .github/workflows/e2e.yml | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index cfc8a45d2..3b983589d 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -8,6 +8,9 @@ on: permissions: contents: read +env: + targetHash: ${{ github.event_name == 'pull_request' && github.event.pull_request.base.sha || github.event_name == 'merge_group' && github.event.merge_group.base.sha || github.event.before }} + jobs: cache: runs-on: ubuntu-latest @@ -25,13 +28,13 @@ jobs: with: save-always: true path: ./cypress/snapshots - key: ${{ runner.os }}-snapshots + key: ${{ runner.os }}-snapshots-${{ env.targetHash }} - name: Switch to base branch if: ${{ steps.cache-snapshot.outputs.cache-hit != 'true' }} uses: actions/checkout@v4 with: - ref: ${{ github.event_name == 'pull_request' && github.event.pull_request.base.sha || github.event_name == 'merge_group' && github.event.merge_group.base.sha || 'develop' }} + ref: ${{ env.targetHash }} - name: Cypress run uses: cypress-io/github-action@v4 @@ -66,7 +69,7 @@ jobs: uses: actions/cache/restore@v3 with: path: ./cypress/snapshots - key: ${{ runner.os }}-snapshots + key: ${{ runner.os }}-snapshots-${{ env.targetHash }} # Install NPM dependencies, cache them correctly # and run all Cypress tests @@ -109,6 +112,14 @@ jobs: retention-days: 1 path: cypress/snapshots/**/__diff_output__/* + - name: Save snapshots cache + id: cache-upload + if: ${{ github.event_name == 'push' }} + uses: actions/cache/save@v3 + with: + path: ./cypress/snapshots + key: ${{ runner.os }}-snapshots-${{ github.event.after }} + combineArtifacts: needs: e2e if: ${{ failure() }} From be4721b24db004317f451ac406bb094379ce0f59 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 16:18:07 +0530 Subject: [PATCH 141/170] Fix cache save --- .github/workflows/e2e.yml | 33 +++++++++++++++++++-------------- 1 file changed, 19 insertions(+), 14 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 3b983589d..9f4fd86b2 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -108,34 +108,38 @@ jobs: uses: actions/upload-artifact@v4 if: ${{ failure() && steps.cypress.conclusion == 'failure' }} with: - name: error-snapshots-${{ matrix.containers }} + name: snapshots-${{ matrix.containers }} retention-days: 1 - path: cypress/snapshots/**/__diff_output__/* - - - name: Save snapshots cache - id: cache-upload - if: ${{ github.event_name == 'push' }} - uses: actions/cache/save@v3 - with: path: ./cypress/snapshots - key: ${{ runner.os }}-snapshots-${{ github.event.after }} combineArtifacts: needs: e2e - if: ${{ failure() }} runs-on: ubuntu-latest steps: - name: Download All Artifacts uses: actions/download-artifact@v4 with: path: snapshots - pattern: error-snapshots-* + pattern: snapshots-* merge-multiple: true - - run: | + + - name: Save snapshots cache + id: cache-upload + if: ${{ github.event_name == 'push' }} + uses: actions/cache/save@v3 + with: + path: | + ./cypress/snapshots + !./**/__diff_output__/* + key: ${{ runner.os }}-snapshots-${{ github.event.after }} + + - if: ${{ failure() }} + run: | mkdir errors cd snapshots - find . -mindepth 2 -type f -print -exec mv {} ../errors/ \; - - name: Upload Artifacts + find . -mindepth 2 -type d -name "*__diff_output__*" -exec sh -c 'mv "$0"/*.png ../errors/' {} \; + - name: Upload Error snapshots + if: ${{ failure() }} uses: actions/upload-artifact@v4 id: upload-artifacts with: @@ -143,6 +147,7 @@ jobs: retention-days: 10 path: errors/ - name: Notify Users + if: ${{ failure() }} run: | echo "::error,title=Visual tests failed::You can view images that failed by downloading the error-snapshots artifact: ${{ steps.upload-artifacts.outputs.artifact-url }}" From 35b3192c2bf69cd3d15e35cb4422ab5c5f7afbd5 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 16:23:26 +0530 Subject: [PATCH 142/170] Fix error message --- .github/workflows/e2e.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 9f4fd86b2..5326cb457 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -149,5 +149,5 @@ jobs: - name: Notify Users if: ${{ failure() }} run: | - echo "::error,title=Visual tests failed::You can view images that failed by downloading the error-snapshots artifact: ${{ steps.upload-artifacts.outputs.artifact-url }}" + echo "::error title=Visual tests failed::You can view images that failed by downloading the error-snapshots artifact: ${{ steps.upload-artifacts.outputs.artifact-url }}" From 6f205f89b22d82af5d56fb1613307e2b7b50db69 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 16:24:42 +0530 Subject: [PATCH 143/170] Always run combineArtifacts --- .github/workflows/e2e.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 5326cb457..754f9ada1 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -115,6 +115,7 @@ jobs: combineArtifacts: needs: e2e runs-on: ubuntu-latest + if: ${{ always() }} steps: - name: Download All Artifacts uses: actions/download-artifact@v4 From a964af67ec5f1954342cd0b2711b97ee26a7c963 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 19:04:25 +0530 Subject: [PATCH 144/170] Handle edge cases in E2E --- .github/workflows/e2e.yml | 38 +++++++++++++++------ cypress/integration/rendering/debug.spec.js | 12 ------- 2 files changed, 27 insertions(+), 23 deletions(-) delete mode 100644 cypress/integration/rendering/debug.spec.js diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 754f9ada1..90769858e 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -1,3 +1,9 @@ +# We use github cache to save snapshots between runs. +# For PRs and MergeQueues, the target commit is used, and for push events, github.event.previous is used. +# If a snapshot for a given Hash is not found, we checkout that commit, run the tests and cache the snapshots. +# These are then downloaded before running the E2E, providing the reference snapshots. +# If there are any errors, the diff image is uploaded to artifacts, and the user is notified. + name: E2E on: @@ -9,7 +15,8 @@ permissions: contents: read env: - targetHash: ${{ github.event_name == 'pull_request' && github.event.pull_request.base.sha || github.event_name == 'merge_group' && github.event.merge_group.base.sha || github.event.before }} + # For PRs and MergeQueues, the target commit is used, and for push events, github.event.previous is used. + targetHash: ${{ github.event.pull_request.base.sha || github.event.merge_group.base_sha || github.event.before }} jobs: cache: @@ -30,6 +37,7 @@ jobs: path: ./cypress/snapshots key: ${{ runner.os }}-snapshots-${{ env.targetHash }} + # If a snapshot for a given Hash is not found, we checkout that commit, run the tests and cache the snapshots. - name: Switch to base branch if: ${{ steps.cache-snapshot.outputs.cache-hit != 'true' }} uses: actions/checkout@v4 @@ -44,6 +52,8 @@ jobs: start: pnpm run dev wait-on: 'http://localhost:9000' browser: chrome + spec: + cypress/integration/rendering/sequencediagram.spec.js e2e: runs-on: ubuntu-latest @@ -64,6 +74,7 @@ jobs: with: node-version: ${{ matrix.node-version }} + # These cached snapshots are downloaded, providing the reference snapshots. - name: Cache snapshots id: cache-snapshot uses: actions/cache/restore@v3 @@ -87,6 +98,8 @@ jobs: # e.g. if this action was run from a fork record: ${{ secrets.CYPRESS_RECORD_KEY != '' }} parallel: ${{ secrets.CYPRESS_RECORD_KEY != '' }} + spec: + cypress/integration/rendering/sequencediagram.spec.js env: CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }} VITEST_COVERAGE: true @@ -104,9 +117,10 @@ jobs: verbose: true token: 6845cc80-77ee-4e17-85a1-026cd95e0766 + # We upload the artifacts into numbered archives to prevent overwriting - name: Upload Artifacts uses: actions/upload-artifact@v4 - if: ${{ failure() && steps.cypress.conclusion == 'failure' }} + if: ${{ always() }} with: name: snapshots-${{ matrix.containers }} retention-days: 1 @@ -117,38 +131,40 @@ jobs: runs-on: ubuntu-latest if: ${{ always() }} steps: + # Download all snapshot artifacts and merge them into a single folder - name: Download All Artifacts uses: actions/download-artifact@v4 with: path: snapshots pattern: snapshots-* merge-multiple: true - + + # For successful push events, we save the snapshots cache - name: Save snapshots cache id: cache-upload - if: ${{ github.event_name == 'push' }} + if: ${{ github.event_name == 'push' && needs.e2e.result != 'failure' }} uses: actions/cache/save@v3 with: - path: | - ./cypress/snapshots - !./**/__diff_output__/* + path: ./snapshots key: ${{ runner.os }}-snapshots-${{ github.event.after }} - - if: ${{ failure() }} + - name: Flatten images to a folder + if: ${{ needs.e2e.result == 'failure' }} run: | mkdir errors cd snapshots find . -mindepth 2 -type d -name "*__diff_output__*" -exec sh -c 'mv "$0"/*.png ../errors/' {} \; + - name: Upload Error snapshots - if: ${{ failure() }} + if: ${{ needs.e2e.result == 'failure' }} uses: actions/upload-artifact@v4 id: upload-artifacts with: name: error-snapshots retention-days: 10 path: errors/ + - name: Notify Users - if: ${{ failure() }} + if: ${{ needs.e2e.result == 'failure' }} run: | echo "::error title=Visual tests failed::You can view images that failed by downloading the error-snapshots artifact: ${{ steps.upload-artifacts.outputs.artifact-url }}" - diff --git a/cypress/integration/rendering/debug.spec.js b/cypress/integration/rendering/debug.spec.js deleted file mode 100644 index 56ad0f15f..000000000 --- a/cypress/integration/rendering/debug.spec.js +++ /dev/null @@ -1,12 +0,0 @@ -import { imgSnapshotTest } from '../../helpers/util.ts'; - -describe('Flowchart', () => { - it('34: testing the label width in percy', () => { - imgSnapshotTest( - `graph TD - A[Christmas] - `, - { theme: 'forest', fontFamily: '"Noto Sans SC", sans-serif' } - ); - }); -}); From a871a68f3c8bce5419bcd6f04deaeddd0defa473 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 19:05:06 +0530 Subject: [PATCH 145/170] Remove spec selector --- .github/workflows/e2e.yml | 4 ---- 1 file changed, 4 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 90769858e..817635cbf 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -52,8 +52,6 @@ jobs: start: pnpm run dev wait-on: 'http://localhost:9000' browser: chrome - spec: - cypress/integration/rendering/sequencediagram.spec.js e2e: runs-on: ubuntu-latest @@ -98,8 +96,6 @@ jobs: # e.g. if this action was run from a fork record: ${{ secrets.CYPRESS_RECORD_KEY != '' }} parallel: ${{ secrets.CYPRESS_RECORD_KEY != '' }} - spec: - cypress/integration/rendering/sequencediagram.spec.js env: CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }} VITEST_COVERAGE: true From f1fc874da8d4bdef88add516c7e6c046fdb9b755 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 19:20:39 +0530 Subject: [PATCH 146/170] Debug --- .github/workflows/e2e.yml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 817635cbf..56bdd30a0 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -16,12 +16,13 @@ permissions: env: # For PRs and MergeQueues, the target commit is used, and for push events, github.event.previous is used. - targetHash: ${{ github.event.pull_request.base.sha || github.event.merge_group.base_sha || github.event.before }} + targetHash: ${{ github.event_name == 'pull_request' && github.event.pull_request.base.sha || github.event_name == 'merge_group' && github.event.merge_group.base_sha || github.event.before }} jobs: cache: runs-on: ubuntu-latest steps: + - run: echo "${{ github.event }}" - uses: actions/checkout@v4 - uses: pnpm/action-setup@v2 - name: Setup Node.js From 279e31bc559caade5d63ce0712273f02a77f244d Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 19:23:13 +0530 Subject: [PATCH 147/170] Debug --- .github/workflows/e2e.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 56bdd30a0..674f27672 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -22,7 +22,7 @@ jobs: cache: runs-on: ubuntu-latest steps: - - run: echo "${{ github.event }}" + - run: echo "${{ toJSON(github) }}" - uses: actions/checkout@v4 - uses: pnpm/action-setup@v2 - name: Setup Node.js From f5dd24bce4488cb636f384b949c0ea5583eda860 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 19:29:45 +0530 Subject: [PATCH 148/170] Remove :: --- .github/workflows/e2e.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 674f27672..30c25cb91 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -22,7 +22,7 @@ jobs: cache: runs-on: ubuntu-latest steps: - - run: echo "${{ toJSON(github) }}" + - run: echo "${{ toJSON(github) }}" | sed 's/::/:/g' - uses: actions/checkout@v4 - uses: pnpm/action-setup@v2 - name: Setup Node.js From 3935f6b389e715382c0701c499ca6825fe34b299 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 19:31:25 +0530 Subject: [PATCH 149/170] Remove :: --- .github/workflows/e2e.yml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 30c25cb91..7d3bd3628 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -22,7 +22,8 @@ jobs: cache: runs-on: ubuntu-latest steps: - - run: echo "${{ toJSON(github) }}" | sed 's/::/:/g' + - run: | + echo "${{ toJSON(github) }}" | sed 's/::/:/g' - uses: actions/checkout@v4 - uses: pnpm/action-setup@v2 - name: Setup Node.js From 8bfb269b373611d3b4884177c47f1c9ed71289ce Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 19:33:59 +0530 Subject: [PATCH 150/170] Remove :: --- .github/workflows/e2e.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 7d3bd3628..aab0e1fac 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -23,7 +23,7 @@ jobs: runs-on: ubuntu-latest steps: - run: | - echo "${{ toJSON(github) }}" | sed 's/::/:/g' + echo '${{ toJSON(github) }}' | sed 's/::/:/g' - uses: actions/checkout@v4 - uses: pnpm/action-setup@v2 - name: Setup Node.js From aadf32ab3edfc48ba48445e828349cb7b74f3be8 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 19:45:55 +0530 Subject: [PATCH 151/170] Ignore push events on merge queue --- .github/workflows/e2e.yml | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index aab0e1fac..36ec672a2 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -8,6 +8,8 @@ name: E2E on: push: + branches-ignore: + - 'gh-readonly-queue/**' pull_request: merge_group: @@ -16,7 +18,7 @@ permissions: env: # For PRs and MergeQueues, the target commit is used, and for push events, github.event.previous is used. - targetHash: ${{ github.event_name == 'pull_request' && github.event.pull_request.base.sha || github.event_name == 'merge_group' && github.event.merge_group.base_sha || github.event.before }} + targetHash: ${{ github.event.pull_request.base.sha || github.event.merge_group.base_sha || github.event.before }} jobs: cache: From d0224b23b0e112c37debff62d685510117e226a5 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 19:47:42 +0530 Subject: [PATCH 152/170] Cleanup e2e.yml --- .github/workflows/e2e.yml | 2 -- 1 file changed, 2 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 36ec672a2..c23dc88ba 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -24,8 +24,6 @@ jobs: cache: runs-on: ubuntu-latest steps: - - run: | - echo '${{ toJSON(github) }}' | sed 's/::/:/g' - uses: actions/checkout@v4 - uses: pnpm/action-setup@v2 - name: Setup Node.js From 1f37b6c91bc410c25968f7b7bda87debf966f38a Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 23:28:43 +0530 Subject: [PATCH 153/170] Fix lint --- packages/mermaid/src/docs/ecosystem/integrations-community.md | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/mermaid/src/docs/ecosystem/integrations-community.md b/packages/mermaid/src/docs/ecosystem/integrations-community.md index 558725366..73c4b9ef0 100644 --- a/packages/mermaid/src/docs/ecosystem/integrations-community.md +++ b/packages/mermaid/src/docs/ecosystem/integrations-community.md @@ -245,4 +245,3 @@ Communication tools and platforms - [mermaid-server: Generate diagrams using a HTTP request](https://github.com/TomWright/mermaid-server) - [ExDoc](https://github.com/elixir-lang/ex_doc) - [Rendering Mermaid graphs](https://github.com/elixir-lang/ex_doc#rendering-mermaid-graphs) - From 1e70b3817e3c3fcb414af8c217196d916b0564b7 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 23:38:27 +0530 Subject: [PATCH 154/170] Use pnpm/action-setup@v2 --- .github/workflows/update-browserlist.yml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.github/workflows/update-browserlist.yml b/.github/workflows/update-browserlist.yml index 463160256..7c376e3bd 100644 --- a/.github/workflows/update-browserlist.yml +++ b/.github/workflows/update-browserlist.yml @@ -9,7 +9,8 @@ jobs: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - - run: npm install pnpm -g && npx update-browserslist-db@latest + - uses: pnpm/action-setup@v2 + - run: npx update-browserslist-db@latest - name: Commit changes uses: EndBug/add-and-commit@v9 with: From 84a18a1858a47f547022922fb30252328f4a77ee Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Fri, 19 Jan 2024 23:47:07 +0530 Subject: [PATCH 155/170] Fix Update Browserslist --- .github/workflows/update-browserlist.yml | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/.github/workflows/update-browserlist.yml b/.github/workflows/update-browserlist.yml index 0a83df795..f4fa2a982 100644 --- a/.github/workflows/update-browserlist.yml +++ b/.github/workflows/update-browserlist.yml @@ -9,10 +9,17 @@ jobs: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - - run: npx browserslist@latest --update-db + - uses: pnpm/action-setup@v2 + - run: npx update-browserslist-db@latest - name: Commit changes uses: EndBug/add-and-commit@v9 with: author_name: ${{ github.actor }} author_email: ${{ github.actor }}@users.noreply.github.com message: 'chore: update browsers list' + push: false + - name: Create Pull Request + uses: peter-evans/create-pull-request@v5 + with: + branch: update-browserslist + title: Update Browserslist From 8fd268d59be6c0bc7d4d25eb5fae6abe6bc9320b Mon Sep 17 00:00:00 2001 From: Vitor Soares Silva Date: Fri, 19 Jan 2024 16:10:23 -0300 Subject: [PATCH 156/170] add sequenceDiagram link e2e test --- .../rendering/sequencediagram.spec.js | 28 +++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/cypress/integration/rendering/sequencediagram.spec.js b/cypress/integration/rendering/sequencediagram.spec.js index 27e03da9c..10432f057 100644 --- a/cypress/integration/rendering/sequencediagram.spec.js +++ b/cypress/integration/rendering/sequencediagram.spec.js @@ -792,6 +792,34 @@ context('Sequence diagram', () => { }); }); context('links', () => { + it('should support actor links', () => { + renderGraph( + ` + sequenceDiagram + link Alice: Dashboard @ https://dashboard.contoso.com/alice + link Alice: Wiki @ https://wiki.contoso.com/alice + link John: Dashboard @ https://dashboard.contoso.com/john + link John: Wiki @ https://wiki.contoso.com/john + Alice->>John: Hello John
+ John-->>Alice: Great

day! + `, + { securityLevel: 'loose' } + ); + cy.get('#actor0_popup').should((popupMenu) => { + const style = popupMenu.attr('style'); + expect(style).to.undefined; + }); + cy.get('#root-0').click(); + cy.get('#actor0_popup').should((popupMenu) => { + const style = popupMenu.attr('style'); + expect(style).to.match(/^display: block;$/); + }); + cy.get('#root-0').click(); + cy.get('#actor0_popup').should((popupMenu) => { + const style = popupMenu.attr('style'); + expect(style).to.match(/^display: none;$/); + }); + }); it('should support actor links and properties EXPERIMENTAL: USE WITH CAUTION', () => { //Be aware that the syntax for "properties" is likely to be changed. imgSnapshotTest( From 2bbdd15031722cf4689526f48015b36ae1c7e594 Mon Sep 17 00:00:00 2001 From: Reda Al Sulais Date: Sat, 20 Jan 2024 13:30:49 +0300 Subject: [PATCH 157/170] docs: fix swimm link --- docs/ecosystem/integrations-community.md | 2 +- packages/mermaid/src/docs/ecosystem/integrations-community.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/ecosystem/integrations-community.md b/docs/ecosystem/integrations-community.md index a9174d8aa..6ad02f6b6 100644 --- a/docs/ecosystem/integrations-community.md +++ b/docs/ecosystem/integrations-community.md @@ -60,7 +60,7 @@ To add an integration to this list, see the [Integrations - create page](./integ - [Mermaid Flow Visual Editor](https://www.mermaidflow.app) ✅ - [Mermerd](https://github.com/KarnerTh/mermerd) - [Slab](https://slab.com) ✅ -- [Swimm](https://docs.swimm.io/Features/diagrams-and-charts#mermaid--swimm--up-to-date-diagrams-) ✅ +- [Swimm](https://docs.swimm.io/features/diagrams-and-charts/#mermaid--swimm--up-to-date-diagrams-) ✅ - [NotesHub](https://noteshub.app) ✅ - [Notion](https://notion.so) ✅ - [Observable](https://observablehq.com/@observablehq/mermaid) ✅ diff --git a/packages/mermaid/src/docs/ecosystem/integrations-community.md b/packages/mermaid/src/docs/ecosystem/integrations-community.md index 73c4b9ef0..a567e6788 100644 --- a/packages/mermaid/src/docs/ecosystem/integrations-community.md +++ b/packages/mermaid/src/docs/ecosystem/integrations-community.md @@ -55,7 +55,7 @@ To add an integration to this list, see the [Integrations - create page](./integ - [Mermaid Flow Visual Editor](https://www.mermaidflow.app) ✅ - [Mermerd](https://github.com/KarnerTh/mermerd) - [Slab](https://slab.com) ✅ -- [Swimm](https://docs.swimm.io/Features/diagrams-and-charts#mermaid--swimm--up-to-date-diagrams-) ✅ +- [Swimm](https://docs.swimm.io/features/diagrams-and-charts/#mermaid--swimm--up-to-date-diagrams-) ✅ - [NotesHub](https://noteshub.app) ✅ - [Notion](https://notion.so) ✅ - [Observable](https://observablehq.com/@observablehq/mermaid) ✅ From 4f60a2747256f11902b5dc3bf19d55654205c772 Mon Sep 17 00:00:00 2001 From: Matheus B Date: Sat, 20 Jan 2024 20:57:58 -0300 Subject: [PATCH 158/170] Change repetitive values into consts --- .../src/diagrams/git/gitGraphRenderer.js | 40 +++++++++++-------- 1 file changed, 23 insertions(+), 17 deletions(-) diff --git a/packages/mermaid/src/diagrams/git/gitGraphRenderer.js b/packages/mermaid/src/diagrams/git/gitGraphRenderer.js index 4790949b5..6124d72c6 100644 --- a/packages/mermaid/src/diagrams/git/gitGraphRenderer.js +++ b/packages/mermaid/src/diagrams/git/gitGraphRenderer.js @@ -112,8 +112,11 @@ const drawCommits = (svg, commits, modifyGraph) => { }); const isParallelCommits = gitGraphConfig.parallelCommits; + const layoutOffset = 10; + const commitStep = 40; sortedKeys.forEach((key) => { const commit = commits[key]; + const posWithOffset = pos + layoutOffset; if (isParallelCommits) { if (!commit.parents.length) { @@ -123,12 +126,15 @@ const drawCommits = (svg, commits, modifyGraph) => { } } else { const closestParent = findClosestParent(commit.parents); - pos = dir === 'TB' ? commitPos[closestParent].y + 40 : commitPos[closestParent].x + 40; + pos = + dir === 'TB' + ? commitPos[closestParent].y + commitStep + : commitPos[closestParent].x + commitStep; } } - const y = dir === 'TB' ? pos + 10 : branchPos[commit.branch].pos; - const x = dir === 'TB' ? branchPos[commit.branch].pos : pos + 10; + const y = dir === 'TB' ? posWithOffset : branchPos[commit.branch].pos; + const x = dir === 'TB' ? branchPos[commit.branch].pos : posWithOffset; // Don't draw the commits now but calculate the positioning which is used by the branch lines etc. if (modifyGraph) { @@ -253,9 +259,9 @@ const drawCommits = (svg, commits, modifyGraph) => { } } if (dir === 'TB') { - commitPos[commit.id] = { x: x, y: pos + 10 }; + commitPos[commit.id] = { x: x, y: posWithOffset }; } else { - commitPos[commit.id] = { x: pos + 10, y: y }; + commitPos[commit.id] = { x: posWithOffset, y: y }; } // The first iteration over the commits are for positioning purposes, this @@ -284,7 +290,7 @@ const drawCommits = (svg, commits, modifyGraph) => { // Now we have the label, lets position the background labelBkg - .attr('x', pos + 10 - bbox.width / 2 - py) + .attr('x', posWithOffset - bbox.width / 2 - py) .attr('y', y + 13.5) .attr('width', bbox.width + 2 * py) .attr('height', bbox.height + 2 * py); @@ -295,7 +301,7 @@ const drawCommits = (svg, commits, modifyGraph) => { } if (dir !== 'TB') { - text.attr('x', pos + 10 - bbox.width / 2); + text.attr('x', posWithOffset - bbox.width / 2); } if (gitGraphConfig.rotateCommitLabel) { if (dir === 'TB') { @@ -321,7 +327,7 @@ const drawCommits = (svg, commits, modifyGraph) => { .attr('class', 'tag-label') .text(commit.tag); let tagBbox = tag.node().getBBox(); - tag.attr('x', pos + 10 - tagBbox.width / 2); + tag.attr('x', posWithOffset - tagBbox.width / 2); const h2 = tagBbox.height / 2; const ly = y - 19.2; @@ -330,10 +336,10 @@ const drawCommits = (svg, commits, modifyGraph) => { ` ${pos - tagBbox.width / 2 - px / 2},${ly + py} ${pos - tagBbox.width / 2 - px / 2},${ly - py} - ${pos + 10 - tagBbox.width / 2 - px},${ly - h2 - py} - ${pos + 10 + tagBbox.width / 2 + px},${ly - h2 - py} - ${pos + 10 + tagBbox.width / 2 + px},${ly + h2 + py} - ${pos + 10 - tagBbox.width / 2 - px},${ly + h2 + py}` + ${posWithOffset - tagBbox.width / 2 - px},${ly - h2 - py} + ${posWithOffset + tagBbox.width / 2 + px},${ly - h2 - py} + ${posWithOffset + tagBbox.width / 2 + px},${ly + h2 + py} + ${posWithOffset - tagBbox.width / 2 - px},${ly + h2 + py}` ); hole @@ -350,10 +356,10 @@ const drawCommits = (svg, commits, modifyGraph) => { ` ${x},${pos + py} ${x},${pos - py} - ${x + 10},${pos - h2 - py} - ${x + 10 + tagBbox.width + px},${pos - h2 - py} - ${x + 10 + tagBbox.width + px},${pos + h2 + py} - ${x + 10},${pos + h2 + py}` + ${x + layoutOffset},${pos - h2 - py} + ${x + layoutOffset + tagBbox.width + px},${pos - h2 - py} + ${x + layoutOffset + tagBbox.width + px},${pos + h2 + py} + ${x + layoutOffset},${pos + h2 + py}` ) .attr('transform', 'translate(12,12) rotate(45, ' + x + ',' + pos + ')'); hole @@ -367,7 +373,7 @@ const drawCommits = (svg, commits, modifyGraph) => { } } } - pos += 50; + pos += commitStep + layoutOffset; if (pos > maxPos) { maxPos = pos; } From e668698b5c5510c2f1ff9a6cc875d0dbdf413de2 Mon Sep 17 00:00:00 2001 From: Matheus B Date: Mon, 22 Jan 2024 19:56:25 -0300 Subject: [PATCH 159/170] Reposition const declaration to ideal place --- packages/mermaid/src/diagrams/git/gitGraphRenderer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/git/gitGraphRenderer.js b/packages/mermaid/src/diagrams/git/gitGraphRenderer.js index 6124d72c6..cefbe89c1 100644 --- a/packages/mermaid/src/diagrams/git/gitGraphRenderer.js +++ b/packages/mermaid/src/diagrams/git/gitGraphRenderer.js @@ -116,7 +116,6 @@ const drawCommits = (svg, commits, modifyGraph) => { const commitStep = 40; sortedKeys.forEach((key) => { const commit = commits[key]; - const posWithOffset = pos + layoutOffset; if (isParallelCommits) { if (!commit.parents.length) { @@ -133,6 +132,7 @@ const drawCommits = (svg, commits, modifyGraph) => { } } + const posWithOffset = pos + layoutOffset; const y = dir === 'TB' ? posWithOffset : branchPos[commit.branch].pos; const x = dir === 'TB' ? branchPos[commit.branch].pos : posWithOffset; From 81825f22f508eee53a9ab809361935d52bc3caf0 Mon Sep 17 00:00:00 2001 From: Matheus B Date: Mon, 22 Jan 2024 20:09:20 -0300 Subject: [PATCH 160/170] Swap condition blocks to avoid using negation --- .../mermaid/src/diagrams/git/gitGraphRenderer.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/mermaid/src/diagrams/git/gitGraphRenderer.js b/packages/mermaid/src/diagrams/git/gitGraphRenderer.js index cefbe89c1..84b8f41a1 100644 --- a/packages/mermaid/src/diagrams/git/gitGraphRenderer.js +++ b/packages/mermaid/src/diagrams/git/gitGraphRenderer.js @@ -118,17 +118,17 @@ const drawCommits = (svg, commits, modifyGraph) => { const commit = commits[key]; if (isParallelCommits) { - if (!commit.parents.length) { - pos = 0; - if (dir === 'TB') { - pos = 30; - } - } else { + if (commit.parents.length) { const closestParent = findClosestParent(commit.parents); pos = dir === 'TB' ? commitPos[closestParent].y + commitStep : commitPos[closestParent].x + commitStep; + } else { + pos = 0; + if (dir === 'TB') { + pos = 30; + } } } From 8fad1f55e25cf4e8ce1d893a268a6ea2fcf0b778 Mon Sep 17 00:00:00 2001 From: Oleg A Date: Tue, 23 Jan 2024 10:56:44 +0300 Subject: [PATCH 161/170] docs: move community to Discord --- .github/ISSUE_TEMPLATE/config.yml | 6 +++--- .github/lychee.toml | 4 ++-- README.md | 4 ++-- README.zh-CN.md | 4 ++-- docs/community/security.md | 2 +- docs/ecosystem/integrations-create.md | 4 ++-- docs/intro/index.md | 2 +- .../mermaid/src/docs/.vitepress/components/HomePage.vue | 2 +- packages/mermaid/src/docs/.vitepress/config.ts | 4 ++-- packages/mermaid/src/docs/community/security.md | 2 +- packages/mermaid/src/docs/ecosystem/integrations-create.md | 4 ++-- packages/mermaid/src/docs/intro/index.md | 2 +- 12 files changed, 20 insertions(+), 20 deletions(-) diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml index 7e0c78ff1..fa15f39e1 100644 --- a/.github/ISSUE_TEMPLATE/config.yml +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -3,9 +3,9 @@ contact_links: - name: GitHub Discussions url: https://github.com/mermaid-js/mermaid/discussions about: Ask the Community questions or share your own graphs in our discussions. - - name: Slack - url: https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE - about: Join our Community on Slack for Help and a casual chat. + - name: Discord + url: https://discord.gg/wwtabKgp8y + about: Join our Community on Discord for Help and a casual chat. - name: Documentation url: https://mermaid.js.org about: Read our documentation for all that Mermaid.js can offer. diff --git a/.github/lychee.toml b/.github/lychee.toml index b13e53616..4af304a99 100644 --- a/.github/lychee.toml +++ b/.github/lychee.toml @@ -34,8 +34,8 @@ exclude = [ # Don't check files that are generated during the build via `pnpm docs:code` 'packages/mermaid/src/docs/config/setup/*', -# Ignore slack invite -"https://join.slack.com/" +# Ignore Discord invite +"https://discord.gg" ] # Exclude all private IPs from checking. diff --git a/README.md b/README.md index cf21fdb8e..f1661e27f 100644 --- a/README.md +++ b/README.md @@ -15,7 +15,7 @@ Generate diagrams from markdown-like text. Live Editor!

- 📖 Documentation | 🚀 Getting Started | 🌐 CDN | 🙌 Join Us + 📖 Documentation | 🚀 Getting Started | 🌐 CDN | 🙌 Join Us

简体中文 @@ -33,7 +33,7 @@ Try Live Editor previews of future releases: diff --git a/README.zh-CN.md b/README.zh-CN.md index 98975ea33..c9d558393 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -15,7 +15,7 @@ Mermaid 实时编辑器!

- 📖 文档 | 🚀 入门 | 🌐 CDN | 🙌 加入我们 + 📖 文档 | 🚀 入门 | 🌐 CDN | 🙌 加入我们

English @@ -34,7 +34,7 @@ Mermaid [![Coverage Status](https://codecov.io/github/mermaid-js/mermaid/branch/develop/graph/badge.svg)](https://app.codecov.io/github/mermaid-js/mermaid/tree/develop) [![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid) [![NPM Downloads](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid) -[![Join our Slack!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=slack&label=slack)](https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE) +[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/wwtabKgp8y) [![Twitter Follow](https://img.shields.io/badge/Social-mermaidjs__-blue?style=social&logo=X)](https://twitter.com/mermaidjs_) diff --git a/docs/community/security.md b/docs/community/security.md index 07adbfbf8..e456adcd7 100644 --- a/docs/community/security.md +++ b/docs/community/security.md @@ -16,7 +16,7 @@ We aim to reply within three working days, probably much sooner. You should expect a close collaboration as we work to resolve the issue you have reported. Please reach out to again if you do not receive prompt attention and regular updates. -You may also reach out to the team via our public Slack chat channels; however, please make sure to e-mail when reporting an issue, and avoid revealing information about vulnerabilities in public as that could that could put users at risk. +You may also reach out to the team via our public Discord chat channels; however, please make sure to e-mail when reporting an issue, and avoid revealing information about vulnerabilities in public as that could that could put users at risk. ## Best practices diff --git a/docs/ecosystem/integrations-create.md b/docs/ecosystem/integrations-create.md index 3dba1dafb..7643c8898 100644 --- a/docs/ecosystem/integrations-create.md +++ b/docs/ecosystem/integrations-create.md @@ -22,9 +22,9 @@ Currently pending [IANA](https://www.iana.org/) recognition. ## Showcase -### Mermaid Slack workspace +### Mermaid Discord workspace -We would love to see what you create with Mermaid. Please share your creations with us in our [Slack](https://join.slack.com/t/mermaid-talk/shared_invite/zt-22p2r8p9y-qiyP1H38GjFQ6S6jbBkOxQ) workspace [#community-showcase](https://mermaid-talk.slack.com/archives/C05NK37LT40) channel. +We would love to see what you create with Mermaid. Please share your creations with us in our [Discord](https://discord.gg/wwtabKgp8y) server [#showcase](https://discord.com/channels/1079455296289788015/1079502635054399649) channel. ### Add to Mermaid Ecosystem diff --git a/docs/intro/index.md b/docs/intro/index.md index 5a77fa587..d038cde53 100644 --- a/docs/intro/index.md +++ b/docs/intro/index.md @@ -22,7 +22,7 @@ It is a JavaScript based diagramming and charting tool that renders Markdown-ins [![Coverage Status](https://coveralls.io/repos/github/mermaid-js/mermaid/badge.svg?branch=master)](https://coveralls.io/github/mermaid-js/mermaid?branch=master) [![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid) [![NPM](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid) -[![Join our Slack!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=slack&label=slack)](https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE) +[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/wwtabKgp8y) [![Twitter Follow](https://img.shields.io/twitter/follow/mermaidjs_?style=social)](https://twitter.com/mermaidjs_) diff --git a/packages/mermaid/src/docs/.vitepress/components/HomePage.vue b/packages/mermaid/src/docs/.vitepress/components/HomePage.vue index b6998f249..9bc47ba0c 100644 --- a/packages/mermaid/src/docs/.vitepress/components/HomePage.vue +++ b/packages/mermaid/src/docs/.vitepress/components/HomePage.vue @@ -17,7 +17,7 @@ import { teamMembers } from '../contributors';
Join the community diff --git a/packages/mermaid/src/docs/.vitepress/config.ts b/packages/mermaid/src/docs/.vitepress/config.ts index f5647e3c3..7ce9124a8 100644 --- a/packages/mermaid/src/docs/.vitepress/config.ts +++ b/packages/mermaid/src/docs/.vitepress/config.ts @@ -52,8 +52,8 @@ export default defineConfig({ socialLinks: [ { icon: 'github', link: 'https://github.com/mermaid-js/mermaid' }, { - icon: 'slack', - link: 'https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE', + icon: 'discord', + link: 'https://discord.gg/wwtabKgp8y', }, { icon: { diff --git a/packages/mermaid/src/docs/community/security.md b/packages/mermaid/src/docs/community/security.md index e7a0db6ed..a84a106ab 100644 --- a/packages/mermaid/src/docs/community/security.md +++ b/packages/mermaid/src/docs/community/security.md @@ -10,7 +10,7 @@ We aim to reply within three working days, probably much sooner. You should expect a close collaboration as we work to resolve the issue you have reported. Please reach out to again if you do not receive prompt attention and regular updates. -You may also reach out to the team via our public Slack chat channels; however, please make sure to e-mail when reporting an issue, and avoid revealing information about vulnerabilities in public as that could that could put users at risk. +You may also reach out to the team via our public Discord chat channels; however, please make sure to e-mail when reporting an issue, and avoid revealing information about vulnerabilities in public as that could that could put users at risk. ## Best practices diff --git a/packages/mermaid/src/docs/ecosystem/integrations-create.md b/packages/mermaid/src/docs/ecosystem/integrations-create.md index 421240729..c47ba30da 100644 --- a/packages/mermaid/src/docs/ecosystem/integrations-create.md +++ b/packages/mermaid/src/docs/ecosystem/integrations-create.md @@ -20,9 +20,9 @@ Currently pending [IANA](https://www.iana.org/) recognition. ## Showcase -### Mermaid Slack workspace +### Mermaid Discord workspace -We would love to see what you create with Mermaid. Please share your creations with us in our [Slack](https://join.slack.com/t/mermaid-talk/shared_invite/zt-22p2r8p9y-qiyP1H38GjFQ6S6jbBkOxQ) workspace [#community-showcase](https://mermaid-talk.slack.com/archives/C05NK37LT40) channel. +We would love to see what you create with Mermaid. Please share your creations with us in our [Discord](https://discord.gg/wwtabKgp8y) server [#showcase](https://discord.com/channels/1079455296289788015/1079502635054399649) channel. ### Add to Mermaid Ecosystem diff --git a/packages/mermaid/src/docs/intro/index.md b/packages/mermaid/src/docs/intro/index.md index 535ee3a3d..bf5866755 100644 --- a/packages/mermaid/src/docs/intro/index.md +++ b/packages/mermaid/src/docs/intro/index.md @@ -16,7 +16,7 @@ It is a JavaScript based diagramming and charting tool that renders Markdown-ins [![Coverage Status](https://coveralls.io/repos/github/mermaid-js/mermaid/badge.svg?branch=master)](https://coveralls.io/github/mermaid-js/mermaid?branch=master) [![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid) [![NPM](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid) -[![Join our Slack!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=slack&label=slack)](https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE) +[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/wwtabKgp8y) [![Twitter Follow](https://img.shields.io/twitter/follow/mermaidjs_?style=social)](https://twitter.com/mermaidjs_) From 427bcaa3f6d517d476cc1a22e3de950a25e3d1a2 Mon Sep 17 00:00:00 2001 From: Oleg A Date: Tue, 23 Jan 2024 12:20:56 +0300 Subject: [PATCH 162/170] docs: fix lint --- .../mermaid/src/docs/.vitepress/components/HomePage.vue | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/packages/mermaid/src/docs/.vitepress/components/HomePage.vue b/packages/mermaid/src/docs/.vitepress/components/HomePage.vue index 9bc47ba0c..c493ee30a 100644 --- a/packages/mermaid/src/docs/.vitepress/components/HomePage.vue +++ b/packages/mermaid/src/docs/.vitepress/components/HomePage.vue @@ -16,11 +16,7 @@ import { teamMembers } from '../contributors';


- Join the community + Join the community and get involved!

From 493f238319ffcebc10570a390d2bbacc121eb715 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Tue, 23 Jan 2024 20:28:11 +0530 Subject: [PATCH 163/170] Fix applitools --- applitools.config.js | 19 ------------------- cypress.config.cjs | 32 -------------------------------- cypress.config.ts | 30 ++++++++++++++++++++++++++++++ 3 files changed, 30 insertions(+), 51 deletions(-) delete mode 100644 applitools.config.js delete mode 100644 cypress.config.cjs create mode 100644 cypress.config.ts diff --git a/applitools.config.js b/applitools.config.js deleted file mode 100644 index 4cf02220a..000000000 --- a/applitools.config.js +++ /dev/null @@ -1,19 +0,0 @@ -// eslint-disable-next-line @typescript-eslint/no-var-requires -const { defineConfig } = require('cypress'); - -module.exports = defineConfig({ - testConcurrency: 1, - browser: [ - // Add browsers with different viewports - // { width: 800, height: 600, name: 'chrome' }, - // { width: 700, height: 500, name: 'firefox' }, - // { width: 1600, height: 1200, name: 'ie11' }, - // { width: 1024, height: 768, name: 'edgechromium' }, - // { width: 800, height: 600, name: 'safari' }, - // // Add mobile emulation devices in Portrait mode - // { deviceName: 'iPhone X', screenOrientation: 'portrait' }, - // { deviceName: 'Pixel 2', screenOrientation: 'portrait' }, - ], - // set batch name to the configuration - // batchName: `Mermaid ${process.env.APPLI_BRANCH ?? "'no APPLI_BRANCH set'"}`, -}); diff --git a/cypress.config.cjs b/cypress.config.cjs deleted file mode 100644 index 33633920a..000000000 --- a/cypress.config.cjs +++ /dev/null @@ -1,32 +0,0 @@ -/* eslint-disable @typescript-eslint/no-var-requires */ - -const { defineConfig } = require('cypress'); -const { addMatchImageSnapshotPlugin } = require('cypress-image-snapshot/plugin'); -const coverage = require('@cypress/code-coverage/task'); - -module.exports = defineConfig({ - projectId: 'n2sma2', - viewportWidth: 1440, - viewportHeight: 1024, - e2e: { - specPattern: 'cypress/integration/**/*.{js,ts}', - setupNodeEvents(on, config) { - coverage(on, config); - on('before:browser:launch', (browser = {}, launchOptions) => { - if (browser.name === 'chrome' && browser.isHeadless) { - launchOptions.args.push('--window-size=1440,1024', '--force-device-scale-factor=1'); - } - return launchOptions; - }); - addMatchImageSnapshotPlugin(on, config); - // copy any needed variables from process.env to config.env - config.env.useAppli = process.env.USE_APPLI ? true : false; - - // do not forget to return the changed config object! - return config; - }, - }, - video: false, -}); - -require('@applitools/eyes-cypress')(module); diff --git a/cypress.config.ts b/cypress.config.ts new file mode 100644 index 000000000..4182d92a8 --- /dev/null +++ b/cypress.config.ts @@ -0,0 +1,30 @@ +import { defineConfig } from 'cypress'; +import { addMatchImageSnapshotPlugin } from 'cypress-image-snapshot/plugin'; +import coverage from '@cypress/code-coverage/task'; +import eyesPlugin from '@applitools/eyes-cypress'; +export default eyesPlugin( + defineConfig({ + projectId: 'n2sma2', + viewportWidth: 1440, + viewportHeight: 1024, + e2e: { + specPattern: 'cypress/integration/**/*.{js,ts}', + setupNodeEvents(on, config) { + coverage(on, config); + on('before:browser:launch', (browser, launchOptions) => { + if (browser.name === 'chrome' && browser.isHeadless) { + launchOptions.args.push('--window-size=1440,1024', '--force-device-scale-factor=1'); + } + return launchOptions; + }); + addMatchImageSnapshotPlugin(on, config); + // copy any needed variables from process.env to config.env + config.env.useAppli = process.env.USE_APPLI ? true : false; + + // do not forget to return the changed config object! + return config; + }, + }, + video: false, + }) +); From 5c6c8d113562ea99e3d8445310a42fc3134610c7 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Tue, 23 Jan 2024 20:36:29 +0530 Subject: [PATCH 164/170] Update cypress --- package.json | 6 +- pnpm-lock.yaml | 501 +++++++++++++++++-------------------------------- 2 files changed, 170 insertions(+), 337 deletions(-) diff --git a/package.json b/package.json index a60f6f67f..441484218 100644 --- a/package.json +++ b/package.json @@ -61,11 +61,11 @@ ] }, "devDependencies": { - "@applitools/eyes-cypress": "^3.33.1", + "@applitools/eyes-cypress": "^3.40.6", "@commitlint/cli": "^17.6.1", "@commitlint/config-conventional": "^17.6.1", "@cspell/eslint-plugin": "^6.31.1", - "@cypress/code-coverage": "^3.10.7", + "@cypress/code-coverage": "^3.12.18", "@rollup/plugin-typescript": "^11.1.1", "@types/cors": "^2.8.13", "@types/eslint": "^8.37.0", @@ -85,7 +85,7 @@ "ajv": "^8.12.0", "concurrently": "^8.0.1", "cors": "^2.8.5", - "cypress": "^12.10.0", + "cypress": "^12.17.4", "cypress-image-snapshot": "^4.0.1", "esbuild": "^0.19.0", "eslint": "^8.47.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2484f6312..5d950edef 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -9,8 +9,8 @@ importers: .: devDependencies: '@applitools/eyes-cypress': - specifier: ^3.33.1 - version: 3.36.2(typescript@5.1.6) + specifier: ^3.40.6 + version: 3.40.6(typescript@5.1.6) '@commitlint/cli': specifier: ^17.6.1 version: 17.7.1 @@ -21,8 +21,8 @@ importers: specifier: ^6.31.1 version: 6.31.3 '@cypress/code-coverage': - specifier: ^3.10.7 - version: 3.11.0(@babel/core@7.23.5)(@babel/preset-env@7.22.10)(babel-loader@9.1.3)(cypress@12.17.3)(webpack@5.88.2) + specifier: ^3.12.18 + version: 3.12.18(@babel/core@7.23.5)(@babel/preset-env@7.22.10)(babel-loader@9.1.3)(cypress@12.17.4)(webpack@5.88.2) '@rollup/plugin-typescript': specifier: ^11.1.1 version: 11.1.2(typescript@5.1.6) @@ -81,11 +81,11 @@ importers: specifier: ^2.8.5 version: 2.8.5 cypress: - specifier: ^12.10.0 - version: 12.17.3 + specifier: ^12.17.4 + version: 12.17.4 cypress-image-snapshot: specifier: ^4.0.1 - version: 4.0.1(cypress@12.17.3)(jest@29.6.2) + version: 4.0.1(cypress@12.17.4)(jest@29.6.2) esbuild: specifier: ^0.19.0 version: 0.19.0 @@ -714,110 +714,105 @@ packages: leven: 3.1.0 dev: true - /@applitools/core-base@1.5.0: - resolution: {integrity: sha512-fYK8a4GH0oTmdYYGx8rYCWjl6VH6Mt4iAukhOU6l502rBYAF8mChmwyTxXu8t6oh6ejX3YQ2I+WcAf2q9XIYvg==} + /@applitools/core-base@1.9.0: + resolution: {integrity: sha512-vicerOYUzDycn0Bf41FmLvGPBwuiTHP5EW7LqQowa38DAgXZLljoLo0IS68HV22HlMHHbzoRglMK3CPAGuNaqA==} engines: {node: '>=12.13.0'} dependencies: - '@applitools/image': 1.1.2 - '@applitools/logger': 2.0.7 - '@applitools/req': 1.5.2 - '@applitools/utils': 1.5.0 + '@applitools/image': 1.1.9 + '@applitools/logger': 2.0.14 + '@applitools/req': 1.6.4 + '@applitools/utils': 1.7.0 abort-controller: 3.0.0 throat: 6.0.2 transitivePeerDependencies: - supports-color dev: true - /@applitools/core@3.9.0(typescript@5.1.6): - resolution: {integrity: sha512-fKea8ew6iyLhZskUtngcyCdlJ59Nrb+8R9fU6Y6fXT0xMBQESkU1r9Z+Dt3XUL/CzRE9NW4DWenhd52EFApxYg==} + /@applitools/core@4.6.0(typescript@5.1.6): + resolution: {integrity: sha512-YLxg4TnIEdYPTOQpeqCbjUKfJBDfjKqwieMVnLKp7Loxwvfh16C4SvsCzLSLHyqfPgsE+zRdt6uoIK0uVWM94g==} engines: {node: '>=12.13.0'} hasBin: true dependencies: - '@applitools/core-base': 1.5.0 - '@applitools/dom-capture': 11.2.2 - '@applitools/dom-snapshot': 4.7.10 - '@applitools/driver': 1.13.4 - '@applitools/ec-client': 1.7.4(typescript@5.1.6) - '@applitools/logger': 2.0.7 - '@applitools/nml-client': 1.5.7 - '@applitools/req': 1.5.2 - '@applitools/screenshoter': 3.8.7 - '@applitools/snippets': 2.4.22 - '@applitools/socket': 1.1.7 - '@applitools/spec-driver-webdriver': 1.0.41(webdriver@7.30.0) - '@applitools/ufg-client': 1.7.0 - '@applitools/utils': 1.5.0 + '@applitools/core-base': 1.9.0 + '@applitools/dom-capture': 11.2.5 + '@applitools/dom-snapshot': 4.7.16 + '@applitools/driver': 1.16.1 + '@applitools/ec-client': 1.7.22(typescript@5.1.6) + '@applitools/logger': 2.0.14 + '@applitools/nml-client': 1.6.4 + '@applitools/req': 1.6.4 + '@applitools/screenshoter': 3.8.20 + '@applitools/snippets': 2.4.24 + '@applitools/socket': 1.1.14 + '@applitools/spec-driver-webdriver': 1.0.54(webdriver@7.31.1) + '@applitools/ufg-client': 1.9.9 + '@applitools/utils': 1.7.0 '@types/ws': 8.5.5 abort-controller: 3.0.0 chalk: 4.1.2 node-fetch: 2.6.7 - webdriver: 7.30.0(typescript@5.1.6) + semver: 7.5.4 + webdriver: 7.31.1(typescript@5.1.6) ws: 8.13.0 yargs: 17.7.2 transitivePeerDependencies: - bufferutil - - canvas - encoding - supports-color - typescript - utf-8-validate dev: true - /@applitools/dom-capture@11.2.2: - resolution: {integrity: sha512-omSH+c8+ij/mUPKVwRp7ulCOz33EHMnG8Q3s7XuwaB9m04onEAg82/25otOrntqMKmO2doGWN3E97qUstZJiPQ==} - engines: {node: '>=8.9.0'} + /@applitools/dom-capture@11.2.5: + resolution: {integrity: sha512-bjVduGCBOdDyGSkXs8sH47wRpuwBt6f1FvzbATumIFp0V6xGAB1ehpO+j3Ss1SajwlDl8WQkyS6/85nTFyW3eA==} + engines: {node: '>=12.13.0'} dependencies: - '@applitools/dom-shared': 1.0.5 + '@applitools/dom-shared': 1.0.12 '@applitools/functional-commons': 1.6.0 dev: true - /@applitools/dom-shared@1.0.10: - resolution: {integrity: sha512-1k0CUQRm+38n6aTg/8IIppndYPDJLc/dU8Regbi/miP3xZmOG4Wwd5fBiu/MI5lgQm6RZU+at18lpCLFwU+Nng==} - engines: {node: '>=8.9.0'} + /@applitools/dom-shared@1.0.12: + resolution: {integrity: sha512-GFyVHOUFjaS2WhUPjaELn1yBAK9hmRqv031RRQjYkf+3aD9GfzKHj/ZUVcSsZydid+0VAtHVQFwZGH79bGhd7w==} + engines: {node: '>=12.13.0'} dev: true - /@applitools/dom-shared@1.0.5: - resolution: {integrity: sha512-O2zgnnqVi3/Atq7EQjURLa73XNaDFJCj8wHht6WQtxIv1EWYnPutNTmnJSKwK7FnbJAg65OVjZylcz4EezyYZA==} - engines: {node: '>=8.9.0'} - dev: true - - /@applitools/dom-snapshot@4.7.10: - resolution: {integrity: sha512-QhX0p6irvQE48eeauNHIfEm76L8QY8mDO8Tk4YOzzBRKcGpKphQUR/5GRCR9S3jx5wwJAwjF/aMW/W7Cwdaztw==} - engines: {node: '>=8.9.0'} + /@applitools/dom-snapshot@4.7.16: + resolution: {integrity: sha512-GXWrMOkpHlnpo0tonhxfmDFOiCaT//ZDexB9vGKLgBBF0QDFpdy9BgvasLvy8I0PuVegXsgJbZS3gS053N7SHQ==} + engines: {node: '>=12.13.0'} dependencies: - '@applitools/dom-shared': 1.0.10 + '@applitools/dom-shared': 1.0.12 '@applitools/functional-commons': 1.6.0 css-tree: 2.3.1 pako: 1.0.11 dev: true - /@applitools/driver@1.13.4: - resolution: {integrity: sha512-LdATkjMoTZKUDHmuIfV0uh0ZiRe+yNNIehTqmjV6LnQrNvm73ddzF2Tn+LM8Vg/CflwFhw+TVKPaywTmi35wUg==} + /@applitools/driver@1.16.1: + resolution: {integrity: sha512-DfSbcKopOIPl1Wfet3Uib2bDSl64Wh51772MPM7A/xrwJrLOY5NvfT71PqMIQd4eZAd6k5hRg5gbGL5zTzktLQ==} engines: {node: '>=12.13.0'} dependencies: - '@applitools/logger': 2.0.7 - '@applitools/snippets': 2.4.22 - '@applitools/utils': 1.5.0 + '@applitools/logger': 2.0.14 + '@applitools/snippets': 2.4.24 + '@applitools/utils': 1.7.0 semver: 7.5.4 transitivePeerDependencies: - supports-color dev: true - /@applitools/ec-client@1.7.4(typescript@5.1.6): - resolution: {integrity: sha512-vFY5O9WXQ905hUcw4ot1BuKAAFq6F+hyQfX/obsQsUPUvJXqHhiFjMiI/x3cyrPr40EVLQM8edZCa71m4k2WyQ==} + /@applitools/ec-client@1.7.22(typescript@5.1.6): + resolution: {integrity: sha512-zhkYIW8bUpwc+TmvQyxL12kIt2TnAwB30XHke1ApmcPxGk9P8lfjm/AzwnKHqDBJxN2V/TSUfuRvseZq5b4TRA==} engines: {node: '>=12.13.0'} hasBin: true dependencies: - '@applitools/core-base': 1.5.0 - '@applitools/driver': 1.13.4 - '@applitools/logger': 2.0.7 - '@applitools/req': 1.5.2 - '@applitools/socket': 1.1.7 - '@applitools/spec-driver-webdriver': 1.0.41(webdriver@7.30.0) - '@applitools/tunnel-client': 1.1.3 - '@applitools/utils': 1.5.0 + '@applitools/core-base': 1.9.0 + '@applitools/driver': 1.16.1 + '@applitools/logger': 2.0.14 + '@applitools/req': 1.6.4 + '@applitools/socket': 1.1.14 + '@applitools/spec-driver-webdriver': 1.0.54(webdriver@7.31.1) + '@applitools/tunnel-client': 1.4.0 + '@applitools/utils': 1.7.0 abort-controller: 3.0.0 - webdriver: 7.30.0(typescript@5.1.6) + webdriver: 7.31.1(typescript@5.1.6) yargs: 17.7.2 transitivePeerDependencies: - supports-color @@ -859,40 +854,38 @@ packages: - supports-color dev: true - /@applitools/eyes-cypress@3.36.2(typescript@5.1.6): - resolution: {integrity: sha512-GA1KP7i3Zr7sbc8yscw7fay1XbQ46LxEAH4dLqjJhOmvvpZuDlmgRyVMuvTmobDXKKHtdVpfoXtJQURrxs7fvA==} + /@applitools/eyes-cypress@3.40.6(typescript@5.1.6): + resolution: {integrity: sha512-Klqt3y2U9pl+btLKQJB6e6UtzOv4wdAKxD9V6VCjLF8DqQeBukinAG3kBgpDRQVEVCYMeQXdQZrRTRJvZOkpIg==} engines: {node: '>=12.13.0'} hasBin: true dependencies: - '@applitools/core': 3.9.0(typescript@5.1.6) - '@applitools/eyes': 1.7.2(typescript@5.1.6) + '@applitools/core': 4.6.0(typescript@5.1.6) + '@applitools/eyes': 1.13.5(typescript@5.1.6) '@applitools/functional-commons': 1.6.0 - '@applitools/logger': 2.0.7 - '@applitools/utils': 1.5.0 + '@applitools/logger': 2.0.14 + '@applitools/utils': 1.7.0 boxen: 5.1.2 chalk: 3.0.0 - semver: 7.3.8 + semver: 7.5.4 uuid: 8.3.2 ws: 8.5.0 transitivePeerDependencies: - bufferutil - - canvas - encoding - supports-color - typescript - utf-8-validate dev: true - /@applitools/eyes@1.7.2(typescript@5.1.6): - resolution: {integrity: sha512-RNwPMp19xmQ+oEEZH66wGbnBbOqsrHaLBwnCZ9qJ9294aN4DuYHJNXdzHtLFSwjHNc8UmyDRU2Enn4825hqV6w==} + /@applitools/eyes@1.13.5(typescript@5.1.6): + resolution: {integrity: sha512-FXFH5D78UMcqG0No5FgvISlfGM9DrXTCnRsEXhEw+dbQneG7siKRY6BQci3QDgrh0sI0yfVaZbZrpXIKuDF1ug==} engines: {node: '>=12.13.0'} dependencies: - '@applitools/core': 3.9.0(typescript@5.1.6) - '@applitools/logger': 2.0.7 - '@applitools/utils': 1.5.0 + '@applitools/core': 4.6.0(typescript@5.1.6) + '@applitools/logger': 2.0.14 + '@applitools/utils': 1.7.0 transitivePeerDependencies: - bufferutil - - canvas - encoding - supports-color - typescript @@ -904,11 +897,11 @@ packages: engines: {node: '>=8.0.0'} dev: true - /@applitools/image@1.1.2: - resolution: {integrity: sha512-Cy1oKCB2vIpHT47Y1tictsRS2RLBVI4XzxYWvKnXx+ZsbL364IiDzwWxYKgvA7/6t1Ako648n4+BWKoUi5Ewbg==} + /@applitools/image@1.1.9: + resolution: {integrity: sha512-R86re+yofXSBamTuzSLwFB57fzaf7aiKvyx675uw8e/XfqQy3vhGbp8Bh23lUZX9y7ngf2ldrpnQ7nQrvmtJuA==} engines: {node: '>=12.13.0'} dependencies: - '@applitools/utils': 1.5.0 + '@applitools/utils': 1.7.0 bmpimagejs: 1.0.4 jpeg-js: 0.4.4 omggif: 1.0.10 @@ -926,33 +919,33 @@ packages: - supports-color dev: true - /@applitools/logger@2.0.7: - resolution: {integrity: sha512-dmX2nWWixMYsOdhl1MANv7wr8cKzYUOaHxQp9CdokVbJy+NGwWAzK6qVeKjogn7D6eXHzgn3R3OzplYSq/fK/g==} + /@applitools/logger@2.0.14: + resolution: {integrity: sha512-oq/RPjs/3BjR3EdLohHhzzVufBYEMMhOUmZlCnvgmCJIhUsa3ceq8Ta2E99TUzSny9xkl962JoRDfLQg/vS+Ww==} engines: {node: '>=12.13.0'} dependencies: - '@applitools/utils': 1.5.0 + '@applitools/utils': 1.7.0 chalk: 4.1.2 debug: 4.3.4(supports-color@8.1.1) transitivePeerDependencies: - supports-color dev: true - /@applitools/nml-client@1.5.7: - resolution: {integrity: sha512-jAG2/4JSqX7FSrdyIyjdXcPy2l2/t8KRlw554nL1ABgtqTV8yCI3DxVUk7RCNi39f1uY5pA2pfiZVGFImnSFKg==} + /@applitools/nml-client@1.6.4: + resolution: {integrity: sha512-mbLnwpXbM2MkB+bP9+Hluywi4OAFWDr+FvjHkk/9TcvcM9EYbmD8deGuTC5kFt5WDDS568WQDRj+G2tT1JfLEA==} engines: {node: '>=12.13.0'} dependencies: - '@applitools/logger': 2.0.7 - '@applitools/req': 1.5.2 - '@applitools/utils': 1.5.0 + '@applitools/logger': 2.0.14 + '@applitools/req': 1.6.4 + '@applitools/utils': 1.7.0 transitivePeerDependencies: - supports-color dev: true - /@applitools/req@1.5.2: - resolution: {integrity: sha512-evuikeiCYudhxSQ2kisO7DdywPqshaaN+BiDu4P3eTz5R9VmqhXwWP9bS88G8bzzz0FeNQMY9a7TjQ7d5jMRrA==} - engines: {node: '>=12.13.0'} + /@applitools/req@1.6.4: + resolution: {integrity: sha512-yKTga1QHzIk7ECHgC8JEgYxV91PdIHWRa02ZpsK2FAk6GjTefPK6WZsj1vGKeVi/dGxHuZT8sjvtJHc275osug==} + engines: {node: '>=16.13.0'} dependencies: - '@applitools/utils': 1.5.0 + '@applitools/utils': 1.7.0 abort-controller: 3.0.0 http-proxy-agent: 5.0.0 https-proxy-agent: 5.0.1 @@ -961,81 +954,78 @@ packages: - supports-color dev: true - /@applitools/screenshoter@3.8.7: - resolution: {integrity: sha512-G576fLyTTAJEnhFZBeD57+1JDXGTDcTlrg0n32ujtYTFswUAf5XnXmeO6s2WqeHKQl74e2xwhBmdtU/CrVOkig==} + /@applitools/screenshoter@3.8.20: + resolution: {integrity: sha512-k7t4cdJ5vpgYvsLLrenSvPNkUZ25uUs7Q54X0tGtkgQ/C+pQ8GLaIXQQwyVaEYbnF6WuAnrjTXMpdPJ2uUvpAg==} engines: {node: '>=12.13.0'} dependencies: - '@applitools/image': 1.1.2 - '@applitools/logger': 2.0.7 - '@applitools/snippets': 2.4.22 - '@applitools/utils': 1.5.0 + '@applitools/image': 1.1.9 + '@applitools/logger': 2.0.14 + '@applitools/snippets': 2.4.24 + '@applitools/utils': 1.7.0 transitivePeerDependencies: - supports-color dev: true - /@applitools/snippets@2.4.22: - resolution: {integrity: sha512-bv4GzMf6k4mAyMxo3PVR3HKEPkf4h0O6+xNo6UO78cw+MpkT4Sr7JDk3mLq8H/WRDKk7x4VKpJeoDHd5dBxT3g==} + /@applitools/snippets@2.4.24: + resolution: {integrity: sha512-T/cfYA15K+gR2Xc/cEnn2hR7XBJ9vCcH/Jcp7Hoor14j7nzldR+u69HaQe/sa4ChDU4eZyTiTggek52+MqX7FQ==} engines: {node: '>=12.13.0'} dev: true - /@applitools/socket@1.1.7: - resolution: {integrity: sha512-SpP+Zw5B9VJ3K+xW+wSYDwfrOQ1U9/95h5G3rszKaVleX2FTUW0JgmASuSlwgr7veU3qlcNzt3vas/tQM3/z/g==} + /@applitools/socket@1.1.14: + resolution: {integrity: sha512-o43hNnD/PN5T5MFR3cZ5OC+b5PpkV/PeTk8z844sNtGyziS9GEpO0vYfG2XLq/mZg0YQurrXtYupUMndV+0wDg==} engines: {node: '>=12.13.0'} dependencies: - '@applitools/logger': 2.0.7 - '@applitools/utils': 1.5.0 + '@applitools/logger': 2.0.14 + '@applitools/utils': 1.7.0 transitivePeerDependencies: - supports-color dev: true - /@applitools/spec-driver-webdriver@1.0.41(webdriver@7.30.0): - resolution: {integrity: sha512-0kUHiFmr3FiOlfTnfS1k8pvJXgnEM8bP36teiDJvmAJnk8aJG5nmqaQj1KkeLUVVZ1wfYlg/+iDtGUdP4a4Zxw==} + /@applitools/spec-driver-webdriver@1.0.54(webdriver@7.31.1): + resolution: {integrity: sha512-ZpwUBWu5kUil5E+r+NdhdB8SzWwGv56+sZSGyPlgN0w2krmIudeyBKuJKYMfqdXSu0lATSgKJSCJXmkb/q4DNQ==} engines: {node: '>=12.13.0'} peerDependencies: - webdriver: '>=7.27.0' + webdriver: '>=6.0.0' dependencies: - '@applitools/driver': 1.13.4 - '@applitools/utils': 1.5.0 + '@applitools/driver': 1.16.1 + '@applitools/utils': 1.7.0 http-proxy-agent: 5.0.0 https-proxy-agent: 5.0.1 - webdriver: 7.30.0(typescript@5.1.6) + webdriver: 7.31.1(typescript@5.1.6) transitivePeerDependencies: - supports-color dev: true - /@applitools/tunnel-client@1.1.3: - resolution: {integrity: sha512-xe0HqznqnuhsZYIY//NnjszEkIcYgdZkwVR4GOwzVCOCcxIGoi+kMpDUuC2Xcd8+UiVbfZfZTeo7rXITlzzqAw==} + /@applitools/tunnel-client@1.4.0: + resolution: {integrity: sha512-vgQoEN81Mhqjf74+9JAUvGK8t8Dzm0p8nNrqsqeHekuTva6Jh92sNK40j96z7jrMoSo+JHOeb/7mIOicU9o/0A==} engines: {node: '>=12.13.0'} hasBin: true dependencies: '@applitools/execution-grid-tunnel': 2.1.8 - '@applitools/logger': 2.0.7 - '@applitools/req': 1.5.2 - '@applitools/socket': 1.1.7 - '@applitools/utils': 1.5.0 + '@applitools/logger': 2.0.14 + '@applitools/req': 1.6.4 + '@applitools/socket': 1.1.14 + '@applitools/utils': 1.7.0 abort-controller: 3.0.0 yargs: 17.7.2 transitivePeerDependencies: - supports-color dev: true - /@applitools/ufg-client@1.7.0: - resolution: {integrity: sha512-BMFLuWGq8YVs0/z5VBl8CAKzOMXbagHFxyR4oGdg31nDsuKgKfhlnbGji5qek243ex8vEbEqFwsH2K0ZXYGIeQ==} + /@applitools/ufg-client@1.9.9: + resolution: {integrity: sha512-J/k6C1JYPr4ohcE64AvVHIeTMZ83bXnhuIryxvOWJDSyr6Yh4hvtrbCviUyYMaKj7WCMYeDEESt6auiyBMxVGw==} engines: {node: '>=12.13.0'} dependencies: - '@applitools/image': 1.1.2 - '@applitools/logger': 2.0.7 - '@applitools/req': 1.5.2 - '@applitools/utils': 1.5.0 + '@applitools/image': 1.1.9 + '@applitools/logger': 2.0.14 + '@applitools/req': 1.6.4 + '@applitools/utils': 1.7.0 + '@xmldom/xmldom': 0.8.10 abort-controller: 3.0.0 css-tree: 2.3.1 - jsdom: 19.0.0 throat: 6.0.2 transitivePeerDependencies: - - bufferutil - - canvas - supports-color - - utf-8-validate dev: true /@applitools/utils@1.3.36: @@ -1043,8 +1033,8 @@ packages: engines: {node: '>=12.13.0'} dev: true - /@applitools/utils@1.5.0: - resolution: {integrity: sha512-BZk8YolP0G+/Srjkhf+pFp4zY7bU41L63hDN9gtwrD1xZOfWXJbOCD3gFQAGRB2qsozHMkPNTt+xw7RJjIjGQg==} + /@applitools/utils@1.7.0: + resolution: {integrity: sha512-CvBxdfPZ3ss1hOD8Yr9y2SzVfqLKBA/0N3gfQd5qafMrBhI0wuCycQmiclpAQNEVNkbhqn8/t6dOeeYgapjyDw==} engines: {node: '>=12.13.0'} dev: true @@ -3104,27 +3094,31 @@ packages: dependencies: '@jridgewell/trace-mapping': 0.3.9 - /@cypress/code-coverage@3.11.0(@babel/core@7.23.5)(@babel/preset-env@7.22.10)(babel-loader@9.1.3)(cypress@12.17.3)(webpack@5.88.2): - resolution: {integrity: sha512-ihSO1s03gmLRE224oIjrbdG1ey63vw/UY+VSqQ5m/TKkAvyz6GIiniq6juk3AV/+0vQC1Eb4UWFu8ndtji4M1g==} + /@cypress/code-coverage@3.12.18(@babel/core@7.23.5)(@babel/preset-env@7.22.10)(babel-loader@9.1.3)(cypress@12.17.4)(webpack@5.88.2): + resolution: {integrity: sha512-RTOyCVr5CWaJ7cW1gOvlXSLDr0HNXZ7xSVfLSZEGsTODbaxeUV01Z1k93spnbVT7ri9UkxCEffPcsZsZi1oDng==} peerDependencies: + '@babel/core': ^7.0.1 + '@babel/preset-env': ^7.0.0 + babel-loader: ^8.3 || ^9 cypress: '*' + webpack: ^4 || ^5 dependencies: - '@cypress/webpack-preprocessor': 5.17.1(@babel/core@7.23.5)(@babel/preset-env@7.22.10)(babel-loader@9.1.3)(webpack@5.88.2) + '@babel/core': 7.23.5 + '@babel/preset-env': 7.22.10(@babel/core@7.23.5) + '@cypress/webpack-preprocessor': 6.0.1(@babel/core@7.23.5)(@babel/preset-env@7.22.10)(babel-loader@9.1.3)(webpack@5.88.2) + babel-loader: 9.1.3(@babel/core@7.23.5)(webpack@5.88.2) chalk: 4.1.2 - cypress: 12.17.3 - dayjs: 1.11.9 + cypress: 12.17.4 + dayjs: 1.11.10 debug: 4.3.4(supports-color@8.1.1) execa: 4.1.0 - globby: 11.0.4 - istanbul-lib-coverage: 3.0.0 + globby: 11.1.0 + istanbul-lib-coverage: 3.2.0 js-yaml: 4.1.0 nyc: 15.1.0 + webpack: 5.88.2(esbuild@0.19.0)(webpack-cli@4.10.0) transitivePeerDependencies: - - '@babel/core' - - '@babel/preset-env' - - babel-loader - supports-color - - webpack dev: true /@cypress/request@2.88.12: @@ -3151,12 +3145,12 @@ packages: uuid: 8.3.2 dev: true - /@cypress/webpack-preprocessor@5.17.1(@babel/core@7.23.5)(@babel/preset-env@7.22.10)(babel-loader@9.1.3)(webpack@5.88.2): - resolution: {integrity: sha512-FE/e8ikPc8z4EVopJCaior3RGy0jd2q9Xcp5NtiwNG4XnLfEnUFTZlAGwXe75sEh4fNMPrBJW1KIz77PX5vGAw==} + /@cypress/webpack-preprocessor@6.0.1(@babel/core@7.23.5)(@babel/preset-env@7.22.10)(babel-loader@9.1.3)(webpack@5.88.2): + resolution: {integrity: sha512-WVNeFVSnFKxE3WZNRIriduTgqJRpevaiJIPlfqYTTzfXRD7X1Pv4woDE+G4caPV9bJqVKmVFiwzrXMRNeJxpxA==} peerDependencies: '@babel/core': ^7.0.1 '@babel/preset-env': ^7.0.0 - babel-loader: ^8.0.2 || ^9 + babel-loader: ^8.3 || ^9 webpack: ^4 || ^5 dependencies: '@babel/core': 7.23.5 @@ -4931,6 +4925,13 @@ packages: '@types/node': 18.17.5 dev: true + /@types/glob@8.1.0: + resolution: {integrity: sha512-IO+MJPVhoqz+28h1qLAcBEH2+xHMK6MTyHJc7MTnnYb6wsoLR29POVGJ7LycmVXIqyy/4/2ShP5sUwTXuOwb/w==} + dependencies: + '@types/minimatch': 5.1.2 + '@types/node': 18.17.5 + dev: true + /@types/graceful-fs@4.1.6: resolution: {integrity: sha512-Sig0SNORX9fdW+bQuTEovKj3uHcUL6LQKbCrrqb1X7J6/ReAbhCXRAhc+SMejhLELFj2QcyuxmUooZ4bt5ReSw==} dependencies: @@ -6146,13 +6147,14 @@ packages: - vue dev: true - /@wdio/config@7.30.0(typescript@5.1.6): - resolution: {integrity: sha512-/38rol9WCfFTMtXyd/C856/aexxIZnfVvXg7Fw2WXpqZ9qadLA+R4N35S2703n/RByjK/5XAYtHoljtvh3727w==} + /@wdio/config@7.31.1(typescript@5.1.6): + resolution: {integrity: sha512-WAfswbCatwiaDVqy6kfF/5T8/WS/US/SRhBGUFrfBuGMIe+RRoHgy7jURFWSvUIE7CNHj8yvs46fLUcxhXjzcQ==} engines: {node: '>=12.0.0'} dependencies: + '@types/glob': 8.1.0 '@wdio/logger': 7.26.0 - '@wdio/types': 7.26.0(typescript@5.1.6) - '@wdio/utils': 7.26.0(typescript@5.1.6) + '@wdio/types': 7.30.2(typescript@5.1.6) + '@wdio/utils': 7.30.2(typescript@5.1.6) deepmerge: 4.3.1 glob: 8.1.0 transitivePeerDependencies: @@ -6174,8 +6176,8 @@ packages: engines: {node: '>=12.0.0'} dev: true - /@wdio/types@7.26.0(typescript@5.1.6): - resolution: {integrity: sha512-mOTfWAGQ+iT58iaZhJMwlUkdEn3XEWE4jthysMLXFnSuZ2eaODVAiK31SmlS/eUqgSIaupeGqYUrtCuSNbLefg==} + /@wdio/types@7.30.2(typescript@5.1.6): + resolution: {integrity: sha512-uZ8o7FX8RyBsaXiOWa59UKTCHTtADNvOArYTcHNEIzt+rh4JdB/uwqfc8y4TCNA2kYm7PWaQpUFwpStLeg0H1Q==} engines: {node: '>=12.0.0'} peerDependencies: typescript: ^4.6.2 @@ -6188,12 +6190,12 @@ packages: typescript: 5.1.6 dev: true - /@wdio/utils@7.26.0(typescript@5.1.6): - resolution: {integrity: sha512-pVq2MPXZAYLkKGKIIHktHejnHqg4TYKoNYSi2EDv+I3GlT8VZKXHazKhci82ov0tD+GdF27+s4DWNDCfGYfBdQ==} + /@wdio/utils@7.30.2(typescript@5.1.6): + resolution: {integrity: sha512-np7I+smszFUennbQKdzbMN/zUL3s3EZq9pCCUcTRjjs9TE4tnn0wfmGdoz2o7REYu6kn9NfFFJyVIM2VtBbKEA==} engines: {node: '>=12.0.0'} dependencies: '@wdio/logger': 7.26.0 - '@wdio/types': 7.26.0(typescript@5.1.6) + '@wdio/types': 7.30.2(typescript@5.1.6) p-iteration: 1.1.8 transitivePeerDependencies: - typescript @@ -6414,13 +6416,6 @@ packages: negotiator: 0.6.3 dev: true - /acorn-globals@6.0.0: - resolution: {integrity: sha512-ZQl7LOWaF5ePqqcX4hLuv/bLXYQNfNWw2c0/yX/TsPRKamzHcTGQnlCjHT3TsmkOUVEPS3crCxiPfdzE/Trlhg==} - dependencies: - acorn: 7.4.1 - acorn-walk: 7.2.0 - dev: true - /acorn-import-assertions@1.9.0(acorn@8.10.0): resolution: {integrity: sha512-cmMwop9x+8KFhxvKrKfPYmN6/pKTYYHBqLa0DfvVZcKMJWNyWLnaqND7dx/qn66R7ewM1UX5XMaDVP5wlVTaVA==} peerDependencies: @@ -6437,21 +6432,10 @@ packages: acorn: 8.10.0 dev: true - /acorn-walk@7.2.0: - resolution: {integrity: sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==} - engines: {node: '>=0.4.0'} - dev: true - /acorn-walk@8.2.0: resolution: {integrity: sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==} engines: {node: '>=0.4.0'} - /acorn@7.4.1: - resolution: {integrity: sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==} - engines: {node: '>=0.4.0'} - hasBin: true - dev: true - /acorn@8.10.0: resolution: {integrity: sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==} engines: {node: '>=0.4.0'} @@ -7070,10 +7054,6 @@ packages: dependencies: fill-range: 7.0.1 - /browser-process-hrtime@1.0.0: - resolution: {integrity: sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow==} - dev: true - /browserslist@4.21.10: resolution: {integrity: sha512-bipEBdZfVH5/pwrvqc+Ub0kUPVfGUhlKxbvfD+z1BDnPEO/X98ruXGA1WP5ASpAFKan7Qr6j736IacbZQuAlKQ==} engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7} @@ -8059,21 +8039,6 @@ packages: hasBin: true dev: false - /cssom@0.3.8: - resolution: {integrity: sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==} - dev: true - - /cssom@0.5.0: - resolution: {integrity: sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==} - dev: true - - /cssstyle@2.3.0: - resolution: {integrity: sha512-AZL67abkUzIuvcHqk7c09cezpGNcxUxU4Ioi/05xHk4DQeTkWmGYftIE6ctU6AEt+Gn4n1lDStOtj7FKycP71A==} - engines: {node: '>=8'} - dependencies: - cssom: 0.3.8 - dev: true - /cssstyle@3.0.0: resolution: {integrity: sha512-N4u2ABATi3Qplzf0hWbVCdjenim8F3ojEXpBDF5hBpjzW182MjNGLqfmQ0SkSPeQ+V86ZXgeH8aXj6kayd4jgg==} engines: {node: '>=14'} @@ -8102,14 +8067,14 @@ packages: resolution: {integrity: sha512-d4ZVpCW31eWwCMe1YT3ur7mUDnTXbgwyzaL320DrcRT45rfjYxkt5QWLrmOJ+/UEAI2+fQgKe/fCjR8l4TpRgw==} dev: true - /cypress-image-snapshot@4.0.1(cypress@12.17.3)(jest@29.6.2): + /cypress-image-snapshot@4.0.1(cypress@12.17.4)(jest@29.6.2): resolution: {integrity: sha512-PBpnhX/XItlx3/DAk5ozsXQHUi72exybBNH5Mpqj1DVmjq+S5Jd9WE5CRa4q5q0zuMZb2V2VpXHth6MjFpgj9Q==} engines: {node: '>=8'} peerDependencies: cypress: ^4.5.0 dependencies: chalk: 2.4.2 - cypress: 12.17.3 + cypress: 12.17.4 fs-extra: 7.0.1 glob: 7.2.3 jest-image-snapshot: 4.2.0(jest@29.6.2) @@ -8119,8 +8084,8 @@ packages: - jest dev: true - /cypress@12.17.3: - resolution: {integrity: sha512-/R4+xdIDjUSLYkiQfwJd630S81KIgicmQOLXotFxVXkl+eTeVO+3bHXxdi5KBh/OgC33HWN33kHX+0tQR/ZWpg==} + /cypress@12.17.4: + resolution: {integrity: sha512-gAN8Pmns9MA5eCDFSDJXWKUpaL3IDd89N9TtIupjYnzLSmlpVr+ZR+vb4U/qaMp+lB6tBvAmt7504c3Z4RU5KQ==} engines: {node: ^14.0.0 || ^16.0.0 || >=18.0.0} hasBin: true requiresBuild: true @@ -8160,6 +8125,7 @@ packages: minimist: 1.2.8 ospath: 1.2.2 pretty-bytes: 5.6.0 + process: 0.11.10 proxy-from-env: 1.0.0 request-progress: 3.0.0 semver: 7.5.4 @@ -8576,15 +8542,6 @@ packages: engines: {node: '>= 12'} dev: true - /data-urls@3.0.2: - resolution: {integrity: sha512-Jy/tj3ldjZJo63sVAvg6LHt2mHvl4V6AgRAmNDtLdm7faqtsx+aJG42rsyCo9JCoRVKwPFzKlIPx3DIibwSIaQ==} - engines: {node: '>=12'} - dependencies: - abab: 2.0.6 - whatwg-mimetype: 3.0.0 - whatwg-url: 11.0.0 - dev: true - /data-urls@4.0.0: resolution: {integrity: sha512-/mMTei/JXPqvFqQtfyTowxmJVwr2PVAeCcDxyFf6LhoOu/09TX2OX3kb2wzi4DMXcfj4OItwDOnhl5oziPnT6g==} engines: {node: '>=14'} @@ -8601,6 +8558,10 @@ packages: '@babel/runtime': 7.22.10 dev: true + /dayjs@1.11.10: + resolution: {integrity: sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ==} + dev: true + /dayjs@1.11.7: resolution: {integrity: sha512-+Yw9U6YO5TQohxLcIkrXBeY73WP3ejHWVvx8XCk3gxvQDCTEmS48ZrSZCKciI7Bhl/uCMyxYtE9UqRILmFphkQ==} dev: false @@ -9265,18 +9226,6 @@ packages: source-map: 0.1.43 dev: true - /escodegen@2.1.0: - resolution: {integrity: sha512-2NlIDTwUWJN0mRPQOdtQBzbUHvdGY2P1VXSyU83Q3xKxM7WHX2Ql8dKq782Q9TgQUNOLEzEYu9bzLNj1q88I5w==} - engines: {node: '>=6.0'} - hasBin: true - dependencies: - esprima: 4.0.1 - estraverse: 5.3.0 - esutils: 2.0.3 - optionalDependencies: - source-map: 0.6.1 - dev: true - /eslint-config-prettier@8.10.0(eslint@8.47.0): resolution: {integrity: sha512-SM8AMJdeQqRYT9O9zguiruQZaN7+z+E4eAP9oiLNGKMtomwaB1E9dcgUD6ZAn/eQAb52USbvezbiljfZUhbJcg==} hasBin: true @@ -10416,18 +10365,6 @@ packages: define-properties: 1.2.0 dev: true - /globby@11.0.4: - resolution: {integrity: sha512-9O4MVG9ioZJ08ffbcyVYyLOJLk5JQ688pJ4eMGLpdWLHq/Wr1D9BlriLQyL0E+jbkuePVZXYFj47QM/v093wHg==} - engines: {node: '>=10'} - dependencies: - array-union: 2.1.0 - dir-glob: 3.0.1 - fast-glob: 3.3.2 - ignore: 5.2.4 - merge2: 1.4.1 - slash: 3.0.0 - dev: true - /globby@11.1.0: resolution: {integrity: sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==} engines: {node: '>=10'} @@ -11229,11 +11166,6 @@ packages: resolution: {integrity: sha512-Yljz7ffyPbrLpLngrMtZ7NduUgVvi6wG9RJ9IUcyCd59YQ911PBJphODUcbOVbqYfxe1wuYf/LJ8PauMRwsM/g==} dev: true - /istanbul-lib-coverage@3.0.0: - resolution: {integrity: sha512-UiUIqxMgRDET6eR+o5HbfRYP1l0hqkWOs7vNxC/mggutCMUIhWMm8gAHb8tHlyfD3/l6rlgNA5cKdDzEAf6hEg==} - engines: {node: '>=8'} - dev: true - /istanbul-lib-coverage@3.2.0: resolution: {integrity: sha512-eOeJ5BHCmHYvQK7xt9GkdHuzuCGS1Y6g9Gvnx3Ym33fz/HpLRYxiS0wHNr+m/MBC8B647Xt608vCDEvhl9c6Mw==} engines: {node: '>=8'} @@ -11869,48 +11801,6 @@ packages: engines: {node: '>=12.0.0'} dev: true - /jsdom@19.0.0: - resolution: {integrity: sha512-RYAyjCbxy/vri/CfnjUWJQQtZ3LKlLnDqj+9XLNnJPgEGeirZs3hllKR20re8LUZ6o1b1X4Jat+Qd26zmP41+A==} - engines: {node: '>=12'} - peerDependencies: - canvas: ^2.5.0 - peerDependenciesMeta: - canvas: - optional: true - dependencies: - abab: 2.0.6 - acorn: 8.10.0 - acorn-globals: 6.0.0 - cssom: 0.5.0 - cssstyle: 2.3.0 - data-urls: 3.0.2 - decimal.js: 10.4.3 - domexception: 4.0.0 - escodegen: 2.1.0 - form-data: 4.0.0 - html-encoding-sniffer: 3.0.0 - http-proxy-agent: 5.0.0 - https-proxy-agent: 5.0.1 - is-potential-custom-element-name: 1.0.1 - nwsapi: 2.2.7 - parse5: 6.0.1 - saxes: 5.0.1 - symbol-tree: 3.2.4 - tough-cookie: 4.1.3 - w3c-hr-time: 1.0.2 - w3c-xmlserializer: 3.0.0 - webidl-conversions: 7.0.0 - whatwg-encoding: 2.0.0 - whatwg-mimetype: 3.0.0 - whatwg-url: 10.0.0 - ws: 8.13.0 - xml-name-validator: 4.0.0 - transitivePeerDependencies: - - bufferutil - - supports-color - - utf-8-validate - dev: true - /jsdom@22.0.0: resolution: {integrity: sha512-p5ZTEb5h+O+iU02t0GfEjAnkdYPrQSkfuTSMkMYyIoMvUNEHsbG0bHHbfXIcfTqD2UfvjQX7mmgiFsyRwGscVw==} engines: {node: '>=16'} @@ -13615,10 +13505,6 @@ packages: lines-and-columns: 1.2.4 dev: true - /parse5@6.0.1: - resolution: {integrity: sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==} - dev: true - /parse5@7.1.2: resolution: {integrity: sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==} dependencies: @@ -14026,7 +13912,6 @@ packages: /process@0.11.10: resolution: {integrity: sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==} engines: {node: '>= 0.6.0'} - dev: false /prompts@2.4.2: resolution: {integrity: sha512-NxNv/kLguCA7p3jE8oL2aEBsrJWgAakBpgmgK6lpPWV+WuOmY6r2/zbAVnP+T8bQlA0nzHXSJSJW0Hq7ylaD2Q==} @@ -14665,13 +14550,6 @@ packages: /safer-buffer@2.1.2: resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==} - /saxes@5.0.1: - resolution: {integrity: sha512-5LBh1Tls8c9xgGjw3QrMwETmTMVk0oFgvrFSvWx62llR2hcEInrKNZ2GZCCuuy2lvWrdl5jhbpeqc5hRYKFOcw==} - engines: {node: '>=10'} - dependencies: - xmlchars: 2.2.0 - dev: true - /saxes@6.0.0: resolution: {integrity: sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==} engines: {node: '>=v12.22.7'} @@ -14732,14 +14610,6 @@ packages: hasBin: true dev: true - /semver@7.3.8: - resolution: {integrity: sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==} - engines: {node: '>=10'} - hasBin: true - dependencies: - lru-cache: 6.0.0 - dev: true - /semver@7.5.4: resolution: {integrity: sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==} engines: {node: '>=10'} @@ -15657,13 +15527,6 @@ packages: punycode: 2.3.0 dev: true - /tr46@3.0.0: - resolution: {integrity: sha512-l7FvfAHlcmulp8kr+flpQZmVwtu7nfRV7NZujtN0OqES8EL4O4e0qqzL0DC5gAvx/ZC/9lk6rhcUwYvkBnBnYA==} - engines: {node: '>=12'} - dependencies: - punycode: 2.3.0 - dev: true - /tr46@4.1.1: resolution: {integrity: sha512-2lv/66T7e5yNyhAAC4NaKe5nVavzuGJQVVtRYLyQ2OI8tsJ61PMLlelehb0wi2Hx6+hT/OJUWZcw8MjlSRnxvw==} engines: {node: '>=14'} @@ -16746,20 +16609,6 @@ packages: vue: 3.3.4 dev: false - /w3c-hr-time@1.0.2: - resolution: {integrity: sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==} - deprecated: Use your platform's native performance.now() and performance.timeOrigin. - dependencies: - browser-process-hrtime: 1.0.0 - dev: true - - /w3c-xmlserializer@3.0.0: - resolution: {integrity: sha512-3WFqGEgSXIyGhOmAFtlicJNMjEps8b1MG31NCA0/vOF9+nKMUW1ckhi9cnNHmf88Rzw5V+dwIwsm2C7X8k9aQg==} - engines: {node: '>=12'} - dependencies: - xml-name-validator: 4.0.0 - dev: true - /w3c-xmlserializer@4.0.0: resolution: {integrity: sha512-d+BFHzbiCx6zGfz0HyQ6Rg69w9k19nviJspaj4yNscGjrHu94sVP+aRm75yEbCh+r2/yR+7q6hux9LVtbuTGBw==} engines: {node: '>=14'} @@ -16810,16 +16659,16 @@ packages: resolution: {integrity: sha512-PgF341avzqyx60neE9DD+XS26MMNMoUQRz9NOZwW32nPQrF6p77f1htcnjBSEV8BGMKZ16choqUG4hyI0Hx7mA==} dev: false - /webdriver@7.30.0(typescript@5.1.6): - resolution: {integrity: sha512-bQE4oVgjjg5sb3VkCD+Eb8mscEvf3TioP0mnEZK0f5OJUNI045gMCJgpX8X4J8ScGyEhzlhn1KvlAn3yzxjxog==} + /webdriver@7.31.1(typescript@5.1.6): + resolution: {integrity: sha512-nCdJLxRnYvOMFqTEX7sqQtF/hV/Jgov0Y6ICeOm1DMTlZSRRDaUsBMlEAPkEwif9uBJYdM0znv8qzfX358AGqQ==} engines: {node: '>=12.0.0'} dependencies: '@types/node': 18.17.5 - '@wdio/config': 7.30.0(typescript@5.1.6) + '@wdio/config': 7.31.1(typescript@5.1.6) '@wdio/logger': 7.26.0 '@wdio/protocols': 7.27.0 - '@wdio/types': 7.26.0(typescript@5.1.6) - '@wdio/utils': 7.26.0(typescript@5.1.6) + '@wdio/types': 7.30.2(typescript@5.1.6) + '@wdio/utils': 7.30.2(typescript@5.1.6) got: 11.8.6 ky: 0.30.0 lodash.merge: 4.6.2 @@ -17023,22 +16872,6 @@ packages: engines: {node: '>=12'} dev: true - /whatwg-url@10.0.0: - resolution: {integrity: sha512-CLxxCmdUby142H5FZzn4D8ikO1cmypvXVQktsgosNy4a4BHrDHeciBBGZhb0bNoR5/MltoCatso+vFjjGx8t0w==} - engines: {node: '>=12'} - dependencies: - tr46: 3.0.0 - webidl-conversions: 7.0.0 - dev: true - - /whatwg-url@11.0.0: - resolution: {integrity: sha512-RKT8HExMpoYx4igMiVMY83lN6UeITKJlBQ+vR/8ZJ8OCdSiN3RwCq+9gH0+Xzj0+5IrM6i4j/6LuvzbZIQgEcQ==} - engines: {node: '>=12'} - dependencies: - tr46: 3.0.0 - webidl-conversions: 7.0.0 - dev: true - /whatwg-url@12.0.1: resolution: {integrity: sha512-Ed/LrqB8EPlGxjS+TrsXcpUond1mhccS3pchLhzSgPCnTimUCKj3IZE75pAs5m6heB2U2TMerKFUXheyHY+VDQ==} engines: {node: '>=14'} From a01be16d27ffd38e50a2c55f9dfef3f43c18e7da Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Tue, 23 Jan 2024 23:38:21 +0530 Subject: [PATCH 165/170] Echo event --- .github/workflows/e2e.yml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index c23dc88ba..a4087cd19 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -30,7 +30,8 @@ jobs: uses: actions/setup-node@v4 with: node-version: 18.x - + - run: | + echo '${{ toJson(github.event) }}' - name: Cache snapshots id: cache-snapshot uses: actions/cache@v4 From 42ad1f4fe458c8ac79daf1c98bb5b9ae7760316f Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Tue, 23 Jan 2024 23:49:52 +0530 Subject: [PATCH 166/170] RefTest --- .github/workflows/e2e.yml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index a4087cd19..3b3b849bc 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -18,7 +18,7 @@ permissions: env: # For PRs and MergeQueues, the target commit is used, and for push events, github.event.previous is used. - targetHash: ${{ github.event.pull_request.base.sha || github.event.merge_group.base_sha || github.event.before }} + targetHash: ${{ github.event.pull_request.base.sha || github.event.merge_group.base_sha || (github.event.before == '0000000000000000000000000000000000000000' && 'develop' || github.event.before) }} jobs: cache: @@ -31,6 +31,7 @@ jobs: with: node-version: 18.x - run: | + echo '${{ env.targetHash }}' echo '${{ toJson(github.event) }}' - name: Cache snapshots id: cache-snapshot From de03a017db5895679e2a781781ce58592524b7bf Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Tue, 23 Jan 2024 23:51:48 +0530 Subject: [PATCH 167/170] Remove echo --- .github/workflows/e2e.yml | 3 --- 1 file changed, 3 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 3b3b849bc..b8232b8c0 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -30,9 +30,6 @@ jobs: uses: actions/setup-node@v4 with: node-version: 18.x - - run: | - echo '${{ env.targetHash }}' - echo '${{ toJson(github.event) }}' - name: Cache snapshots id: cache-snapshot uses: actions/cache@v4 From ec79ac200c7714276a374988741dc58375c47f04 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Tue, 23 Jan 2024 23:53:48 +0530 Subject: [PATCH 168/170] Lint --- packages/mermaid/src/docs/syntax/flowchart.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/mermaid/src/docs/syntax/flowchart.md b/packages/mermaid/src/docs/syntax/flowchart.md index 95cc962c7..540f820f7 100644 --- a/packages/mermaid/src/docs/syntax/flowchart.md +++ b/packages/mermaid/src/docs/syntax/flowchart.md @@ -775,12 +775,13 @@ flowchart TD B-->E(A fa:fa-camera-retro perhaps?) ``` -Mermaid supports Font Awesome if the CSS is included on the website. -Mermaid does not have any restriction on the version of Font Awesome that can be used. +Mermaid supports Font Awesome if the CSS is included on the website. +Mermaid does not have any restriction on the version of Font Awesome that can be used. Please refer the [Official Font Awesome Documentation](https://fontawesome.com/start) on how to include it in your website. Adding this snippet in the `` would add support for Font Awesome v6.5.1 + ```html Date: Thu, 25 Jan 2024 23:28:42 +0530 Subject: [PATCH 169/170] perf: prevent adding multiple DOMPurify hooks Currently, everytime `removeScript()` is called, the same DOMPurify hooks are getting added again and again. Co-authored-by: Alois Klink --- .../mermaid/src/diagrams/common/common.ts | 33 ++++++++++++++----- 1 file changed, 24 insertions(+), 9 deletions(-) diff --git a/packages/mermaid/src/diagrams/common/common.ts b/packages/mermaid/src/diagrams/common/common.ts index caf43bc68..8609a175a 100644 --- a/packages/mermaid/src/diagrams/common/common.ts +++ b/packages/mermaid/src/diagrams/common/common.ts @@ -18,13 +18,18 @@ export const getRows = (s?: string): string[] => { return str.split('#br#'); }; -/** - * Removes script tags from a text - * - * @param txt - The text to sanitize - * @returns The safer text - */ -export const removeScript = (txt: string): string => { +const setupDompurifyHooksIfNotSetup = (() => { + let setup = false; + + return () => { + if (!setup) { + setupDompurifyHooks(); + setup = true; + } + }; +})(); + +function setupDompurifyHooks() { const TEMPORARY_ATTRIBUTE = 'data-temp-href-target'; DOMPurify.addHook('beforeSanitizeAttributes', (node: Element) => { @@ -33,8 +38,6 @@ export const removeScript = (txt: string): string => { } }); - const sanitizedText = DOMPurify.sanitize(txt); - DOMPurify.addHook('afterSanitizeAttributes', (node: Element) => { if (node.tagName === 'A' && node.hasAttribute(TEMPORARY_ATTRIBUTE)) { node.setAttribute('target', node.getAttribute(TEMPORARY_ATTRIBUTE) || ''); @@ -44,6 +47,18 @@ export const removeScript = (txt: string): string => { } } }); +} + +/** + * Removes script tags from a text + * + * @param txt - The text to sanitize + * @returns The safer text + */ +export const removeScript = (txt: string): string => { + setupDompurifyHooksIfNotSetup(); + + const sanitizedText = DOMPurify.sanitize(txt); return sanitizedText; }; From 59264a33d7306441193cd6c68ceb4ff4ab3d7fd1 Mon Sep 17 00:00:00 2001 From: FutzMonitor Date: Fri, 26 Jan 2024 11:48:48 -0500 Subject: [PATCH 170/170] Changes to gantt.html 1. Added a Gantt diagram that demonstrates to users that hashtages and semicolons can be added to titles, sections, and task data. Changes to gantt.spec.js 1. Added unit tests to ensure that semicolons and hashtags didn't break the functionality of the gantt diagram when used in titles, sections or task data. Changes to /parser/gantt.spec.js 1. Added rendering tests to ensure that semicolons and hashtags in titles, sections, and task data didn't break the rendering of Gantt diagrams. --- cypress/integration/rendering/gantt.spec.js | 102 ++++++++++++++++++ demos/gantt.html | 15 +++ .../src/diagrams/gantt/parser/gantt.spec.js | 36 +++++++ 3 files changed, 153 insertions(+) diff --git a/cypress/integration/rendering/gantt.spec.js b/cypress/integration/rendering/gantt.spec.js index 73ff4ee00..4abde9d44 100644 --- a/cypress/integration/rendering/gantt.spec.js +++ b/cypress/integration/rendering/gantt.spec.js @@ -583,4 +583,106 @@ describe('Gantt diagram', () => { {} ); }); + + it("should render when there's a semicolon in the title", () => { + imgSnapshotTest( + ` + gantt + title ;Gantt With a Semicolon in the Title + dateFormat YYYY-MM-DD + section Section + A task :a1, 2014-01-01, 30d + Another task :after a1 , 20d + section Another + Task in sec :2014-01-12 , 12d + another task : 24d + `, + {} + ); + }); + + it("should render when there's a semicolon in a section is true", () => { + imgSnapshotTest( + ` + gantt + title Gantt Digram + dateFormat YYYY-MM-DD + section ;Section With a Semicolon + A task :a1, 2014-01-01, 30d + Another task :after a1 , 20d + section Another + Task in sec :2014-01-12 , 12d + another task : 24d + `, + {} + ); + }); + + it("should render when there's a semicolon in the task data", () => { + imgSnapshotTest( + ` + gantt + title Gantt Digram + dateFormat YYYY-MM-DD + section Section + ;A task with a semiclon :a1, 2014-01-01, 30d + Another task :after a1 , 20d + section Another + Task in sec :2014-01-12 , 12d + another task : 24d + `, + {} + ); + }); + + it("should render when there's a hashtag in the title", () => { + imgSnapshotTest( + ` + gantt + title #Gantt With a Hashtag in the Title + dateFormat YYYY-MM-DD + section Section + A task :a1, 2014-01-01, 30d + Another task :after a1 , 20d + section Another + Task in sec :2014-01-12 , 12d + another task : 24d + `, + {} + ); + }); + + it("should render when there's a hashtag in a section is true", () => { + imgSnapshotTest( + ` + gantt + title Gantt Digram + dateFormat YYYY-MM-DD + section #Section With a Hashtag + A task :a1, 2014-01-01, 30d + Another task :after a1 , 20d + section Another + Task in sec :2014-01-12 , 12d + another task : 24d + `, + {} + ); + }); + + it("should render when there's a hashtag in the task data", () => { + imgSnapshotTest( + ` + gantt + title Gantt Digram + dateFormat YYYY-MM-DD + section Section + #A task with a hashtag :a1, 2014-01-01, 30d + Another task :after a1 , 20d + section Another + Task in sec :2014-01-12 , 12d + another task : 24d + `, + {} + ); + }); }); diff --git a/demos/gantt.html b/demos/gantt.html index 88f52ef5c..9c82371ab 100644 --- a/demos/gantt.html +++ b/demos/gantt.html @@ -30,6 +30,21 @@
+ 
+      gantt
+        title #; Gantt Diagrams Allow Semicolons and Hashtags #;!
+        accTitle: A simple sample gantt diagram
+        accDescr: 2 sections with 2 tasks each, from 2014
+        dateFormat  YYYY-MM-DD
+        section #;Section
+        #;A task           :a1, 2014-01-01, 30d
+        #;Another task     :after a1  , 20d
+        section #;Another
+        Task in sec      :2014-01-12  , 12d
+        another task      : 24d
+
+
+ 
     gantt
       title Airworks roadmap
diff --git a/packages/mermaid/src/diagrams/gantt/parser/gantt.spec.js b/packages/mermaid/src/diagrams/gantt/parser/gantt.spec.js
index e7ce1ffa4..ae5f74249 100644
--- a/packages/mermaid/src/diagrams/gantt/parser/gantt.spec.js
+++ b/packages/mermaid/src/diagrams/gantt/parser/gantt.spec.js
@@ -28,8 +28,12 @@ describe('when parsing a gantt diagram it', function () {
   });
   it('should handle a title definition', function () {
     const str = 'gantt\ndateFormat yyyy-mm-dd\ntitle Adding gantt diagram functionality to mermaid';
+    const semi = 'gantt\ndateFormat yyyy-mm-dd\ntitle ;Gantt diagram titles support semicolons';
+    const hash = 'gantt\ndateFormat yyyy-mm-dd\ntitle #Gantt diagram titles support hashtags';
 
     expect(parserFnConstructor(str)).not.toThrow();
+    expect(parserFnConstructor(semi)).not.toThrow();
+    expect(parserFnConstructor(hash)).not.toThrow();
   });
   it('should handle an excludes definition', function () {
     const str =
@@ -53,7 +57,23 @@ describe('when parsing a gantt diagram it', function () {
       'excludes weekdays 2019-02-01\n' +
       'section Documentation';
 
+    const semi =
+      'gantt\n' +
+      'dateFormat yyyy-mm-dd\n' +
+      'title Adding gantt diagram functionality to mermaid\n' +
+      'excludes weekdays 2019-02-01\n' +
+      'section ;Documentation';
+
+    const hash =
+      'gantt\n' +
+      'dateFormat yyyy-mm-dd\n' +
+      'title Adding gantt diagram functionality to mermaid\n' +
+      'excludes weekdays 2019-02-01\n' +
+      'section #Documentation';
+
     expect(parserFnConstructor(str)).not.toThrow();
+    expect(parserFnConstructor(semi)).not.toThrow();
+    expect(parserFnConstructor(hash)).not.toThrow();
   });
   it('should handle multiline section titles with different line breaks', function () {
     const str =
@@ -73,7 +93,23 @@ describe('when parsing a gantt diagram it', function () {
       'section Documentation\n' +
       'Design jison grammar:des1, 2014-01-01, 2014-01-04';
 
+    const semi =
+      'gantt\n' +
+      'dateFormat YYYY-MM-DD\n' +
+      'title Adding gantt diagram functionality to mermaid\n' +
+      'section Documentation\n' +
+      ';Design jison grammar:des1, 2014-01-01, 2014-01-04';
+
+    const hash =
+      'gantt\n' +
+      'dateFormat YYYY-MM-DD\n' +
+      'title Adding gantt diagram functionality to mermaid\n' +
+      'section Documentation\n' +
+      '#Design jison grammar:des1, 2014-01-01, 2014-01-04';
+
     expect(parserFnConstructor(str)).not.toThrow();
+    expect(parserFnConstructor(semi)).not.toThrow();
+    expect(parserFnConstructor(hash)).not.toThrow();
 
     const tasks = parser.yy.getTasks();