tabs: tab "{id}" - badgeTone must be one of {tones}, or a function returning one; got {value}. The badge is drawn untoned.

Warnings reference › tabs.badgeTone.type:*

Identifier

tabs.badgeTone.type:*

Raised by

Tabs

Since

1.59.0

What happened

badgeTone was neither a function nor one of the tone names the theme defines. Tones are named rather than free CSS so that the colour comes from the theme's tokens and stays legible in both light and dark; an unknown name has no token behind it, so the badge is drawn in its default colour.

The fix

Use one of the tone names listed in the message, or a function returning one.

The smallest fix

tabs: [{ id: 'sla', title: 'SLA', badge: true, badgeTone: (n) => (n > 0 ? 'danger' : 'neutral') }]

Reference

Covered in full at the API reference.