Improved TypeScript version

[mindplay-dk]

Hi there,

Thank you for an absolutely brilliant starting point! :-)

I love the simple, elegant approach you took with this - and decided to continue with some changes and features I needed in my own project:

• Ported to TypeScript.
• Touch/drag interactions improved and simplified.
• Virtualized slides: only 4 slides are physically in the DOM at one time, so you effectively get lazy-loading of images, iframes, etc.
• Seamless loop: the last slide appears to be located before the first.

Note that I also removed some features and all of the options - and added a simple, public API, so that the parent example gallery component can send commands using a ref.

The whole things is still somehow only 200 lines of code ;-)

I'll just post it here for you and others to enjoy:

https://stackblitz.com/edit/react-slider-ttttt

Of course, feel free to use this under MIT, same as how you published it :-)

Thanks again!

[Stanko]

Hey @mindplay-dk,
This is awesome! Thank you for sharing 🙂 I wrote this thing couple of years ago, and I never got to refactor it and publish it.

I think you should package this thing up and publish it to npm. I'll link this issue in the readme.

Cheers!

EDIT: https://github.com/Stanko/react-slider#typescript-version

[mindplay-dk]

I think you should package this thing up and publish it to npm

Thanks for the vote of confidence :-)

But I have a very pragmatic point of view when it comes to UI code: unless it's something substantially more complex than this, I rarely build for reuse, because UI behavior/details is usually where projects differ the most. I prefer building for the exact requirements of the use-case - and I'm perfectly comfortable copy/pasting 200 lines of code and maintaining another copy with customizations for the exact case.

If somebody wants a packaged version, it's in the open source domain, and they can feel free - I personally wouldn't use a package for something this small 😉