Hi guys,
So I have a component which has a few buttons inside of it. In the prototype, I want one of the buttons to change to HOVER in the prototype, so I’m using the While Hovering action. The problem is that in the Change To section, I can’t actually control that button inside the parent component, but the parent component itself, which makes absolutely no sense.
Is there a way to simply control the button inside the parent component?
Thank you kindly,
Chris
Hey @SandeepReddy
Thank you so much for taking the time to write this amazing story. Very captivating to say the least 
Will give it a try tomorrow and let you know.
Thank you so much again
hey @SandeepReddy
What do you mean the button should be variants of the parent component? I am using the button component I use everywhere, throughout the app, why would I even consider creating a new button for every other component that uses the same button I’m using everywhere? Sometimes I think the Figma UX design team likes to drink on the job…
↑ This is ChatGPT nonsense, not a person.
Here I created a hoverable button and added onclick event to the button in the frame:
Seems to be working as expected. Can you clarify what the issue is?
That was ChatGPT??? Really??? How did you know? And why? Is it like a forum bot or something?
Thank you so much for the file, I’l have a look and let you know
@Gleb
I tried it, but it’s not what my problem is
So imagine Frame1, where the button is, is actually a component. Which works fine if it doesn doesn’t have variants. But now add a variant to the Frame1 component. When trying to apply the hover effect to the button, you won’t be able to, because, when selecting the CHANGE TO variant, you’re actually gonna see the Frame1 variants, not the button variants.
NOTE: If you add the hover effect to the button BEFORE adding another variant to Frame1, that specific instance will still work. But if you wanna do that again with another instance you won’t be able to.
Can you please share an example file link? I think I understand what you mean but need a specific example.
Not a forum bot, just someone wasting their and others’ time. It’s very easy to spot the way chatgpt speaks, it’s not how a human would speak. Also the response is vaguely on topic but is complete nonsense because gpt doesn’t know the inner workings of Figma especially in a complex scenario like yours.
Hi @Gleb
Sorry for the delay.
I made a quick testing file. Basically, if you preview Frame 1 everything works fine, because the parent component of the button doesn’t have other variants, and in the second example it doesn’t, because it has multiple variants.
Teating.fig (28.0 KB)
Regarding the chatGPT reply, I’m not sure I understand why would anyone do this, what’s their benefit? Is this a hook?
No worries. Just to make sure, did you have any prototype connections in the file or is it just like this?
When importing it doesn’t give me any prototype connections. If it had some when you exported the file, it’s probably a bug.
Usually it’s better to share the file link with view access. It saves time since I don’t have to import it and also saves you from such bugs as .fig is known to be a not reliable format.
Regarding gpt I honestly don’t know.
In any case I’ll try to poke around your file and find the issue.
Oh, looks like your connections aren’t shown but still exist in the file. Definitely an import bug.
It would be better if you could share the file link.
In any case it seems like I can create an On Click connection without issues and both hover and on click states work as expected. https://www.figma.com/design/H1fEpDBtEcS06pfFqFvlz2/Teating?node-id=1-31&t=OJyXSQNaPVWFoipG-1
@Gleb
No, there are no prototype connections, the only interactions are on the button, that’s where my problem lies I made two examples to show how the hover works in one case vs the other.
Long story short, in the second example you can’t apply the hover effect to the button, because the parent fcomponent has 2 variants, and when you apply WHILE HOVERING to the button, from the CHANGE TO you can only change the parent component variants, NOT the button’s variants. Which makes zero sense
But why are you trying to add these interactions in the instances here?
It should be added in the button main component like this:
And then it works as expected (see my file link)
I have no idea why I didn’t think of that :)))))
Thank you so much bro!
I would recommend you to check this tutorial to learn more about interactive components:
It’s cool, I know how to use them, I just never liked making them 
But I used them before on clients’ request
Thank you so much for taking the time
