Detect scroll direction in react applications.
MIT License
Published by SMAKSS 12 months ago
@smakss/react-scroll-direction
, it won't try to set up husky hooks only meant for development. This means smoother sailing when you add it to your project. πΆβ¨New Setup Script: To make life easier for our contributors, we've added a new npm run setup
script. This handy tool will set up all the dev goodies you need, including those pesky git hooks, so you can focus on what you do best: coding! π οΈπ»
Issue Template: To streamline issue reporting, we've introduced a shiny new issue template. Now, when you spot something amiss and need to tell us, it's as easy as filling in the blank. Your detailed reports help us squash bugs faster! ππ¨
After pulling the latest changes for development:
yarn setup
π This will set up your development environment without affecting the package users.
A big shout out to our community for your patience and all the contributors helping us improve, and special thanks to @RamanSharma100. Keep the feedback coming! ππ
Published by SMAKSS about 1 year ago
Remove unknown badges.
Published by SMAKSS about 1 year ago
Simplified Hook Usage: With the addition of default assignments to props, you can now seamlessly employ useDetectScroll
without passing an empty object for default options.
const scrollDir = useDetectScroll();
SSR Compatibility: Addressing the issue where the useDetectScroll
hook utilized the window object to establish the initial value of lastScroll
, causing a ReferenceError
during server-side rendering in platforms like Next.js, we've introduced a fix. The solution initializes lastScroll
to 0
and repositions the window object reference within the useEffect
hook, ensuring it's solely accessed on the client-side, thus sidestepping the error.
Upgraded Dependencies: In our commitment to maintaining current, we've updated our package dependencies.
π Pull Request Template: A PR template has been embedded to streamline and standardize the pull request process, ensuring consistent quality and clarity.
PR Checks CI: Every pull request will now undergo a rigorous CI check aimed at maintaining code quality and flagging any errors, ensuring that the codebase remains robust and efficient.
Pre-commit Hooks: To further our drive towards excellence, we've embedded pre-commit hooks. These are tailored to check types, formatting, and commit messages, ensuring the highest standards are maintained even before code hits the repository.
Thank you for your unwavering support and contributions. They're invaluable in our journey of refining and improving this package. Should you have queries or feedback regarding this release, please reach out; we're all ears.
Also, a special thanks to @drichar for their contribution to this release.
Published by SMAKSS over 1 year ago
In our continuous effort to improve the package's functionality and usability, we're delighted to announce the following updates:
.d.ts
) files in our distribution (dist
) folder. This step enhances the TypeScript experience by providing better type-checking and autocompletion when using our package.This update enables TypeScript users to directly access the type information of the library, allowing for robust, type-safe coding experiences. These .d.ts
files are automatically included in the npm package, so you don't need to add anything extra to your TypeScript configuration to benefit from them.
Thank you for your continued support and for helping us improve this package. Please don't hesitate to reach out if you have any questions or feedback about this release.
Published by SMAKSS over 1 year ago
We're excited to announce a few important updates that aim to improve the organization and usage of our package:
π Folder Hierarchy Change: We've restructured the folder hierarchy for better organization and to follow best practices. This change should make the project structure more transparent and more intuitive, thus improving the overall developer experience.
π·οΈ Exported Types: We are now exporting our types for enhanced usability and consistency across your projects. You can now import and utilize Axis
and Direction
in other parts of your application as needed.
useDetectScroll
custom hook. Previously, it was a named import (import { useDetectScroll } from '@smakss/react-scroll-direction';
). However, it should now be imported as a default import (import useDetectScroll from '@smakss/react-scroll-direction';
). Please update your import statements to reflect this change.As always, thank you for your support and understanding as we continue improving. We hope these changes provide a more efficient and effective development experience. If you have any questions or need assistance, please don't hesitate to reach out.
Published by SMAKSS over 1 year ago
In this update, we've made some significant changes to enhance our application's functionality, usability and maintainability. Here's what's new:
β¬οΈ Updated Dependencies: All development dependencies have been updated to the latest stable versions. This provides better performance and ensures that we are taking advantage of the most recent advancements in each library.
π Typescript Migration: The entire application has been refactored to use Typescript. By leveraging Typescript's static typing and advanced language features, we're enhancing both code quality and developer experience.
π Added JSDoc: We have added JSDoc comments for the essential parts of our custom hook, providing clear, comprehensive documentation right in the code. We've also included an example to demonstrate its usage, making it easier for developers to understand and use our hook in their applications.
π Performance Improvements: We have optimized the performance of our custom hook through memoization. This prevents unnecessary re-renders, making our application run more efficiently and smoothly. You should notice a significant improvement in the speed and responsiveness of your application as a result.
π Updated Readme: Our Readme file has been updated to reflect all the recent changes. We believe in keeping our documentation up-to-date and easy to understand, enabling you to make the most of our application.
String
instead of String[]
(an array of a single string). This change simplifies the usage of the hook and reduces unnecessary complexity. Please update your code to accommodate this change.Published by SMAKSS over 1 year ago
Migrate the complete functionality to Typescript. Also, I optimised the custom hook functionality and prevented potential unnecessary rerenders and used memoisation technics to avoid setting elements at every render.
Published by SMAKSS over 1 year ago
Published by SMAKSS almost 2 years ago
Published by SMAKSS almost 2 years ago
Published by SMAKSS almost 2 years ago
Published by SMAKSS almost 2 years ago
Published by SMAKSS about 2 years ago
Now this will work on x
direction scrolls
Published by SMAKSS about 2 years ago
Published by SMAKSS about 2 years ago
Published by SMAKSS about 2 years ago
Published by SMAKSS about 2 years ago
Published by SMAKSS about 2 years ago
Published by SMAKSS about 2 years ago
Published by SMAKSS about 2 years ago