swordev / suid

A port of Material-UI (MUI) built with SolidJS.
https://suid.io
MIT License
673 stars 48 forks source link

How to pass Theme to SolidStart Routes #217

Closed BierDav closed 1 year ago

BierDav commented 1 year ago

I have wrapped my routes in my root.tsx in a ThemeProvider so that my whole application is Themed, but it seams that the theme only works till the routes, because the content of my pages don't have a clue of the Theme of my ThemeProvider. Am I doing something wrong`?

juanrgm commented 1 year ago

Without a proof of concept it is difficult to debug.

BierDav commented 1 year ago

What do you mean with a proof of concept? You can simply debug it by wrapping the router in the ThemeProvider use a custom primary color and you will notice that when you use eg. a Button in a route that it will be using the default style.

Does that answer your question kind of?

juanrgm commented 1 year ago

I am using the router in several projects and it's ok.

Without a demo in Stackblitz I can't help you (https://suid.io/tools/playground).

BierDav commented 1 year ago

Thanks for letting me investigating this further. The problem was that I wrapped the ThemeProvider in a Component: https://github.com/BierDav/suid-bug or StackBlitz https://stackblitz.com/github/BierDav/suid-bug

I have the feeling that this might be an issue from solid-start it self, but idk.

juanrgm commented 1 year ago

You are destructuring the children property outside of the ThemeProvider (here and here).

Use props.children instead of children.

BierDav commented 1 year ago

Oh thank you!