Components
Icon Button
A square icon-only control — an accessible label is required, not optional.
Built on Button + Icon; DestructiveIconButton is the same control pre-set to a ghost-that-reddens
style with a trash glyph default, for the common "delete this row" case.
Props
Accessibility
labelis a required prop, not optional — an icon-only control has no other accessible name, so the type itself won't let you omit it. It also becomes the nativetitletooltip.
Do / Don't
- Do write
labelas the action ("Edit", "View price entries"), not the icon's name ("Pencil icon") — a screen reader announces the label, not what the glyph looks like. - Don't conditionally render an
IconButtonto hide an action the current user can't take — the DS convention for a permission-gated action is to keep the control visible, disabled, with a tooltip stating why; an absent control is indistinguishable from a permissions gap, a rendering bug, or an unshipped feature.