Can svelte-lexical use excalidraw?

[theslyprofessor]

Hi,
I'm a bit of a beginner here and I'm wondering if this framework is suitable for using lexical with excalidraw?

I saw this article discussing support for lexical with excalidraw: excalidraw/excalidraw#6718

Thanks

[umaranis]

Hi @theslyprofessor ,

Lexical’s excalidraw plugin is not ported to svelte-lexical yet. All lexical plugins are coded in react and to use them with this project , we have to port it to svelte.

If you are willing to work on the port, I can assist you with it.

[theslyprofessor]

Yes! I am definitely interested in helping out.

[theslyprofessor]

Let me know whenever you can the best way that I can help, incorporating it would help me finish my PhD: [email protected]

[umaranis]

Hi @theslyprofessor ,

I just got the time to look at it in detail. Earlier, I missed the fact that excalidraw is implemented in React.

Usually, when we port a plugin from lexical to svelte-lexical, we have to port the plugin code from react to svelte. But in this case, the lexical plugin depends on a package (excalidraw) written in react. So, first, we will have to port it to svelte. This is going to be a huge task I believe.

[YugoCode]

Here is a working demo of using excalidraw with Svelte: https://www.sveltelab.dev/yg89k40qsw1uufc
Basically, you will add React as a dependency and use a wrapper to call and interact with excalidraw from Svelte.

There are some libraries which help you with that, i.e. using React components in Svelte:

• https://github.com/Mokshit06/sveltris
• https://github.com/frontline-hq/react-in-svelte

Of course this should only be a workaround until there is a real Svelte port. But I think it's better to use such wrappers instead of having no excalidraw support at all. And performance wise I haven't seen any issues with the linked demo above.

@umaranis What do you say?

[umaranis]

Hi @YugoCode ,
Thanks for sharing a working example 🙂
Yes, I agree to provide these workarounds until we have a port.
But we will have to make it very clear what the dependencies are and have library users explicitly include such plugins (rather than including them by default).