Extending aria-label in CalendarCell

[cbodin]

Provide a general summary of the feature here

Allow for some way to extend the aria-label of a CalendarCell without using the render prop.

🤔 Expected Behavior?

A prop or something else for adding extra strings to the aria-label of a CalendarCell.

😯 Current Behavior

Currently the only way i found was to override the render function of the CalendarCell but that would mean re-implementing all the aria-label translations for all the different states a cell can be in.

💁 Possible Solution

Maybe add an additional prop to add some extra context to the aria label? That could be inserted before the "current"/"First available date" text?

extraAriaLabelContext?: string;

`Wednesday, February 5, 2020, ${extraAriaLabelContext} selected`
`Thursday, March 5, 2026, ${extraAriaLabelContext} First available date`

That would allow for a string like:
Wednesday, February 5, 2020, 19 euro, selected

🔦 Context

I'm trying to add additional data in each CalendarCell. More precisely, prices.

💻 Examples

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[reidbarber]

I think ideally, aria-describedby could be used for this. This would allow you to supplement the accessible description without overriding the label. However, it currently gets filtered out via filterDOMProps. We don't pass labelable: true into filterDOMProps for CalendarCell since these aren't expected to be user-provided. If we passed in propNames: new Set(['aria-describedby']), then it would work, but I think we'd need to be thoughtful about this and if there are any other cases it would be appropriate for.

[cbodin]

Yeah, that sounds like a good solution. I have another case coming up where i need to show "soon fully booked". That's pretty hard to announce to screenreaders without some additional props on the cells.

Something like this:
https://wpbookingcalendar.com/wp-content/uploads/2025/07/wp-booking-calendar-appointments-768x598.png