Dark/Light Mode Toggle Component

[Vucko95]

ThemePicker seems great, but I would like to configure it as a switch and not to have a lot of choice in the UI, this is what I tried but I does not work.

def ex_theme_switcher2():
    switch = Switch(id="theme-switch", cls="ml-4", data_hx_trigger="change", data_hx_target="body", data_hx_swap="outerHTML")

    light_theme = ThemePicker(color="orange", radii="uk-radii-md", shadows="uk-shadows-md", font="uk-font-base", mode="light", cls="hidden")
    dark_theme = ThemePicker(color="orange", radii="uk-radii-md", shadows="uk-shadows-md", font="uk-font-base", mode="dark", cls="hidden")

    return Div(
        Div("Dark Mode", switch, cls="flex items-center space-x-2"),
        Div(light_theme, id="light-theme", cls="hidden"),
        Div(dark_theme, id="dark-theme", cls="hidden"),
    )

Goal is just to have a small switch that will change theme on click to Dark / White.

Can this be accomplished with a Switch, only way for me to change theme that was working is with having full Theme Picker UI and pressing Dark or Light button.