Swiper React, как остановить и запустить автовоспроизведение при наведении с помощью Typescript

Я использую Swiper js для своей карусели, React и Typescript.

После этого сообщения, я пытаюсь stop() и start() автоматически воспроизводиться при наведении. Мне нужен этот подход, потому что мне нужно создать некоторые состояния при наведении курсора на контейнер Swiper.

1) Я получаю ошибку машинописного текста в свойстве ref моего компонента <Swiper ref={swiperRef}>:

Свойство ref не существует для типа IntrinsicAttributes & Swiper & {children?

2) как мне получить доступ к swiper, чтобы я мог использовать swiper.autoplay.stop(); внутри моей функции handleMouseEnter? Поэтому я могу использовать как:

const handleMouseEnter = () => {
  swiper.autoplay.stop();
 };

или как:

const handleMouseEnter = () => {
 swiperRef.current.swiper.autoplay.stop();
};

Это песочница, что у меня есть до сих пор.

Как заставить это работать с помощью Typescript?