Chip

Chips are compact little units that represent actions, filters or choices. When shown, they allow users to prompt actions, filter games/content and choose options. We use three types of chips in the Moon:

Action chip Action chips prompt actions related to the game/content.

Filter chip Filter chips let users sieve through large categories.

Selection chip Selection chips allow users to select options that matter to them.

Sizes

Active State

IsStroke

Icons

Icons with isStroke

Props
Name Type Required Default Description
size xsmall | small | medium | large | xlarge false medium Size for chip
left_icon string false - Asset name for the left icon
right_icon string false - Asset name for the right icon
icon_only string false - Asset name for the icon. Icon only and no text shown
active boolean false false Active state
is_stroke boolean false false Show stroke on hover/active