first commit

src/shared/components/Carousel/Carousel.tsx

@@ -0,0 +1,32 @@
+'use client'
+
+import styles from './Carousel.module.css';
+import {ComponentProps, ReactNode} from "react";
+import Slider from "react-slick";
+import Image from "next/image";
+import sliderArrowLeft from "@/shared/assets/icons/sliderArrowLeft.svg";
+import sliderArrowRight from "@/shared/assets/icons/sliderArrowRight.svg";
+
+type Props = {
+    children: ReactNode
+};
+
+const settings: ComponentProps<typeof Slider> = {
+    infinite: true,
+    speed: 500,
+    slidesToShow: 1,
+    slidesToScroll: 1,
+    lazyLoad: 'progressive',
+    prevArrow: <Image src={sliderArrowLeft} alt={''}/>,
+    nextArrow: <Image src={sliderArrowRight} alt={''}/>,
+};
+
+export function Carousel({children}: Props) {
+    return (
+        <div className={styles.root}>
+            <Slider {...settings}>
+                {children}
+            </Slider>
+        </div>
+    );
+};