Framer-motion exit animation not firing

The exiting elements need to be direct children of the <AnimatePresence> tag.

Your sandbox doesn't run here, so I can't verify the solution, but it should work if you change your structure from this:

<AnimatePresence>
  <NotificationContext>
    <div id="notificationCenter">
      <motion.div key={notification.id} />
    </div>
  </NotificationContext>
</AnimatePresence>

to this:

<NotificationContext>
  <div id="notificationCenter">
    <AnimatePresence>
      <motion.div key={notification.id} />
    </AnimatePresence>
  </div>
<NotificationContext>