CoreUI PRO for Vue v5.14.0

We are pleased to announce the release of CoreUI PRO for Vue v5.14.0 — a focused update that introduces the previewDateOnHover functionality to date picker components, along with important dependency updates and development tool improvements.

Speed up your responsive apps and websites with fully-featured, ready-to-use open-source admin panel templates—free to use and built for efficiency.

Angular

Bootstrap

React.js

Vue.js

How to Update

To update to CoreUI PRO for Vue v5.14.0, follow these steps:

1. Open your package.json file.
2. Update the @coreui/vue-pro dependency to 5.14.0.
3. Update the @coreui/coreui-pro dependency to 5.18.0.
4. Save your changes.
5. Run the appropriate command for your package manager:
   • npm: npm install
   • yarn: yarn install

🚀 What’s New

✨ New Features

CDatePicker & CDateRangePicker

• Preview Date on Hover: Added previewDateOnHover prop to enable or disable live preview of dates in input fields when hovering over calendar cells
  • Enhances user experience by providing visual feedback during date selection
  • Defaults to true for better user interaction
  • Allows developers to disable the feature for more minimal interfaces
  • Seamlessly integrated with existing date picker functionality

<!-- Enable live preview when hovering over calendar dates (default) -->
<CDatePicker :preview-date-on-hover="true" />

<!-- Disable preview for cleaner interaction -->
<CDateRangePicker :preview-date-on-hover="false" />

🛠 Enhanced User Experience

• Visual Feedback: Users can see a preview of selected dates in the input field while hovering over calendar cells
• Improved Accessibility: Better visual cues for date selection process
• Flexible Control: Developers can enable or disable this feature based on their design requirements
• Performance Optimized: Smooth hover interactions without impacting calendar performance

📦 Dependency Updates

This release includes important dependency updates for enhanced performance, security, and compatibility:

Core Dependencies

• Updated @coreui/coreui-pro from ^5.17.0 to ^5.18.0

Development Tools

• Updated cross-env from ^7.0.3 to ^10.0.0
• Updated eslint from ^9.32.0 to ^9.33.0
• Updated eslint-plugin-prettier from ^5.5.3 to ^5.5.4
• Updated sass from ^1.89.2 to ^1.90.0
• Updated typescript-eslint from ^8.38.0 to ^8.39.0

💡 Migration Notes

New Props

The following new prop is available for date picker components:

<!-- Date Picker with hover preview -->
<CDatePicker :preview-date-on-hover="true" />

<!-- Date Range Picker with disabled hover preview -->
<CDateRangePicker  :preview-date-on-hover="false" />

No Breaking Changes

All changes are backward compatible. Existing date picker implementations will continue to work without modifications while benefiting from the enhanced hover preview functionality by default.

📖 Technical Details

The previewDateOnHover feature is implemented with:

• Optimized event handling for smooth hover interactions
• Proper cleanup of preview states when hovering ends
• Integration with existing validation and formatting logic
• Support for both single date and date range selections
• TypeScript support with proper prop definitions

API Documentation

• Updated API documentation for both CDatePicker and CDateRangePicker components
• Added comprehensive prop descriptions and usage examples
• Enhanced developer documentation with practical implementation guides

Upgrade to CoreUI PRO for Vue v5.14.0 today to provide your users with enhanced date selection experiences. This release continues our commitment to improving user interface components with thoughtful, user-centric features while maintaining backward compatibility and performance.

📚 Learn More

For detailed documentation and implementation examples, visit:

• CoreUI Vue Documentation