ActionIcon

icon as a button

ActionIcon serves the "icon as a button" pattern. It requires a self-explanatory icon, which makes the text label not strictly needed. For example, the "trash" icon unambiguously conveys the meaning of the "delete" action.

Technically, the icon is added as child of ActionIcon:

<ActionIcon>
	<IconMail size={14} stroke={...}/>
</ActionIcon>

The child icon now behaves like a button, and follows the variant appearance. To get a naked icon effect, we select the subtle or transparent variants.

We can set size at the ActionIcon level: it impacts the hover and active zone, and the icon scale.