Custom Arrow Plugin Setting Right Arrow Class Incorrectly

[arnonate]

Describe the bug A clear and concise description of what the bug is.

To Reproduce Use the custom arrows plugin:

plugins={[
              {
                resolve: arrowsPlugin,
                options: {
                  arrowLeft: (
                    <Styles.Arrow>
                      <GatsbyImage
                        image={images.left.childImageSharp.gatsbyImageData}
                        alt="left arrow"
                      />
                    </Styles.Arrow>
                  ),
                  // arrowLeftDisabled:<button><Icon name="angle-left" /></button>,
                  arrowRight: (
                    <Styles.Arrow>
                      <GatsbyImage
                        image={images.right.childImageSharp.gatsbyImageData}
                        alt="right arrow"
                      />
                    </Styles.Arrow>
                  ),
                  // arrowRightDisabled: <button><Icon name="angle-right" /></button>,
                  addArrowClickHandler: true,
                },
              },
            ]}

Inspect the DOM. Both arrows get the classList BrainhubCarousel__customArrows BrainhubCarousel__custom-arrowLeft

Expected behavior The right arrow should have a custom-arrowRight class applied.

Screenshots

Environment System: OS: macOS 10.15.7 CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz Memory: 353.86 MB / 16.00 GB Shell: 5.7.1 - /bin/zsh Binaries: Node: 12.19.0 - ~/.nvm/versions/node/v12.19.0/bin/node Yarn: 1.22.5 - ~/.yarn/bin/yarn npm: 6.14.8 - ~/.nvm/versions/node/v12.19.0/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman Browsers: Chrome: 90.0.4430.212 Firefox: 84.0.2 Firefox Developer Edition: 85.0 Safari: 14.0 npmPackages: @brainhubeu/react-carousel: ^2.0.3 => 2.0.3

[ArcanumLibella]

Hi ! I have the same issue !

[andredaniel]

+1

[klijakub]

+1