mrchrisadams
mrchrisadams11mo ago

UI plugins

hi folks - I discovered Marimo recently, and I'm looking into how to use it, with a view to writing in more detail how to use it with Django as a way to explore data stored in an django application. I did a talk a while back at DjangoConEU about how to do the same trick with with Jupyter and Python, once I had figured out how they work. It's visible below: https://www.youtube.com/watch?v=x6qxpm_SSZ8 Anyway - talks force me to get my shit together and figure out how to explain things well, and I'm considering doing the same for Marimo in 2024 - if I wanted to understand how different representations of objects or data are rendered in the front end of Marimo, so I could try adding future widgets, where would I look? I see in MEP 003 the marimo-ui-element web component is defined, as well as providing a bit more thinking about how they're intended to be used. Is that the best place to start if I've already looked through the Marimo codebase and want a higher level overview? And is there anywhere else specificially you'd direct my attention? https://github.com/marimo-team/meps/blob/main/mep-0003.md
3 Replies
Akshay
Akshay10mo ago
Hi, welcome! Sounds like a cool plugin. That MEP is unfortunately a bit outdated. I can point you to some places in the codebase in a bit. Are you interested in making an reactive element, whose value is synchronized with Python? Or just a self-contained viewer/ explorer? The implementation path is different, depending on which you want.
mrchrisadams
mrchrisadamsOP10mo ago
Hi Akshay! At the moment I’m interested in the latter more - I think. Ta.
Akshay
Akshay10mo ago
Hi @mrchrisadams ! Sorry for the delay. There are a couple options. 1. You could use mo.Html() to render an iframe containing your component 2. If an iframe doesn't work, we can explore adding your Django explorer as a bonafide stateless plugin to the marimo codebase (we have talked about curating third party plugins in our repo -- yours could be the first!). Here is an example of instantiating a stateless plugin from Python: https://github.com/marimo-team/marimo/blob/main/marimo/_output/formatters/plotly_formatters.py, and here is its implementation in our frontend https://github.com/marimo-team/marimo/tree/main/frontend/src/plugins/impl/plotly