This example demonstrates one way to achieve an animated modal. Keep in mind that there are many, many ways to accomplish this same thing. This approach isn't any more right or wrong than any others!
- Clone this repository
- Navigate into this directory
- Run
npm install
- Run
npm start
The example will be running at localhost:3000
.
- The
elementType
prop to turn the FocusNode into amotion.div
from Framer Motion. - The
propsFromNode
prop, which allows you to dynamically return props based on the current node. In this example, we use it to configure the animation of the focus node. - Using a focus trap to lock focus within the modal while it's active