StackBlitz example: https://stackblitz.com/edit/react-vg8pu5?file=app/main.jsx
If you have a Form <Field component={Input}> inside an <ExpansionPanel>, if you press space or enter within the input, the expansion panel also receives the key event and will expand/collapse. It seems like these key events should not bubble out of the Field component.
In the Checkbox onChange
callback, event.nativeEvent.target.checked
seems to be set differently depending on whether the input was toggled by mouse click or by pressing space.
After clicking on the Checkbox, event.value
and event.nativeEvent.target.checked
will have the same value, consistent with the Checkbox's new state.
After pressing space with the Checkbox focused, event.value
and event.nativeEvent.target.checked
will have different values, with event.value
containing the Checkbox's new state and event.nativeEvent.target.checked
containing the Checkbox's old state.
I would expect event.nativeEvent.target.checked
to be set the same way regardless of whether I am toggling the Checkbox with mouse or keyboard. Furthermore, I would expect event.value
and event.nativeEvent.target.checked
to always be equal to each other.
I made a code sandbox to demonstrate the bug here: https://codesandbox.io/s/kendo-react-checkbox-bug-26f7ur
When the listbox has many items (roughly 200 and growing) the item attribute makes the listbox act slow when you want to click the item.
Even if the item render only returns the same value as not setting the item attribute. It seems like all the items re-render when it gets clicked?
Also in this example https://www.telerik.com/kendo-react-ui/components/listbox/customization/ it is possible to drag and drop a custom item.
But this is not working when we copy exactly the same code from the example. The drag event gets triggered but nothing happens.
Both lists have items to avoid this bug: https://github.com/telerik/kendo-react/issues/1300
I can post my source code but it is literally the same as the example. When we remove the item attribute the drag and drop works again.
Set up a TimePicker with a `min` and `max`. For example
min={new Date(0, 0, 0, 0, 0)} max={new Date(0, 0, 0, 5, 0)}
Click on the text input to focus the 'hours' portion.
Roll the mouse scrollwheel up/down to change the hours.
You can 'scroll' past 5:00 and set the time to anything above the max.
You can also use the keyboard to enter any number outside the min/max.
Is this the expected behavior? Do we always have to add our own validation to check the min/max ourselves?
Hi,
The Telerik example for Inline Editing with Custom Editors uses a dropdown list with reference data hardcoded into the custom dropdown cell. This isn't a realistic scenario for for production code with dynamic reference data. If you pass the reference data for the dropdown to the custom cell then the dropdown loses focus every time you change the selected value. This can be seen by shifting the localizedData in the Telerik example referenced earlier from myDropDownCell.tsx to main and passing it as a parameter: https://stackblitz.com/edit/react-9ycz1i?file=app/main.tsx
Is there a workaround for this issue?
Kind regards,
David