Prototyping action malfunctions, changing components erratically

I have tried to rethink the way this interaction is supposed to happen, and spent the better part of my day last Friday trying to figure it out, even though I have built similar interactions a million times before. I might be doing something wrong, but I am becoming more and more certain that this is a bug.

The video below shows the individual button component that makes up the sections of the segmented button below. You will see that the interaction on the button is as follows:

  • Default state changes to hover state on while hovering
  • Hover state changes to pressed state on while pressing
  • Hover state changes to active state on on click (this works better than trying to do on click for the pressed state)

Then I have a simple component set of 5 variants where clicking on one option should toggle the view to the next, but instead, you can see what happens.

The nested component SHOULD remain active after pressing, and yet it goes back to default. If this is not a bug, I would love to learn how to fix this and why it’s changes (this has worked in past for me before!)


Not sure if this is the issue for you, but sometimes when I get weird interactions between buttons/variants, checking “Reset component state” fixes the issues.

1 Like

Well the good news is that fixed it, so thanks!

The bad news is that I feel like a muppet for not figuring that out, but that’s my own issue :sweat_smile:

1 Like

No worries, I was working on a dropdown and having similar issues and couldn’t figure out what was going on, until I found & clicked on the magical “Reset component state” option. Glad it helped!