I'm relatively new to Figma, and I look for the best way to do this:
A button has states like checked/unchecked (an option in a filtering bar of a web shop or "add to favorites" button that changes from only stroke to a filled shape and back) and also has a hover effect that changes its shade, and when you switch its state (by clicking/pressing it), hover remains there until you move away the cursor, seamlessly, without that blink/flicker when it turns into the default version of new state and only then to a hovered one.
So the full cycle (of pressing it twice) is "1 → 1 hover → 2 hover → 2 → 2 hover → 1 hover → 1".
But it's on PCs/laptops. On phones/tablets, the hover is shown while you touch the button, and after removing your finger, it goes straight to a new state without hover.
Full cycle: "1 → 1 hover → 2 → 2 hover → 1".
I want it to take as few components as possible. I tried something, but "on click" and "mouse up" interactions (for the states) leading to different variants of a component conflicted and the pc/laptop version didn't work properly.
