Custom button hover issue

Hi,

I usually create custom buttons on projects and always have the same problem. A common example I use is an arrow inside of a circle so in effect, two objects (this is the same for some icons you can import from the standard library - many are more than one object).

In the above example I create the hover and select states on the circle as the circle represents the full area of the button. However, this set up causes an issue because if the user hovers over the arrow part of the button the hover state won't activate, nor will they be able to click on the button itself as the trigger is linked to the circle.

I've tried using hotspot which solves the clicking problem but then you can't have a hover and selected state. 

I've tried grouping the circle and arrow so it effectively becomes one object but you can't edit states on groups.

I can't send the arrow back as it disappears behind the circle.

Is there a simple solution I'm missing?

TIA