React-slick: "rtl: true" puts slides out of place

Created on 11 May 2018 · 8Comments · Source: akiran/react-slick

Opening new issue since #952 was closed but does not contain a proper solution.

I tried playing with the source and have further narrowed the issue. Didn't succeed in fixing it, but hope the info will help. All applies to rtl: true prop and 'direction=rtl' in the html.

Initial load and first click places first slide off due to incorrect calculation of slidesToOffset here

src/sandbox/react-slick/mixins/trackHelper.js:138

Demo here Initial load should show slides 1, 2 and 3.

stale

Source

mcfoton

👍5

All 8 comments

It's not only the initial load, i think any calculation taking place when rtl is set to true are off.
for example afterChange gives a wrong index.

sag1v on 13 May 2018

@mcfoton why did you close it?

sag1v on 13 May 2018

@sag1v oops. wild clicking. thanks for pointing out.
also agreed, the miscalculation of slidesToOffset affects all other states as well.

mcfoton on 13 May 2018

👍1

also I believe calculations should be fixed here

/react-slick/utils/innerSliderUtils.js:99

spec.currentSlide >= spec.slideCount - spec.slidesToShow

otherwise after we click 'prev' once the 'next' arrow would be disabled
problem is that canGoNext method doesn't seem to receive 'rtl' prop in the 'spec' parameter.

mcfoton on 17 May 2018

Shame there is no much of activity for issues and PR reviews for this component :/

sag1v on 22 May 2018

👍1

@sag1v attached PR. maybe it'll help you in the meantime

mcfoton on 25 Jun 2018

🎉1

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.