Skip to content

feat(ishikawa): support empty gap branched with []#7891

Draft
sillydan1 wants to merge 1 commit into
mermaid-js:developfrom
sillydan1:develop
Draft

feat(ishikawa): support empty gap branched with []#7891
sillydan1 wants to merge 1 commit into
mermaid-js:developfrom
sillydan1:develop

Conversation

@sillydan1

Copy link
Copy Markdown

📑 Summary

This PR adds the possibility of specifying an "empty" branch in ishikawa diagrams. This is useful when you have long branch descriptions that would have the text collide with other branches.

Demonstration of the problem:

ishikawa
    Demo
    Category
        Very long branch description that is cool and more text goes here describing the potential cause
        Another long branch name that is less cool, but also describes another potential cause
    Category2
        Very long branch description that is cool and more text goes here describing the potential cause
        Another long branch name that is less cool, but also describes another potential cause
Loading

This PR enables you to add extra spacing between the branches.

ishikawa
    Demo
    Category
        Very long branch description that is cool and more text goes here describing the potential cause
        []
        []
        Another long branch name that is less cool, but also describes another potential cause
    Category2
        Very long branch description that is cool and more text goes here describing the potential cause
        []
        []
        Another long branch name that is less cool, but also describes another potential cause

📏 Design Decisions

I'm unsure about the overall approach here - maybe the real solution is to calculate the bounding boxes of the labels better instead?

📋 Tasks

Make sure you

  • 📖 have read the contribution guidelines
  • 💻 have added necessary unit/e2e tests.
  • 📓 have added documentation. Make sure MERMAID_RELEASE_VERSION is used for all new features.
  • 🦋 If your PR makes a change that should be noted in one or more packages' changelogs, generate a changeset by running pnpm changeset and following the prompts. Changesets that add features should be minor and those that fix bugs should be patch. Please prefix changeset messages with feat:, fix:, or chore:.
@netlify

netlify Bot commented Jun 19, 2026

Copy link
Copy Markdown

Deploy Preview for mermaid-js ready!

Name Link
🔨 Latest commit 46b3f83
🔍 Latest deploy log https://app.netlify.com/projects/mermaid-js/deploys/6a35356d4b289b0008c2f053
😎 Deploy Preview https://deploy-preview-7891--mermaid-js.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@changeset-bot

changeset-bot Bot commented Jun 19, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 46b3f83

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
mermaid Minor

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

@sillydan1 sillydan1 changed the title feat(ishikawa): add spaces Jun 19, 2026
@pkg-pr-new

pkg-pr-new Bot commented Jun 19, 2026

Copy link
Copy Markdown

Open in StackBlitz

@mermaid-js/examples

npm i https://pkg.pr.new/@mermaid-js/examples@7891

mermaid

npm i https://pkg.pr.new/mermaid@7891

@mermaid-js/layout-elk

npm i https://pkg.pr.new/@mermaid-js/layout-elk@7891

@mermaid-js/layout-tidy-tree

npm i https://pkg.pr.new/@mermaid-js/layout-tidy-tree@7891

@mermaid-js/mermaid-zenuml

npm i https://pkg.pr.new/@mermaid-js/mermaid-zenuml@7891

@mermaid-js/parser

npm i https://pkg.pr.new/@mermaid-js/parser@7891

@mermaid-js/tiny

npm i https://pkg.pr.new/@mermaid-js/tiny@7891

commit: 46b3f83

@codecov

codecov Bot commented Jun 19, 2026

Copy link
Copy Markdown

Codecov Report

❌ Patch coverage is 68.18182% with 7 lines in your changes missing coverage. Please review.
✅ Project coverage is 20.02%. Comparing base (b68b7de) to head (46b3f83).
⚠️ Report is 10 commits behind head on develop.

Files with missing lines Patch % Lines
.../mermaid/src/diagrams/ishikawa/ishikawaRenderer.ts 65.00% 3 Missing and 4 partials ⚠️
Additional details and impacted files

Impacted file tree graph

@@             Coverage Diff              @@
##           develop    #7891       +/-   ##
============================================
- Coverage    77.79%   20.02%   -57.78%     
============================================
  Files          409      184      -225     
  Lines        30328    10134    -20194     
  Branches      5175     1410     -3765     
============================================
- Hits         23595     2029    -21566     
- Misses        5410     8040     +2630     
+ Partials      1323       65     -1258     
Flag Coverage Δ
e2e 20.02% <68.18%> (-61.95%) ⬇️
unit ?

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines Coverage Δ
...ckages/mermaid/src/diagrams/ishikawa/ishikawaDb.ts 81.25% <100.00%> (+0.60%) ⬆️
.../mermaid/src/diagrams/ishikawa/ishikawaRenderer.ts 89.23% <65.00%> (-2.43%) ⬇️

... and 394 files with indirect coverage changes

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.
@argos-ci

argos-ci Bot commented Jun 19, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Argos notifications ↗︎

Build Status Details Updated (UTC)
default (Inspect) ✅ No changes detected - Jun 19, 2026, 12:33 PM

@sidharthv96 sidharthv96 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the PR @sillydan1, The problem is clear, but I think we need to change our approach to the problem.

Is there anything stopping us from rendering properly by measuring the size of nodes and adjusting the spacing as required, instead of having to manually add empty spaces?

@sidharthv96 sidharthv96 marked this pull request as draft June 19, 2026 19:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

2 participants