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