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.mdGitHub
meps/mep-0003.md at main · marimo-team/meps
Marimo Enhancement Proposals. Contribute to marimo-team/meps development by creating an account on GitHub.
3 Replies
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.
Hi Akshay! At the moment I’m interested in the latter more - I think. Ta.
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