Error with showMonthAndYearPickers={true} in Calendar Component

[sobhankh]

HeroUI Version

2.6.13

Describe the bug

Title:

Error with showMonthAndYearPickers={true} in Calendar Component

---

Description:

Problem:

When using the showMonthAndYearPickers={true} prop with the Calendar component, the following error occurs:

Error: Received an empty string for a boolean attribute `inert`. This will treat the attribute as if it were false. Either pass `false` to silence this warning, or pass `true` if you used an empty string in earlier versions of React to indicate this attribute is true.

Reproduction:

Use the following minimal example:

<Calendar 
  showMonthAndYearPickers={true} 
  aria-label="Date (uncontrolled)" 
/>

Example:

A live reproduction of the issue can be found in this CodeSandbox:
[https://codesandbox.io/p/devbox/test-next-ui-forked-4qwss9?file=%2Fapp%2Fpage.tsx](https://codesandbox.io/p/devbox/test-next-ui-forked-4qwss9?file=%2Fapp%2Fpage.tsx%3A6%2C11)

Expected Behavior:

The Calendar component should render correctly without any errors when showMonthAndYearPickers is set to true.

Environment:

• **React Version:**19
• Next.js Version: 15

Notes:

This issue prevents proper usage of the showMonthAndYearPickers feature. Please provide guidance or a fix.

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

Steps to Reproduce:

1. Import the Calendar component into your project.
2. Render the component with the following code:

   <Calendar 
     showMonthAndYearPickers={true} 
     aria-label="Date (uncontrolled)" 
   />

3. Run the application in your development environment.
4. Open the browser's developer console.
5. Observe the error in the console:

   Error: Received an empty string for a boolean attribute `inert`. This will treat the attribute as if it were false. Either pass `false` to silence this warning, or pass `true` if you used an empty string in earlier versions of React to indicate this attribute is true.
   

Expected behavior

Expected Behavior:

The Calendar component should render without any errors in the console when the showMonthAndYearPickers prop is set to true.

Specifically:

1. The showMonthAndYearPickers prop should enable the functionality to display month and year pickers as expected.
2. No warnings or errors should be logged in the developer console regarding the inert attribute or any other DOM-related issues.

Screenshots or Videos

No response

Operating System Version

windows

Browser

Chrome

[linear]

ENG-1902 Error with showMonthAndYearPickers={true} in Calendar Component

[karavansky]

exactly same error happens with DatePicker and DateRangePicker components
with:
showMonthAndYearPickers={true}

Environment:

• **React Version:**19
• Next.js Version: 15
• @heroui/[email protected]

[robelandro]

I encounter same issue
showMonthAndYearPickers={true}

React 19
Next.js 15
"@heroui/date-picker": "^2.3.10"

is there any solution for this?

[lukasssicevs]

Same issue here.