react-slick: rtl is not displaying the items correctly (or none at all)

I’m facing same issues as mentioned in #83 and #926 and #880 and #839 . It seems that the tranform: translate3d and width calculations of .slick-track are off. so when rtl is set to true, you can’t see the slides. If i disable the inline style of translate3d and width it shows all the items.

After playing with the source code a bit (in src/mixins/trackHelper), I think the solution or at least part of it, is to change this block code:

 if (!spec.vertical) {
    if (spec.variableWidth) {
      trackWidth = (spec.slideCount + 2*spec.slidesToShow) * spec.slideWidth;
    } else if (spec.centerMode) {
      trackWidth = (spec.slideCount + 2*(spec.slidesToShow + 1)) * spec.slideWidth;
    } else {
      trackWidth = (spec.slideCount + 2*spec.slidesToShow) * spec.slideWidth;
    }
  } else {
    trackHeight = trackChildren * spec.slideHeight;
  }

To this:

  if (!spec.vertical) {
	if(spec.rtl){ // added condition for rtl
		trackWidth = 0;
	} else if (spec.variableWidth) {
      trackWidth = (spec.slideCount + 2 * spec.slidesToShow) * spec.slideWidth;
    } else if (spec.centerMode) {
      trackWidth = (spec.slideCount + 2 * (spec.slidesToShow + 1)) * spec.slideWidth;
    } else {
      trackWidth = (spec.slideCount + 2 * spec.slidesToShow) * spec.slideWidth;
    }
  } else {
    trackHeight = trackChildren * spec.slideHeight;
  }

and this block code:

  var style = {
    opacity: 1,
    WebkitTransform: !spec.vertical ? 'translate3d(' + spec.left + 'px, 0px, 0px)' : 'translate3d(0px, ' + spec.left + 'px, 0px)',
    transform: !spec.vertical ? 'translate3d(' + spec.left + 'px, 0px, 0px)' : 'translate3d(0px, ' + spec.left + 'px, 0px)',
    transition: '',
    WebkitTransition: '',
    msTransform: !spec.vertical ? 'translateX(' + spec.left + 'px)' : 'translateY(' + spec.left + 'px)',
  };

to this:

  var style = {
    opacity: 1,
    WebkitTransform: !spec.vertical ? 'translate3d(' + (spec.rtl? 0 : spec.left) + 'px, 0px, 0px)' : 'translate3d(0px, ' + spec.left + 'px, 0px)',
    transform: !spec.vertical ? 'translate3d(' + (spec.rtl? 0 : spec.left) + 'px, 0px, 0px)' : 'translate3d(0px, ' + spec.left + 'px, 0px)',
    transition: '',
    WebkitTransition: '',
    msTransform: !spec.vertical ? 'translateX(' + (spec.rtl? 0 : spec.left) + 'px)' : 'translateY(' + spec.left + 'px)'
  };

It would be nice if others can confirm that this solution works well.