Let top level theming for class_name work.

[hjpr]

When doing top level styling at the rx.App level, passing class_name to a component as part of a style library doesn't work. I enjoy the coloring and theming of tailwind so I'd like to be able to say

style = {
    rx.flex: {
        "class_name": "bg-white dark:bg-zinc-700"
    },
    rx.text: {
        "class_name": "text-zinc-700 dark:text-zinc-50"
    }
}

app = rx.App(style=style)

Don't have the reflex know-how to understand where the css interpretation is happening and create a conditional for tailwind prop. Thanks!

[linear[bot]]

ENG-4136 Let top level theming for class_name work.

[hjpr]

Attempted to tackle this but feel like I'm missing something...

• During init of the Style class I can get the class_names specified in the App.style to log once when the Style initializes for the two components I have specified in the example above, but when attempting to save those to kwargs["class_name"], in the Component init, the style_dict of all the sub components doesn't contain the class_names and thus doesn't propagate.

  So then I tried to debug...

• I can affect all values of all components by manually setting the style_dict during the init of Style to something like style_dict["class_name"]="bg-white". Then every component has a white background.

  I'm guessing there's some magic I'm missing when components initialize that I don't seem to understand.