Sponsored issue: Infinite Loop Renders Duplicate Slides When SlideToShow is Less Than the Number of Slide Elements

When enabling the infinite loop feature on Slick Carousel in React, it appears to render duplicate slides if the slidesToShow prop is set to a value greater than the total number of slide elements passed as children. The duplication occurs, and although the duplicated slides have different data-index values, it leads to unexpected behavior in certain scenarios.

Steps to Reproduce:
1. Include the Slick Carousel component in a React project.
2. Set the infinite prop to true.
3. Set slidesToShow to a value greater than the total number of slide elements.
4. Observe the rendered output

Expected Behaviour:
The infinite loop should work seamlessly without duplicating slides, even when slidesToShow is greater than the total number of slides. It should only not show next and previous button and show single dot.

Environment:
Slick Carousel Version: "^0.29.0"
React Version: "18.2.0"

## Priority Support

- @usmanasif is using [Mintycode](https://mintycode.io) to fund this issue.
- If you would like to accept  bounty for solving this issue join [Mintycode](https://mintycode.io/profile?action=CREATOR_SUPPORT_MODAL&requestId=35f28bdb-8aab-410f-bc27-4bfcd2cdf63a&owner=akiran&name=react-slick).
- Thank you in advance for helping.

[](https://mintycode.io)