♿️ Add focus trap to the menu

[johannchopin]

Description

Added a focus trap to the menu to that the user can't tab somewhere else in the hidden page. Use the react component base on focus-trap who seems trustworthy.

Tests

• All tests passed.

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/carloscuesta/gitmoji/6wbyxKHbqozhfzeC1Fq49A2NYW4D
✅ Preview: https://gitmoji-git-fork-johannchopin-feature-a11n-menu-carloscuesta.vercel.app

[carloscuesta]

Hey! That's a great improvement thanks 😊

A small detail with the dependencies

[carloscuesta]

I was testing this was Safari and seems to not work properly, the menu is always open and you can't close it 😅

[johannchopin]

@carloscuesta Outch really sorry 😓 seems that we can't use the dialog balise for now:

I removed it and seems to work properly now. However the tabulation doesn't work in safari and firefox (but it is already the case in https://gitmoji.dev/). Will need to investigate waht this browsers need to handle tabulation.

[carloscuesta]

Thanks! 😍