Live rendering mermaid (or plugs)

Hi SB community !

Let’s suppose you have a simple code rendered by a plug (eg : mermaid)

flowchart TD

n1["Réception"] --> n2("Décapage chimique")
n2 -- Optionnel --> n2'("Décapage électrolytique")

Would it be possible (without hundreds lines of code) to live copy these lines in order to have a live rendering of what we’re typing ? Or having a split screen ? :slight_smile:
This would help a lot when building complexe sequences.

i have this following code snipet from somewhere i cant remember. (sorry for not crediting the author)
this openes a sidebar on the right with any page you want, so basically you could open up the same page on the right and reload the function when you modified something on the left. I know it’s not 100% what you asked, but it could work as a workaround.

Sidebar: Open Page

This command opens a page, picked from the page navigation picker, in the panel
on the right hand side.

Try it out: ${widgets.commandButton(“Sidebar: Open Page”)}

command.define {
  name = "Sidebar: Open Page",
  key = "Ctrl-Alt-ArrowRight",
  run = function()
    local allPages = query[[
      from index.tag "page"
      order by _.lastModified desc]]
    local page = editor.filterBox('➡️', allPages, "Select the page to open aside")
    if page != nil then
      editor.showPanel("rhs", 2, [[<iframe src = ]] .. page.name .. [[ style = "height: 98vh; width: 100%; border: 0;" />]])
    end
  end
}

Sidebar: Close

To easily close this panel, the command ${widgets.commandButton(“Sidebar: Close”)} is provided.

command.define {
  name = "Sidebar: Close",
  key = "Ctrl-Alt-ArrowLeft",
  run = function()
    editor.hidePanel("rhs")
  end
}

Not so bad, can help enough for the moment thanks.
BTW, “Sidebar: Close” not working, whereas “Sidebar: Open Page” do.
I can’t figure out why…

appears to be a hierarchical relationship — the child page can be closed only when its parent page retains focus.