hoist-react
hoist-react copied to clipboard
Inline Select with queryFn can not be committed using return key
If you configure an inline Select as below, the user can use the return key to select the highlighted option in the list.
editor: props => selectEditor({
...props,
inputProps: {
options: options
}
})
However, if you use a queryFn as below, the return key no longer selects an option, and instead blurs the input without changing the value:
editor: props => selectEditor({
...props,
inputProps: {
queryFn: () => options
}
})
The keyboard should still be usable to select values when using a queryFn
One workaround that I have used, which works with queryFn , is to add this to the column's ColumnSpec:
agOptions: {
suppressKeyboardEvent: ({event, api}) => {
if (event.key === 'Enter') {
// Prevent grid immediately ending edit so the input can flush its value
wait(50).then(() => api.stopEditing());
return true;
}
return false;
}
}
It would be best if we could somehow work this (or some other fix) into hoist.
We should start by adding the case to the Toolbox inline editing grid (clearly commented).