The goal is to modernize the Badge component to the latest Material Design specs by reusing theme tokens (shape, typography, colors etc).

Current state

Badge

MD3 spec: Badges
Specs link: https://m3.material.io/components/badges/specs

Color tokens

• Background error ✅
• Label text onError ✅

Spacing / sizing

• Default size is 20dp. MD3 defines small badge at 6dp (no label) and large badge at 16dp (with label)
• No small/large distinction. Size should be determined automatically: 6dp when no children, 16dp when children are present
• paddingHorizontal: 3. Spec requires 4dp between badge edge and text
• fontSize = size * 0.5 yields 8sp at 16dp. Spec requires 11sp for large badge label text
• Large badge max character count size (16x34dp) not handled; text currently overflows unconstrained

Behavior

• No automatic small vs large variant. Component should render as a 6dp dot when childless and as a 16dp pill when a label is provided