react-indiana-drag-scroll
use-scroll-direction
Our great sponsors
react-indiana-drag-scroll | use-scroll-direction | |
---|---|---|
1 | 1 | |
485 | 30 | |
- | - | |
0.0 | 0.0 | |
over 1 year ago | over 1 year ago | |
TypeScript | TypeScript | |
GNU General Public License v3.0 or later | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
react-indiana-drag-scroll
-
I wasted two days jerry-rigging a package when the solution was one search away
At first, I was going to use react-indiana-drag-scroll to solve the first problem. And it worked. But I had a feeling that there might be a solution that solved both of these problems at the same time. Searching on libhunt, openbase, and duckduckgo, I found out that this problem is actually very old and the term that better fit my problem was "pan and zoom". Searching with this term, I stumbled upon react-pan-and-zoom-hoc, which helped solve my problem, but it was difficult to fidget with because rather than having a simple component, the component spit out the correct x, y axes translation that would need to be worked into the component's CSS. No bueno. I attempted to jerry-rig this package for two days before giving up and switching to react-svg-pan-zoom, which worked pretty much instantly and was exactly what I needed.
use-scroll-direction
-
use-scroll-direction: A hook for simple detecting of scroll direction
use-scroll-direction https://github.com/AndrzejSala/use-scroll-direction As frontend devs, very often, we come to moment when we need to show/hide something on scroll, eg. topbar or some infobox. Based on the API provided by a browser it's not an easy task, we need to make some computation, store somewhere the previous direction and be sure that everything works correctly vast of browsers. To make our lives a little bit easier, at least for react devs, I created use-scroll-direction, a simple, though very performant hook for detecting scroll direction. Here are some key points:
What are some alternatives?
react-hexgrid - Build interactive hexagon grids with React
react-use-wizard - 🧙 A React wizard (stepper) builder without the hassle, powered by hooks.
splide - Splide is a lightweight, flexible and accessible slider/carousel written in TypeScript. No dependencies, no Lighthouse errors.
react-intersection-observer - React implementation of the Intersection Observer API to tell you when an element enters or leaves the viewport.
react-pan-and-zoom-hoc
react-keyboard-navigator - A suite of React components and hook for selecting sibling components through the keyboard.
react-svg-pan-zoom - :eyes: A React component that adds pan and zoom features to SVG
use-scroll-position - Use scroll position ReactJS hook done right
svelte-gesture - 👇 Bread n butter utility for component-tied mouse/touch gestures in Svelte.
react-cool-inview - 😎 🖥️ React hook to monitor an element enters or leaves the viewport (or another element).
React horizontal scrolling menu - Horizontal scrolling menu component for React.
react-winbox - The newest React component for WinBox.js. A window manager for React.