Feature/flowchart edge classdef#7557
Open
christikaes wants to merge 4 commits intomermaid-js:developfrom
Open
Conversation
Introduces a new @:::className syntax that allows users to apply classDef styles to edges in flowchart diagrams, mirroring how :::className works for nodes. - Add LINK_ID_CLASS and LINK_CLASS lexer tokens to flow.jison (placed before LINK_ID to ensure first-match wins) - Add grammar rules for both bare-arrow and pipe-label forms in linkStatement and link productions - Update addSingleLink() in flowDb.ts to propagate type.classes onto the FlowEdge - Fix getData() in flowDb.ts to append classDef class names to the SVG class attribute string on rendered edges - Fix for...in on array in edges.js (insertEdge) to use for...of - Add 9 parser tests in flow-style.spec.js covering all syntax variants - Add 2 getData() integration tests in flowDb.spec.ts verifying cssCompiledStyles is populated for edges - Add demo diagram to demos/flowchart.html
🦋 Changeset detectedLatest commit: 0279465 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
✅ Deploy Preview for mermaid-js ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
@mermaid-js/examples
mermaid
@mermaid-js/layout-elk
@mermaid-js/layout-tidy-tree
@mermaid-js/mermaid-zenuml
@mermaid-js/parser
@mermaid-js/tiny
commit: |
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## develop #7557 +/- ##
==========================================
- Coverage 3.34% 3.34% -0.01%
==========================================
Files 524 524
Lines 55256 55261 +5
Branches 795 795
==========================================
Hits 1850 1850
- Misses 53406 53411 +5
Flags with carried forward coverage won't be shown. Click here to find out more.
🚀 New features to boost your workflow:
|
|
Hi! Checked your PR—in line 2262 of the failed e2e tests, it clearly says the screenshot limit for the plan was exceeded. So technically, it’s not your fault at all! If you want, you could reduce the number of test cases, but honestly, you can probably leave it as is. I've seen many other PRs with the same issue that still got merged because the logic itself is fine. Nice work regardless |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Resolves #6938, #6017
Adds support for applying
classDefstyles directly to edges in flowchart diagrams using a new inline@:::classNamesyntax, mirroring how:::classNameworks for nodes. This allows applying styles such as colors to multiple edges at once while still remaining backwards compatible with edge ids.New syntax
flowchart TD
Start:::nodeStyle --> Process
Process okLink@:::edgeStyle-->|OK| Approve
Process @:::edgeStyle-->|Error| Retry
Approve @:::edgeStyle--> End
Retry --> Process
@:::className— class only, no edge IDmyId@:::className— class + user-defined edge IDclass <edgeId> <className>statement syntax unchangedChanges
Tests
982 flowchart tests pass, 0 regressions.