CoreUI PRO for React v5.19.0

We are thrilled to announce CoreUI PRO for React v5.19.0 — a significant accessibility-focused release that enhances the Autocomplete and Multi Select components with comprehensive ARIA support, improved keyboard navigation, and better screen reader compatibility.

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 Upgrade

To update your project to CoreUI PRO for React v5.19.0, follow these steps:

1. Open your package.json.
2. Update the following dependencies:
   • @coreui/react-pro to 5.19.0
   • @coreui/coreui-pro to 5.17.0
3. Save the file.
4. Run your package manager:
   • npm: npm install
   • yarn: yarn install

🚀 What’s New

♿ Accessibility Enhancements

CAutocomplete

• Enhanced ARIA Support: Added comprehensive ARIA attributes for better screen reader compatibility
  • aria-selected and aria-disabled attributes on individual options
  • aria-owns attribute when using portal mode to maintain semantic relationships
• Improved Portal Accessibility: Proper DOM relationship handling when dropdown is rendered outside normal flow
• JSDoc Documentation: Added detailed documentation for container and portal props

CMultiSelect

• Complete ARIA Implementation: Full WAI-ARIA compliance for multi-select pattern
  • role="combobox" on main input/toggler with aria-haspopup="listbox"
  • role="listbox" on dropdown container with aria-multiselectable="true"
  • aria-selected and aria-disabled attributes on individual options
  • aria-owns support for portal mode connections
• New Accessibility Props: Added ariaIndicatorLabel prop for customizable indicator button labeling
• Enhanced Documentation: Comprehensive accessibility section with best practices and implementation guide

🛠 Code Quality Improvements

• Boolean Props Optimization: Simplified boolean prop syntax across all Autocomplete examples (e.g., disabled={true} → disabled)
• Type Safety: Improved TypeScript type definitions for ARIA attributes with proper boolean conversion

📚 Documentation Updates

Multi Select Documentation

• New Accessibility Section: Comprehensive guide covering:
  • Built-in accessibility features and ARIA roles
  • Customizable accessibility labels (ariaCleanerLabel, ariaIndicatorLabel)
  • Complete ARIA attributes reference
  • Keyboard navigation guide with interactive table
  • Best practices for accessible implementation
  • Practical code examples demonstrating proper usage

Code Examples

• Streamlined Boolean Props: Updated all boolean properties to use shorter syntax for cleaner code
• Accessibility Examples: Added practical examples showing proper labeling and validation patterns

🎯 Accessibility Features Summary

Screen Reader Support

• Proper semantic roles and relationships
• Dynamic state announcements
• Descriptive labels for all interactive elements

Keyboard Navigation

• Full keyboard accessibility with Tab, Enter/Space, Arrow keys
• Escape key support for closing dropdowns
• Backspace/Delete support for item removal

ARIA Compliance

• WAI-ARIA 1.2 compliant implementation
• Proper state management with aria-expanded, aria-selected, aria-disabled
• Portal mode support with aria-owns relationships

💡 Migration Notes

New Props

The following new accessibility props are available:

// Multi Select
<CMultiSelect
  ariaCleanerLabel="Clear all selected items"
  ariaIndicatorLabel="Toggle options menu"
  // ... other props
/>

No Breaking Changes

All changes are backward compatible. Existing implementations will continue to work without modifications while benefiting from the enhanced accessibility features.

📦 Dependency Updates

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

Core Dependencies

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

Build & Development Tools

• Updated @rollup/plugin-typescript from ^12.1.4 to ^12.1.6
• Updated @testing-library/dom from ^10.4.1 to ^10.4.2
• Updated @testing-library/jest-dom from ^6.6.4 to ^6.6.5
• Updated @typescript-eslint/parser from ^8.38.0 to ^8.42.0
• Updated eslint from ^9.32.0 to ^9.36.0
• Updated eslint-config-prettier from ^10.1.8 to ^10.2.0
• Updated eslint-plugin-prettier from ^5.5.3 to ^5.6.1
• Updated eslint-plugin-unicorn from ^60.0.0 to ^60.1.0
• Updated globals from ^16.3.0 to ^16.4.0
• Updated lerna from ^8.2.3 to ^8.3.1
• Updated prettier from ^3.6.2 to ^3.7.1
• Updated rollup from ^4.46.0 to ^4.48.0
• Updated typescript-eslint from ^8.38.0 to ^8.42.0

Upgrade to CoreUI PRO for React v5.19.0 today to provide your users with a more accessible and inclusive experience. This release represents our commitment to making CoreUI components usable by everyone, including users with assistive technologies.