I am using SwiperJS in Next.js and trying to set up custom navigation. I want to use the useSwiper hook as explained in the docs (https://swiperjs.com/react#use-swiper) but the import is not working.

When trying to import the hook; import {Swiper, SwiperSlide, useSwiper} from 'swiper/react/swiper-react' i am running in to error Attempted import error: 'useSwiper' is not exported from 'swiper/react/swiper-react'.

I have checked the swiper-react.js file and as far as i can see it does export the useSwiper hook;

import { Swiper } from './swiper.js';
import { SwiperSlide } from './swiper-slide.js';
export { useSwiperSlide, useSwiper } from './context.js';
export { Swiper, SwiperSlide }

The Swiper and SwiperSlide imports are working fine.

Unsure as to why this is happening if anyone can please help?