Skip to content

Initial Release: React Resize Detector Context v0.1.0

Choose a tag to compare

@smartlabsAT smartlabsAT released this 09 Feb 22:50
· 51 commits to main since this release

This release introduces a lightweight, flexible, and fully TypeScript-powered solution to handle responsive breakpoints in your React applications. Built on top of react-resize-detector, this package provides:
• Responsive Breakpoint Detection: Dynamically determines the active breakpoint based on an element’s width.
• Utility Methods:
• isAtLeast(breakpoint): Checks if the active breakpoint is greater than or equal to a specified breakpoint.
• isBelow(breakpoint): Checks if the active breakpoint is lower than a specified breakpoint.
• valueByBreakpoint(mapping): Retrieves a value from a provided mapping object based on the current breakpoint.
• Conditional Rendering: Use the BreakpointConditional component to render content only when specific breakpoint conditions are met.
• Custom Breakpoints Support: Whether you use standard breakpoints like “XS”, “SM”, “MD”, “LG”, “XL” or define your own (e.g., “Smart”, “Mini”, “Sedan”, etc.), the package sorts and applies them correctly.
• Comprehensive Documentation & Examples: Detailed API documentation, code examples, and Storybook demos are provided to ensure seamless integration into your projects.
• Robust Testing: Full test coverage with Vitest guarantees reliability.

We welcome contributions, feedback, and suggestions as we continue to improve this package. Thank you for using React Resize Detector Context – happy coding! 🚀