Legend overflow through the screen and doesn't create new line

The issue is that if there are many legends on the screen, it won't create a new line and instead just overflow through the screen

Here's a sandbox code: https://codesandbox.io/p/sandbox/mldqjs