I am facing the similar issue when animation width - 'auto' on animate the animation jitters a little bit at the end of exit.

      <motion.div
        style={{ justifyContent: 'flex-end' }}
        className="flex items-center gap-4 bg-background backdrop-blur-2xl border rounded-full p-2 origin-right h-9"
      >
        <AnimatePresence mode='wait'>
          {isActive && (
            <motion.div
              layout
              layoutId='item'
              initial={{ width: 0, opacity: 0, filter: 'blur(2px)' }}
              animate={{ width: 'auto', opacity: 1, filter: 'blur(0px)' }}
              exit={{ width: 0, opacity: 0, filter: 'blur(2px)' }}
              transition={{
                duration: 0.3,
                ease: 'easeInOut',
                delayChildren:0.1
              }}
              style={{ transformOrigin: 'right' 
               }}

              className="overflow-hidden relative"
            >
              <div className='flex items-center gap-4'>
              <NavigationItem text="Home" href="/" />
              <NavigationItem text="Documentation" href="/docs" />
              </div>
            
            </motion.div>
          )}
        </AnimatePresence>

        <Menu
          animate={isActive == true ? true : false}
          className="w-5 h-5 flex-shrink-0"
          onClick={() => setIsActive(!isActive)}
        />
      </motion.div>