Mermaid click animation support
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
Source: slidevjs/slidev