5.2.0

🎉 Release v5.2.0

Release Date: December 29, 2025

A major release that modernizes react-big-schedule with React 19 support, improved performance, critical bug fixes, and enhanced developer experience.

---

🚨 Breaking Changes

1. React 19 Support

We've upgraded to React 19.2.3 to leverage the latest features and improvements.

Action Required:

npm install react@^19.2.3 react-dom@^19.2.3
# or
yarn add react@^19.2.3 react-dom@^19.2.3

2. CSS Namespace Change

To prevent style conflicts and improve isolation, all CSS classes have been renamed from react-big-schedule prefix to rbs.

Changes:

Old	New
.react-big-schedule	.rbs
#RBS-Scheduler-root	#rbs-root
.add-more-popover-overlay	.rbs-add-more-popover-overlay

Action Required: If you have custom CSS targeting the old class names, update them to use the new rbs prefix.

3. react-dnd Hooks API Migration

Migrated from legacy DragSource/DropTarget decorators to modern useDrag/useDrop hooks API.

Changes:

• DnDSource constructor no longer accepts a component parameter
• DnDContext constructor no longer accepts a component parameter
• Components now use hooks via wrapper components

Impact: This change primarily affects internal implementation. If you've extended or customized the DnD behavior, review the migration in EventItem.jsx and ResourceEvents.jsx.

---

🐛 Bug Fixes

Critical Fixes

• Memory Leak in SchedulerHeader (#254)

  • Fixed memory leak caused by state updates on unmounted components
  • Added proper cleanup with isMountedRef to prevent crashes

• Infinite Loop in EventItem (#254)

  • Fixed infinite render loop caused by overly broad prop comparison
  • Now only updates state when specific props (left, top, width) change

Security & Best Practices

• Security Enhancement: Added rel="noopener noreferrer" to all external links
• Confirmation Logic: Fixed state updates in Custom Time example to respect user confirmation

---

✨ New Features

Interactive Guide Popups

Added beautiful, animated guide popups to all example pages:

• Auto-dismiss after 10 seconds with visual progress bar
• Modern glassmorphism design with blur effects
• Feature highlights for each example type
• Manual close option for user control

Available in:

• Basic example
• Read-Only example
• Add-More example
• Custom-Time example
• Resize-By-Parent example
• Home page

Code Organization Improvements

• Shared Styles Module: Extracted common styles to src/examples/constants/sharedStyles.js
• URL Constants: Centralized URL management in src/examples/constants/index.js
• Router Configuration: Separated router logic to src/examples/router.jsx with lazy-loading support

---

🎨 Code Quality Improvements

Tooling Enhancements

• Prettier Integration: Added Prettier for consistent code formatting

  • Configuration: 120 char line length, single quotes, semicolons
  • New scripts: format and format:check

• ESLint Modernization: Migrated to flat config (eslint.config.mjs)

  • Updated rules for better developer experience
  • Integrated Prettier plugin
  • Improved ignore patterns

Code Cleanup

• Automatic JSX Runtime: Removed explicit React imports from JSX files
• ESLint Comments: Removed 850+ lines of eslint-disable comments
• Consistent Formatting: All files formatted to project standards
• Better Imports: Improved import organization and structure

---

📦 Dependency Updates

Major Updates

Package	Version
react & react-dom	^19.2.3
react-dnd	^16.0.1
react-dnd-html5-backend	^16.0.1
antd	^5.29.3
react-router-dom	^7.11.0
webpack	^5.104.1

New Dependencies

• prettier ^3.7.4
• eslint-config-prettier ^10.1.8
• eslint-plugin-prettier ^5.5.4

Development Tools

• Updated @babel/core to ^7.26.10
• Updated eslint to ^9.19.0
• Updated various webpack loaders and plugins

---

📝 Documentation

• CHANGELOG: Comprehensive 5.2.0 release notes added
• SECURITY: Updated supported versions to 5.1.0 or greater

---

🔄 Migration Guide

Step 1: Upgrade React

npm install react@^19.2.3 react-dom@^19.2.3

Step 2: Update Custom CSS

Search your codebase for old class names and replace them:

/* Before */
.react-big-schedule { }
.react-big-schedule .header1-text { }

/* After */
.rbs { }
.rbs .header1-text { }

Step 3: Test Your Application

Pay special attention to:

• Custom styles and themes
• Drag-and-drop functionality (if customized)
• Any integration tests

Step 4: Update react-big-schedule

npm install react-big-schedule@^5.2.0

---

📊 Statistics

• Files Changed: 63
• Additions: 2,318 lines
• Deletions: 720 lines
• Net Change: +1,598 lines

---

New Contributors

• @Vedkumar07 made their first contribution in #224
• @kimeggler made their first contribution in #245

---

🙏 Acknowledgments

Thank you to all contributors and users who reported issues and provided feedback!

---

📚 Resources

• Documentation
• Report Issues
• Changelog

Full Changelog: 5.1.0...5.2.0