Using react-image-magnify with react-slick

Question

I have a slider made on react-slick, I want to add a zoom effect on mouse hover. But the enlarged picture appears inside the slider itself. If you specify overflow: visible in the style; everything works correctly, if there is more than one picture in the slider, then all the pictures also go beyond the slider. how do i fix this?

import React, { useState } from 'react';
import Slider from 'react-slick';
import "../../assets/styles/slider.css"
import ReactImageMagnify from 'react-image-magnify';

export default function DetailSlider({ data }) {
  const [nav1, setNav1] = useState();
  const [nav2, setNav2] = useState();
  const image_url = `https://s3.eu-central-1.amazonaws.com/uploads.avtopro.general/`

  return (
    <div className="detailSlider">
      <Slider asNavFor={nav2} ref={(slider1) => setNav1(slider1)} className="mainSlider">
        {
          data?.images?.map((item) => (
            <div className='oneImg' key={item.id}>
                <ReactImageMagnify {...{
                    smallImage: {
                        alt: 'Image',
                        isFluidWidth: true,
                        src: `${image_url + item?.directory + "/" + item?.file_name}`
                    },
                    largeImage: {
                        src: `${image_url + item?.directory + "/" + item?.file_name}`,
                        width: 1200,
                        height: 1800
                    }
                }} />
            </div>
          ))
        }
      </Slider>
      <Slider
        asNavFor={nav1}
        ref={(slider2) => setNav2(slider2)}
        slidesToShow={data?.images?.length}
        swipeToSlide={true}
        focusOnSelect={true}
        className="smallImages"
      >
        {
          data?.images?.map((item) => (
            <div className='smallImg ' key={item.id}>
              <img src={image_url + item?.directory + "/" + item?.file_name} alt="img" />
            </div>
          ))
        }

      </Slider>
    </div>
  );
}