¿Cómo renderizar imágenes con React JS utilizando la función map? Este código solo muestra el primer slide, no todos los slides.

Cuando ejecuto el código, sólo muestra la primera diapositiva, pero no muestra el resto de diapositivas. En este código quiero usar la función map para renderizar las diapositivas de imagen y utilizo la flecha “Arrow” para cambiar entre diapositivas, este código muestra sólo la primera diapositiva y las demás están vacías, ¿por qué?
Este es mi código principal:

import { sliderItems } from "../data";

    const Slider = () => {
        const [slideIndex, setSlideIndex] = useState(0);
        const handleClick = (direction) => {
          if (direction === "left") {
            setSlideIndex(slideIndex > 0 ? slideIndex - 1 : 2);
          } else {
            setSlideIndex(slideIndex < 2 ? slideIndex + 1 : 0);
          }
        };
        return (
          <container>
            <arrow direction="left" onclick="{()" ==""> handleClick("left")}>
                <arrowleftoutlined></arrowleftoutlined>
            </arrow>

            <wrapper slideindex="{slideIndex}">
               {sliderItems.map((item) => (
                <slide bg="{item.bg}" key="{item.id}">
                  <imgcontainer>
                    <image src="{item.img}"></image>
                  </imgcontainer>
                  <infocontainer>
                    <title>{item.title}</title>
                    <desc>{item.desc}</desc>
                    <button>{item.btn}</button>
                  </infocontainer>
                </slide>
              ))}
            </wrapper>    


            <arrow direction="right" onclick="{()" ==""> handleClick("right")}>
                <arrowrightoutlined></arrowrightoutlined>
            </arrow>
          </container>
        );
    };

    export default Slider;

Este es mi archivo de datos: ¿por qué no funciona mi código para las otras diapositivas?

export const sliderItems = [

       {
         id: 1,
         img: "https://i.ibb.co/XsdmR2c/1.png",
         title: "VENTA DE VERANO",
         desc: "¡NO COMPROMETAS TU ESTILO! OBTÉN UN DESCUENTO DEL 30% EN NUEVOS ARRIVOS.",
         bg: "f5fafd",
       },
       {
         id: 2,
         img: "https://i.ibb.co/DG69bQ4/2.png",
         title: "COLECCIÓN DE OTOÑO",
         desc: "¡NO COMPROMETAS TU ESTILO! OBTÉN UN DESCUENTO DEL 30% EN NUEVOS ARRIVOS.",
         bg: "fcf1ed",
       },
       {
         id: 3,
         img: "https://i.ibb.co/cXFnLLV/3.png",
         title: "AMOR POR LA ROPA DE CASA",
         desc: "¡NO COMPROMETAS TU ESTILO! OBTÉN UN DESCUENTO DEL 30% EN NUEVOS ARRIVOS.",
         bg: "fbf0f4",
       },
    ];