Note size is not scaled to be at least as long as the text length (font dependent)

Describe the bug Text sometimes overflows the boundaries of the Note box behind it.

To Reproduce Steps to reproduce the behavior:

sequenceDiagram
  accTitle:  playback
  accDescr: Sequence diagram
participant PE
participant ESX Player
Note over PE, ESX Player: Video/audio config can change during play
opt New video frames will be a different configuration
    PE->>ESX Player: ConfigureVideo()
end
opt New audio frames will be a different configuration
    PE->>ESX Player: ConfigureAudio()
end
Note right of ESX Player: Frames requested & appended in parallel
loop Play
    opt If buffer reaches maximum while playing
        ESX Player->>PE: OnEnoughFrames()
    end
    activate ESX Player
    ESX Player->>ESX Player: Play buffered frames
    ESX Player->>PE: CurrentTimeUpdated.Emit()
    deactivate ESX Player
end

Expected behavior A Note should adjust it’s width to at least the width of the text give to it

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

mmdc ran in Docker image ‘pandoc/latex:2.18-ubuntu’ with custom entrypoint script that installs npm install @mermaid/mermaid-cli

[craigmac]

Thanks @MindaugasLaganeckas ! Yes adding the monospace directive at the top with %%{init: {"fontFamily": "monospace"}}%% does trigger overflow of boxes drawn behind (at least for the first label) for some reason the second label auto-adjusts (as it should). Will file upstream.

[aloisklink]

It might also be worth having a try in https://mermaid.live, e.g. (replacing `“fontFamily” with your font) https://mermaid.live/edit#pako:eNqtk01v2zAMhv8KISDFBmTt3YcCQ-sCO6wNkG7YwRdGom1i-vBkKVkQ5L9PstLFWdDbdLEt6n35kBYPQjpFohKLxYEthwoOjWidDU9oWO8bUUEjjLNuHFBSI47HxaKxI_2KZCU9MnYeTWMhLZTylYOmCmDQuN-g_Pk38Eij9BWsTzpQc-GAPrDkAW2AVX29V69_wCo5ki-xZxcI3JZ8Or2cRSv4zorcHUbFDqSzLXcg0YLs0XYpafRsuwmuGLkhwDPtYJtl0CYgGmHHWsOGABNk25KnRFC8osfAzhZtXqv60_39PP_D6RxNIB8-lqNk1WW-Avg_833Ojlf5pkZ57voArr1o1FPJ7fP_GAMpuAEchiRMr2xz91Fr0sVGOzdMyjNJruRLC5uYiZMNyj7ZGfzNJhrY9axp6nPq91mU1xkilbKqK3ixtXWx6wvRWwkXZZQ7FHiLqZx_L8OV6bzM_DxBpsJKw9-RZZaH6HP7X9nQt0GlbOq2NhzmUIreJZl4xVIY8gZZpZk6lEBjj2k7To614uC8qIKPtBQYg1vvrXz7LmdOUyWqFvWYdmnSfC1zOo3r8Q9btzcO

If it is happening there too, then it’s an issue with the upstream https://github.com/mermaid-js/mermaid project.