Next.js starter your AI actually understands. Ship internal tools in days not weeks. Pre-order $199 $499 → [Get it now]

CoreUI for React v5.11.0 - Search Button & Sidebar Nav Tree

CoreUI for React v5.11.0 - Search Button & Sidebar Nav Tree

We are excited to announce the release of CoreUI for React v5.11.0. This update introduces the new Search Button component, a tree variant for Sidebar Nav, important bug fixes for CDropdown, CTooltip, and CPopover, and refreshed dependencies across the stack.


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.


How to Update

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

  1. Open your project’s package.json.
  2. Locate the @coreui/react entry under dependencies and update the version number to 5.11.0.
  3. Find the @coreui/coreui entry under dependencies and update the version number to ^5.7.0.
  4. Save your changes to the package.json file.
  5. In your project’s root directory, run the update command appropriate for your package manager:
    • For npm users, execute npm install.
    • For yarn users, execute yarn install.
    • For pnpm users, execute pnpm install.

What’s New

Features

  • CSearchButton: New component providing a keyboard-shortcut-aware search trigger button. Displays the platform-appropriate shortcut hint (⌘K on macOS, Ctrl+K on Windows/Linux) and offers a clean, accessible entry point for search interfaces.

  • CSidebarNav - Tree Variant: Added a tree variant to the sidebar navigation, enabling hierarchical tree-style navigation structures. Includes narrow visibility helpers for better responsive behavior in collapsed sidebar states.

Bug Fixes

  • CDropdown: Corrected the default variant prop value from 'btn-group' to 'dropdown', ensuring the component uses proper default styling and behavior.

  • CTooltip & CPopover: Fixed an issue where the onHide callback was incorrectly triggered on initial mount when the component was in a hidden state. The effect now checks for actual visibility before calling handleHide.

Dependency Updates

We have updated key dependencies to their latest compatible versions:

CoreUI Packages

  • @coreui/coreui from: ^5.6.1 to: ^5.7.0
  • @coreui/icons from: ^3.0.1 to: ^3.1.0

Other Updates

  • @typescript-eslint/parser from: ^8.57.2 to: ^8.59.3
  • eslint-plugin-react-hooks from: ^7.0.1 to: ^7.1.1
  • globby from: ^16.1.1 to: ^16.2.0
  • prettier from: ^3.8.1 to: ^3.8.3
  • rollup from: ^4.60.0 to: ^4.60.4
  • sass from: ^1.98.0 to: ^1.99.0
  • ts-jest from: ^29.4.6 to: ^29.4.9
  • typescript-eslint from: ^8.57.2 to: ^8.59.3

Migration Notes

This release includes one behavioral change to be aware of:

  • CDropdown: If your code relied on the incorrect default variant value of 'btn-group', you may need to explicitly pass variant="btn-group" to maintain the previous behavior.

After upgrading:

  1. Install updated dependencies.
  2. Run your test suite and verify the build.
  3. Check any components using CDropdown, CTooltip, or CPopover for changed behavior.
  4. Explore the new CSearchButton and CSidebarNav tree variant in your layouts.

For a comprehensive overview of all changes, enhancements, and updates introduced in this release, please refer to the full changelog on GitHub.