If the zoom property is set on the body element for a preset zoom your window control does not seem to correctly take this zoom into account for the position and width/height of the window. You can easily recreate this in the following example application: https://stackblitz.com/edit/react-qmwfbf-fzmj98?file=app%2Fapp.tsx,index.html
Simply open the window using the button and then maximize the window in the title bar at the top. You can see that the width/height calculation is much too large and is not correctly maximized to the available space. You can also see this in the attached video.
A similar problem has already been reported here for popups https://github.com/telerik/kendo-react/issues/2320 and there is also a solution for this using the scale property in the PopupProps here:
<PopupPropsContext.Provider
value={(props) => ({
...props,
scale: 1.25,
})}
>
Please add exactly the same scale property for the WindowProps.
When your window control closes, focus returns to the element that invoked the window unless it is very unlikely users need to immediately reinvoke the window.
We use your window control as a popup search dialog. Our customers search for their data there, close the popup and then return to a dialog with lots of input fields.
The user had previously focused on one of these input fields and would like to have the focus back in this input field after closing the popup.
Which has worked wonderfully up to and including your version 8.0.0.
Unfortunately, this no longer works since version 8.1.0 and instead of the input field, only the button that previously opened the popup is focused. This change from the changelog seems to be responsible for this: "window: update focus management and kb navigation to match the ARIA spec".
It seems that your change uses a setTimeout internally, which keeps taking the focus away from our input field.
You can reproduce this behavior in a demo application. The first application is based on version 8.3.0 and you can reproduce the problem there by pressing the button and closing the opened popup. The focus that was previously in the input field is then on the button. Here: https://stackblitz.com/edit/react-xdpeqc-nycw86?file=app%2Fapp.tsx,package.json
In the second application based on version 8.0.0, you can see that the same process sets the focus directly back to the input field. Here: https://stackblitz.com/edit/react-xdpeqc-yab7m8?file=package.json,app%2Fapp.tsx
Nowhere in the ARIA specification here does it say that you should use a setTimeout to steal the user's focus again at a later time in order to set it on the button that opened the popup. On the contrary, point 2.1 describes exactly what we need:
You already had this feature in version 8.0.0 and could offer it again as a property with very little implementation effort. Please consider to add this old behaviour as a Window Prop again.
In the jQuery version of the scheduler, there is an option to disable snapping and to allow free move of the events.
How to achieve this behaviour in the React version?
When typing into a date picker and trying to type Feb 29th, 2024 (or any other leap year ofc) the date is updated incorrectly by the kendo date picker validation. As the user types the year their previous entry of 29 is updated to 28. This should update check should probably not occur until the user is done updating the input. If there is some fix or workaround we can do on our end to resolve this issue please let us know
Here's a video of the bug in our application
However, I was also able to reproduce the exact same behavior even in the documentation:
Our client requirement is they need to modify any dates using datepicker.
For example
if 11/11/2024 need to change 11/12/2024
just a single one digit change is not permitted we need to type 12 which is 2 digit change that means complete day
same happens for month and year as well
We found Carbon-date-picker provides similar functionality which solves our requirement where we can modify each and every digit of datepicker element
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.
I'm in need of the format Year/WeekOfTheYear/DayOfTheWeek for the date range picker. Ex. 2024/44/3, meaning the year 2024 week 44 day Wednesday.
This is not supported currently, please vote for it's implementation if format support has been an issue for you too.
Hello,
i am new to React and Kendo React UI.
I am reading the documentation for Gantt, and if i understand it correctly i can customize header column (headerCell?), but I dont know how. Is there any examle ?
I wound like to customize the column with dates.
Thank you, Matjaz Reberc
Dear Sir/Madam,
We are piloting our application and repeatedly get the same feedback from our users: they find entering information in the date and time inputs annoying.
The reason for this is that they have to enter a date (say 1 december 2024) by entering:
Instead, they would like to enter a date in one go, say
Likewise, they would enter times like "1005" for "10:05". Now they have to enter ":" to go to the minutes field.
We would like to respond to their feedback, but don't know to implement this. Is this something that Kendo supports? If not, we are willing to pay to give this feature request priority. Could you help us out?
Regards,
Peter
To demonstrate:
1. Open your simplest interactivity/selection demo, which is not grouped, in StackBlitz. See: https://www.telerik.com/kendo-react-ui/components/grid/interactivity/selection/
2. Add the Grid's group prop. To demonstrate the bug nothing else needs changed
<Grid group={[]} ...
3. Run demo, scroll down and pick a row.
4. Observe the grid scrolls to the top and you cannot see your selected row unless you scroll back.
Hi!
I have noticed that keyboard navigation doesn't work in the filter editor components inside the Filter component
Reproduction:
Is there a way to enable it or go around it?
Actual results:
Aria label attribute is not defined for button in 'Insert image' dialogue.
Narrator is announcing as 'No file chosen, choose file, button'.
Expected results:
Aria label attribute should be defined for button in 'Insert image' dialogue.
User Impact:
Adding effective form labels is absolutely necessary to make forms accessible. The purpose of form elements such as a checkboxes, radio buttons, input fields, etc. is often clear for sighted users, even if the form element is not programmatically labeled. This isn't usually the case for screen reader users. Adding a label to all form elements eliminates ambiguity and contributes to a more accessible product.
Hi Team,
###Current Behavior
When displaying checkboxes, they are not aligned for nodes with children vs. nodes without children
### Example
https://stackblitz.com/edit/react-rqvush?file=app/main.jsx
### Expected Behaviour
Nodes checkboxes should be aligned the same regardless of if they have children.
###Version
4.8.0
Thanks and Kind Regards,
Grant
Looking at the JSDoc for for `toDataSourceRequestString` and `toDataSourceRequest`, they both appear to have JSDoc above them, showing the parameter as:
* @param {DataRequestState} state - The state that will be serialized.
Should this actually have `@param {DataSourceRequestState}`?
Given the simple example:
const RatingContainer = () => {
const [ratingValue, setRatingValue] = useState(0);
const clearRating = () => {
setRatingValue(0);
}
const onRatingChange = (event) => {
setRatingValue(event.value);
}
return <div>
<Rating
value={ratingValue}
onChange={onRatingChange}
/>
<Button
onClick={clearRating}
>
Clear
</Button>
</div>
}
export default RatingContainer;
The Rating component behaves as expected when updating `ratingValue` through the Rating component. However, when I want to clear the rating value with the 'Clear' button to update the `ratingValue`, the number of stars displayed doesn't update reflect the value of `ratingValue`.
Here is a subsection of my package.json file.
"@progress/kendo-data-query": "^1.6.0",
"@progress/kendo-drawing": "^1.17.5",
"@progress/kendo-licensing": "^1.3.0",
"@progress/kendo-react-animation": "^5.13.0",
"@progress/kendo-react-buttons": "^5.13.0",
"@progress/kendo-react-charts": "^5.13.0",
"@progress/kendo-react-common": "^5.13.0",
"@progress/kendo-react-data-tools": "^5.13.0",
"@progress/kendo-react-dateinputs": "^5.13.0",
"@progress/kendo-react-dialogs": "^5.13.0",
"@progress/kendo-react-dropdowns": "^5.13.0",
"@progress/kendo-react-editor": "^5.13.0",
"@progress/kendo-react-excel-export": "^5.13.0",
"@progress/kendo-react-form": "^5.13.0",
"@progress/kendo-react-grid": "^5.13.0",
"@progress/kendo-react-indicators": "^5.13.0",
"@progress/kendo-react-inputs": "^5.13.0",
"@progress/kendo-react-intl": "^5.13.0",
"@progress/kendo-react-labels": "^5.13.0",
"@progress/kendo-react-layout": "^5.13.0",
"@progress/kendo-react-listview": "^5.13.0",
"@progress/kendo-react-notification": "^5.13.0",
"@progress/kendo-react-pdf": "^5.13.0",
"@progress/kendo-react-progressbars": "^5.13.0",
"@progress/kendo-react-tooltip": "^5.13.0",
"@progress/kendo-react-treelist": "^5.13.0",
"@progress/kendo-react-treeview": "^5.13.0",
"@progress/kendo-react-upload": "^5.13.0",
"@progress/kendo-svg-icons": "1.4.2",
"@progress/kendo-theme-bootstrap": "^5.2.0",