Support for Date Picker Combobox pattern

[jaknas]

hello 👋

DatePicker component seems to implement Date Picker Dialog example from APG.

I'm wondering if there's support for Date Picker Combobox pattern. I'm interested in editing the input field while Calendar stays open. Would that be possible to compose using RAC or React Aria hooks? Thanks!

[LFDanLu]

Looking at the example included in those docs, it doesn't actually seem like focus remains in the input field at all times aka once you move into the Dialog focus leaves the input. That means it doesn't directly follow the aria active-descendant pattern our combobox hooks implements where focus remains in the input and the listbox shows "virtual" focus. As such, my gut feeling is that you'd need to create your own hooks for this pattern, cherry picking some stuff from the useComboBox hooks like the keyboard/press handling for opening the popover, some of the input aria props, etc. The Dialog in this case wouldn't use useDialog since it shouldn't auto focus itself on mount so you'd need to have the appropriate role and other dialog specific aria attributes provided by your custom hook, etc. The Calendar itself could probably just be RAC Calendar I'd imagine. useDateFieldState could perhaps be used as is for tracking the selected date, but you'd need to ignore the segment parts of it and construct a plain text representation of the date instead.

All in all, I don't think you'd be able to just use the existing hooks + RAC as is, there is probably a fair amount of customization/tweaking that you'd have to do.