AnalyticalTable: Filter menu closed on keypress ENTER

[reqyou]

Hey guys 👋,
I am currently facing the issue that the AnalyticalTable Filter Menu gets closed once I hit ENTER. The problem is the following. I've built a custom filter with a DateRangePicker in it, whose value I can change manually. I would expect that I am able to submit the DateRangePicker value with ENTER, but the Filter Menu is closed before submission. See also the demo I've attached. For me personally this behavior does not make a lot of sense.

Does anyone know how to prevent closing the Filter Menu on press ENTER? Looks like that has also nothing to do with the tanstack react-table implementation.

Thanks guys!!

Best,
reQ

[Lukas742]

Hi @reqyou

the keydown event of the DateRangePicker is bubbling up to the popover. So to prevent closing the popover you can call event.stopPropagation in the respective event handler.

https://codesandbox.io/p/sandbox/at-custom-column-filter-forked-1shce7?file=%2Fsrc%2FApp.js

[reqyou]

Works like charm!! Thank you!