brainhubeu / react-carousel

A pure extendable React carousel, powered by Brainhub (craftsmen who ❤️ JS)
https://brainhub.eu/
MIT License
1.07k stars 164 forks source link

`CarouselProps` plugins v2 not working with a typescript project #656

Open lovrobiljeskovic opened 3 years ago

lovrobiljeskovic commented 3 years ago

Describe the bug I've add the react-carousel and the @types package to my typescript project.

I've implemented the carousel as follows:

import React, { FC } from "react";
import Carousel, { autoplayPlugin } from "@brainhubeu/react-carousel";
import "@brainhubeu/react-carousel/lib/style.css";

export const CarouselComponent: FC = () => {
  return (
    <div>
      <Carousel
        plugins={[
          "infinite",
          "arrows",
          {
            resolve: autoplayPlugin,
            options: {
              interval: 2000,
            },
          },
        ]}
        animationSpeed={1000}
        draggable={false}
      >
        <div>
          <h1>Section 1</h1>
        </div>
        <div>
          <h1>Section 2</h1>
        </div>
        <div>
          <h1>Section 3</h1>
        </div>
      </Carousel>
    </div>
  );
};

However none of the props seem to be applied. For reference, the draggable prop works as intended. Am I missing something?

aleksbalev commented 3 years ago

Same

iceColdChris commented 3 years ago

I am also running into this issue trying to use the arrow plugin, The command initially installed the typings for v2 but v1 of the library itself, Upon updating both to v2 I found that the plugins prop is being ignored

adiesel commented 3 years ago

We have the same problem. We switched to v 1.19.26 to use the arrows =/

iceColdChris commented 3 years ago

We have the same problem. We switched to v 1.19.26 to use the arrows =/

I found that this was the solution that worked for me as well

CristhianParra commented 3 years ago

Downgrade a version and it's working for me
npm i @brainhubeu/react-carousel@^2.0.1

Amheklerior commented 3 years ago

I've had the same issue using v2 of the library in a react/typescript project.

I solved the issue downgrading react and react-dom versions to match the peer dependencies of the library: 16.8.0.

I put more details here: https://github.com/brainhubeu/react-carousel/issues/637#issuecomment-769775003