I have one button that offers the user up to ~10 choices. The button label says 'apply as' and the dropdown lists all the possible choices. I have multiple choices on how to design this.
As a hover, where the dropdown opens on hover. As a onClick, where the dropdown opens on click.
I think I will be going for the hover as it is most commonly used, however should the 'apply as' also be clickable in that case? I dont have anywhere where the user should go as they need to define their choice first. It feels wrong to have a button that is not actually clickable, but only function as a placeholder for the dropdown.
Whats your opinion / advice?
For material, they have a segmented dropdown button
A segmented dropdown has two sections: the current state and the dropdown arrow icon. Pressing the current state will cause that state’s action to fire within the screen. Pressing the dropdown arrow will display all the state options. Selecting one will change the displayed state