#1498·slidev

Mermaid click animation support

Author: pinage404Created Apr 5, 2024Updated Aug 21, 2026
Labelsfeat: mermaidfeat: clicks system🍪 p3-highly-demanded

Hello,

Thanks for making slidev, i love it !

Is your feature request related to a problem? Please describe. I have some Mermaid diagrams with many elements

I would like to be able to display the elements one by one

So that the audience has time to understand how it is built step by step

Describe the solution you'd like I would like to have something like <v-click> that would display the element after a click / space

Describe alternatives you've considered I can display everything at once

Advantages :

  • Easy to maintain
  • Single source of truth

Disadvantages :

  • harder for the public to understand

I can duplicate the diagram on several slides, and remove the elements on the first few slides

Advantages :

  • the diagram becomes more complex as you move through the slides

Disadvantages :

  • elements do not have the same position from one slide to the next, which is harder for the audience to understand
  • harder to maintain : if i want to change an element, i have to do so on each slide

I can duplicate the diagram on several slides, and add a custom style to hide elements

flowchart LR
    First --> Second
    Second --> Third

    classDef Hidden visibility:hidden
    class Second,Third Hidden
flowchart LR
    First --> Second
    Second --> Third

    classDef Hidden visibility:hidden
    class Second,Third Hidden

Advantages :

  • the diagram becomes more complex as you move through the slides
  • elements keep their position between slides

Disadvantages :

  • arrows between elements are not hidden
  • harder to maintain : if i want to change an element, i have to do so on each slide