Description
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