How to auto shift the text accordingly when it expands

[starxyn]

I have a Badge placed at the most right of the Card component. However, the text inside the badge may be very long, so how do I ensure that this text will auto shift to the left without overflow?

[Kenzo-Wada]

You can use Flex with justify="flex-end"

<Card>
  <Flex justify="flex-end">
    <Badge>badge</Badge>
  </Flex>
</Card>