petal_components VS excessibility

There are component libaries for LiveView.

https://github.com/petalframework/petal_components

https://github.com/coingaming/moon

I personally wouldn't use React for components in LiveView, you are just adding more complexity to your application for no reason. It really not that hard to build components using JS and LiveView. In the end you get less complex components than what you would get with react.

You might also look at the PETAL components and ponder improving their accessibility (or the default components that come with the latest version of Phoenix, or any of a number of other UI toolkits).

Nothing stops you from creating 1 component per file. That's what Petal Components library is doing for example: https://github.com/petalframework/petal_components/tree/main/lib/petal_components

Have you looked at https://github.com/petalframework/petal_components?

Homepage: https://petal.build/docs Github: https://github.com/petalframework/petal_components The goal is to have a library of components out of the box ready to go so you can start focusing on solving your clients (or startups) problems instead of getting bogged down in design/css. Write components like this:

This one is Excessibility, which was written by one of my colleagues, and is a pretty nice little starting point. It plays nicely with Phoenix and LiveView.