devsgnr-carousel
A lightweight React carousel with 500+ downloads in the first week of release. v2 out soon.

A lightweight React carousel with 500+ downloads in the first week of release. v2 out soon.
I kept it simple, with 45 lines of logic controlling the whole package, super light weight (26.1KB
) for those situation when you just want the functionality. This is a solution I built while working with a friend of mine.
It’s not for everyone especially if you want a little animation. This package is meant to serve as a quick prototype. The snippet below shows switching of the pictures in the carousel after a duration determined by the user, the default value is 3000ms
.
...
/**
* @description useEffect - auto plays with `autoplay` props set true.
* @default false
*/
useEffect(() => {
/**
* @description - creates a setTimeout of the specific `timeout` props
*/
let timer: ReturnType<typeof setTimeout> = setTimeout(goForward, timeout);
!autoPlay && clearTimeout(timer);
/**
* @description - clean up function that clears the setTimeout function preventing unwanted actions within the package
*/
return () => clearTimeout(timer);
}, [autoPlay, goForward, timeout]);
...
Every part of the UI was written in Typescript React, because you can never be too safe. styled-components
and Storybook
to make verifying contribution extremely easy. The package hit +590 downloads in it’s first week of release and holds steady at 20+ downloads per week.