Dash Mantime Switch Icon

Hello,
I’ve started using dmc for my dashboard, but i seem to have issue with just the example provided for theme switching. I’ve found when using this code for my switch:

layout = dmc.Switch(
offLabel=DashIconify(icon=“radix-icons:moon”, width=20),
onLabel=DashIconify(icon=“radix-icons:sun”, width=20),
size=“xl”,
)

The switch correctly renders, but when i activate the switch from moon to sun and back, the original moon icon is replaced with the sun icon:
1 (not yet switched):
switch1
2 (switched to on):
switch2
3 (returned to off):
switch3

Is there something I’m not understanding with this simple example? Thanks in advance!

Hi @zachmorris

Yes this is a bug that started in dash 3.0.2 and will be fixed in the next dash release (3.0.4) In the meantime there are two workarounds:

  • continue to use dash 3.0.1 until the next release
    or:
  • add an id to the DashIconify icon components. This will enable them to render correctly.
2 Likes

Thank you, adding an id was easy enough!

1 Like