akiran / akiran/react-slick

`infinite` doesn't play nicely with `variableWidth` and `focusOnSelect`

Open
#1,905 3 comments 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
11.9k
Forks
2.1k
PR merge metrics
No merged PRs in 30d

Description

### Intention
I am trying to create an **infinite** slider that will display a set of items, where the items have **variable width** and a click item gets **focus on select** (moves to left edge of slider component) when clicked.

### Problem
In many (but not all cases), Slick React scrolls to cloned version of the clicked item, instead of the item itself.
[See example](https://codesandbox.io/s/react-slick-playground-forked-0t02t).

What's working:
* From index 0 (start), click on item -1 (left of item 0, visible because `overflow: visible`)
* From item -1, click on item 0
* From item -1, click on item 1
* From item -1, click on item 2

What's not working:
* From item 0, click on item 1 => scrolls to wrong item
* From item 1, click on item 2 => scrolls to wrong item
* From item -1, click on item -2 => scrolls to wrong item

(these lists are not exhaustive, obviously, just as an example)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.