Add optional config dictionary to mermaid component to be passed initialize() on mount

[kyloe]

Added an optional parameter to ui.mermaid(), parameter is a dictionary that will be passed to the mermaid.initialize() method on mount, allowing the configuration of the mermaid engine prior to the first renderring.

This enables the adjustment of securityLevel, logLevel and other associated parameters on the engine.

Setting securityLevel to 'loose' will allow javascript call back functions to be called when nodes are clicked using mermaids 'click' syntax

A minimal example of usage would look like this

ui.add_head_html('''
    <script>
    var _mermaidClickHandler = function (e) {
        emitEvent("mermaidNodeEvent",e);
        };
    </script>
''')

ui.on('mermaidNodeEvent',(lambda e: _label.set_text(e.args)))

m = ui.mermaid('''flowchart TD;
    AAAA((XXXX));
    click AAAA href \"javascript:_mermaidClickHandler(\'I was clicked!\')\"''',config={'securityLevel':'loose'}) 

_label = ui.label('Place holder')

[falkoschindler]

Thanks for the pull request, @kyloe!

I just reviewed your code, simplified the tests a little bit, and added a documentation demo. Let's merge! 🚀

[kyloe]

:) Hurrah ( I notice that you actually did most of the work - all noted for next time )

…

On Thu, 6 Jun 2024 at 08:58, Falko Schindler ***@***.***> wrote: Merged #3164 <#3164> into main. — Reply to this email directly, view it on GitHub <#3164 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABULB5KRSE4NKCQSZT575BTZGAJCJAVCNFSM6AAAAABIVJ2FZGVHI2DSMVQWIX3LMV45UABCJFZXG5LFIV3GK3TUJZXXI2LGNFRWC5DJN5XDWMJTGA3DENJUHE3TEMY> . You are receiving this because you were mentioned.Message ID: ***@***.***>