react-scroll-direction

What's New in @smakss/react-scroll-direction v3.0.2 🚀

🛠 Fixes

• Husky Pre-Install Hook: We've ironed out the wrinkles in our installation process. Now, when you install @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. 🐶✨

📚 Developer Experience

• 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! 🐛🔨

How to Use the Setup Script

After pulling the latest changes for development:

yarn setup

🔁 This will set up your development environment without affecting the package users.

Acknowledgements

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! 🎉🙌

Remove unknown badges.

🚀 Features and Improvements:

• 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.

Release Notes

In our continuous effort to improve the package's functionality and usability, we're delighted to announce the following updates:

• 🏷️ Exporting Types as Declaration Files: To ensure maximum TypeScript support, we have included type declaration (.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.

Release Notes

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.

⚠️ Breaking Changes

• ♻️ Importing the Custom Hook: In this version, we've changed how you import the 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.

Release Notes

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.

⚠️ Breaking Changes

• Please note, from this version onwards, the return type of the custom hook has been changed. It will now return a 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.

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.

Now this will work on x direction scrolls