How to format a CalendarDate

[smozely]

Hi there, not sure if I'm just failing to see it in the docs. But just want to format a CalendarDate in a locale specific way ... and only way I can see to do that is converting it to a JS date and then using the formatter.

Is there a simpler way? since we don't care about the time component at all, converting to a JS date object seems wrong.

[snowystinger]

You are handling it how we would expect.
The formatter can omit the time and timezone, however, a time component is necessary in the construction because you may be rendering the same date object in multiple timezones which may affect the actual date in that timezone or even in another calendar system.
Whether you specify a time with a Date object or not, it always has one https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#date_components_and_time_zones

[smozely]

Cool thanks,

I guess I was looking for CalendarDate equivalent of what seems to be possible in the new Temporal proposal, with PlainDate#toLocaleString

Yeah, understand the current JS Date always has a time, but its annoying for representing something like a birthday which generally has no concept of time so we want it to be the same anywhere in the world, and adding a time just for formatting is fraught :)

[snowystinger]

Makes sense, and thanks for sharing the temporal stuff. I know we took inspiration from it at the beginning. Eventually we should be replacing the work with did with Temporal. I haven't looked in a while to see how far out that is. If you have a proposal for supporting this feature here, I think we could consider it.

[smozely]

This made me look up the proposal a bit more, I see its now stage 3 and a couple of Polyfills have been written already ... so maybe time to cautiously move to using those (was doing this in an early stage POC / Demo anyway so using early software is ok) ... I've gone all in on the react-aria-components so this being in the ecosystem was my first port of call

[devongovett]

FYI the polyfills are quite large which is why we didn't use them. But fwiw, until native browser support is available, the only way to format a date is to convert it to a Date object. That could be done by a tiny utility function or by you but it has to be done somewhere.