Uncaught TypeError: Cannot read property 'defaults' of undefined at getParams in Swiper React

[storesbuzz]

I am trying use swiper react with typescript (4.3.5) but getting error.
swiper - "^6.8.0"
"react": "^17.0.0"

Uncaught TypeError: Cannot read property 'defaults' of undefined
    at getParams (webpack-internal:///./node_modules/swiper/esm/react/get-params.js:24)
    at eval (webpack-internal:///./node_modules/swiper/esm/react/swiper.js:66)
    at renderWithHooks (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:14985)
    at updateForwardRef (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:17044)
    at beginWork (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:19098)
    at HTMLUnknownElement.callCallback (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:3945)
    at Object.invokeGuardedCallbackDev (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:3994)
    at invokeGuardedCallback (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:4056)
    at beginWork$1 (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:23959)
    at performUnitOfWork (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:22771)

Here is way I added swiper in component -

import {useRef} from "react";
import {Swiper, SwiperSlide} from "swiper/react";
import SwiperCore, {Navigation} from "swiper";
import "swiper/swiper-bundle.css";

type props = {
};

const Wrapper = ({}: props): JSX.Element => {

    // const prevRef = useRef(null);
    // const nextRef = useRef(null);

    return (

            <Swiper
                id="slider"
                tag="section"
                wrapperTag="ul"
            >
                  <SwiperSlide  tag="li">1</SwiperSlide>
                  <SwiperSlide  tag="li">2</SwiperSlide>
                  <SwiperSlide  tag="li">3</SwiperSlide>
            </Swiper>

here is snap from get-params where Swiper.defaults shows error

// eslint-disable-next-line
import Swiper from '../../core';
import { isObject, extend } from './utils';
import { paramsList } from './params-list';

function getParams(obj) {
  if (obj === void 0) {
    obj = {};
  }

  var params = {
    on: {}
  };
  var events = {};
  var passedParams = {};
  extend(params, Swiper.defaults);
  extend(params, Swiper.extendedDefaults);
  params._emitClasses = true;
  params.init = false;