Phoenix has great tooling overall, but one thing that’s still lacking is a solid, plug-and-play integration with a modern WYSIWYG editor. Most solutions floating around are partial, outdated or rely on plain JS embeds with no real LiveView support.
So I built one:
This library wraps CKEditor 5 in a LiveComponent.
I’m open to feedback and happy to review PRs - feel free to contribute!
It depends on your uploader plugin. The default preset embeds images as base64. It’s possible to override it and use SimpleUploader that sends file to specific endpoint.
Adds custom upload adapter and elixir controller that handles uploading of images.
Allows specifying upload_url in <.ckeditor5 component. If your app has global config, but certain editor needs base64 image inlineing then upload_url=”base64” disables global config and inlines image.
It is now possible to store dynamic data within the CKEditor state (this is referred to as the model in CKEditor terminology). In other words, you can assign a dynamic array containing data that may affect the CKEditor content. This could be useful for plugins that require additional information to function properly.
I fixed some race conditions relating to the creation or removal of roots.
It is now possible to reference a translation within the editor configuration defined in Phoenix.