Currently, the category value in the tooltip does not display the formatted value and the only option for changing this is by using the "render" and defining custom rendering. The formatted value should be used by default.
Hi Team,
There is some unexpected behavior when resizing events after switching the Scheduler to 'Show Full Day'. Take a look at my sandbox, you'll notice, its barely anything, let alone anything fancy.
Replicate:
1. Create a new event that starts at 8am.
2. Switch the view to 'Show Full Day'
3. Using the start time resize handle and drag it up, to start earlier. And you will notice the dragItem actually drags down, and when you release the handle, the event appears in the correct place
This will only happen on the first resize when switching to 'Show full day'. You can replicate it more by switching back and forth between full day and business hours.
Similar Scenarios include:
1. Placing the event to end at 8am, switching to business hours and back, then drag the end time down, the dragItem will be positioned to start at 8am, but say its 7am and you will see the rest.
2. Placing the event to overlap 8am, will yield both problems.
Again this only happens on the first resize after switching views, and I've only tested it in DayView, so it might affect WeekView as well. There appears to be no issue when events overlap the endWorkTime.
Thanks,
Grant
Hi.
I would like to request the support of JsonSchema when creating a Form with the KendoReact Form component.
Maybe something along the lines of react-jsonschema-form, only with integration of the Kendo Form components, like inputs, dropdowns, buttons and other components that are possible to be used in a form.
The reason for the request is that we would like to be able to build our forms dynamically based on jsonSchema information that comes from a backend.
Thanks,
Greetings,
Bernd
Hi,
Please see the following example of the Upload component being used to transfer a single file to a byte array:
https://stackblitz.com/edit/react-u2kbu9?file=app/main.tsx
Notice that all packages are latest including react 18 but I have not switched to the new createRoot API, and as per react documentation "Until you switch to the new API, your app will behave as if it’s running React 17" - this warning can be seen in the console window. When you upload a file, the FileReader onprogress and onload events result in the file being successfully uploaded with 100% progress. You can see current state and new state of all events in the console window.
Now please see the exact same example but switched to the new createRoot API:
https://stackblitz.com/edit/react-y8fuya?file=app%2Fmain.tsx
Notice that the warning is no longer visible in the console window. When you upload a file, the FileReader onprogress and onload events result in the file being successfully uploaded but the file progress is overwritten. You can see current state and new state of all events in the console window - the new state from the onProgress event is lost, and the new state in the onStatusChange event reports zero progress.
I believe this is because of automatic batching in React 18.
Kind regards,
David
Hello,
Currently, it is possible to switch between both numeric and input types in Kendo grid pagination but in our application we have design to display both numeric and input control types on load. so request to please help with that feature.
Thanks
Request to have the sliderbar have different colors. It is for user experince, knowing that the slider is going either to the sucess or fail.
I have attached files, in which there is an app bar content there is a dropdown in the dropdown there are four elements, in that I need four drawer container on the left side as I attached by clicking the single dropdown, how can I attach 4 drawer container in a single project
Thank you
I am using kendo react; how should I convert from a search query string into grid data state object? I am trying to get a query from URL and convert it into json object and pass it to the grid so it can do filtering, sorting, etc.
input can be the query strings below or URLSearchParams object.
const queryString = "sort=triggerAt-desc&page=1&pageSize=10";
?filter=(notes~contains~%27te%27~and~status~contains~%27up%27)&sort=triggerAt-desc&page=1&pageSize=10
The output should be:
{ sort: [ { field: "triggerAt", dir: "desc" } ], skip: 0, take: 10, }
https://stackblitz.com/edit/react-haejnu?file=app%2Fmain.tsx%3AL115
It is a common use case to provide Grid's dataItemKey property to make sure changes are properly reflected per documentation - https://www.telerik.com/kendo-react-ui/components/grid/api/GridProps/#toc-dataitemkey
However, when this accessor property is provided (usually a unique ID on all groups and items), Kendo uses it instead of its default auto-incremented `'ai' + absoluteIndex` key to index the <GridRow /> for each group's header and footer - giving them the same value and causing React to throw multiple warning about duplicate keys. This makes it unreliable to specify dataItemKey property when using the grouping feature with aggregate footers as it messes up with React's reconciliation mechanism.
Issue 1:
I've implemented insert table tool in the editor and I'm setting some states on editor blur. The bug appears when the editor is focused and I try to add a table. When I select the rows and cols from the dropdown and click to insert the table the editor blur is called my setStates are called and somehow the table insertion doesn't happen. In order to add the table I should not focus the editor and I have to click on the insert table button and select again the cols and rows.
Issue 2:
In the same editor I've added tableResizing plugin. The bug appears when I already have a table in the editor and open the insert table dropdown to add a new one. In that moment when the dropdown is still opened I hover over some of the already inserted table cells borders the insert table dropdown is closed.
Issue 3:
When the editor is controlled we have undefined as initial value and then we type something or try to add table for example the editor crashes and throw an error `Uncaught RangeError: Applying a mismatched transaction`. Even though the value type allows undefined EditorProps.value?: string | Node | undefined. It works fine though if the initial value is empty string.
Package
"@progress/kendo-react-editor":"^5.11.0 | 5.12.0"
Minimal reproduction
I'm providing an vite + react + ts project. Steps to run the project:
npm install
npm run dev
It's reproducible in the provided examples in StackBlitz from Kendo, but the editor packages are not always resolved with turbo package manager. I guess it's the same issue as https://github.com/telerik/kendo-react/issues/1530
After significant amounts of negative feedback we have now stopped using the KendoReact DatePicker as the calendar part of the control doesn't make it clear how to change the month/year. I am aware that you click on the {Month Year} label at the top, but this is obviously not intuitive at all based on the extensive user feedback (it took me a while to figure out the first time as well).
When you start using the control for older dates (e.g. Date of Birth), scrolling is just not feasible particularly on mobile and so users get incredibly frustrated as they just want to change the month/year in a more manual manner to go back in time significantly. Many other date picker controls use visual cues such as up/down carets next to the Month/Year to suggest it can be adjusted.
Please get your UX experts to look at improving this as it could be a really simple fix that would make a massive difference to users
There is an issue with ComboBox remote virtualization. This is reproducible on https://www.telerik.com/kendo-react-ui/components/dropdowns/combobox/filtering/#toc-filtering-with-remote-data-and-virtualization
Scroll slowly till almost the end of the list. Pay attention to the name: Paula Parente
Notice that the name keeps repeating after scrolling as the scroll goes back and forth. You'll need to scroll a few times more before the scroll continues to load
other items.
Hi,
Please see the following example of the dropdownlist with bootstrap theme applied:
https://stackblitz.com/edit/react-ejxe44?file=index.html
I have updated the bootstrap cdn to latest. Notice that bootstrap styling is applied to the dropdowns including focus shadowing.
Now please see the exact same example but with theme customisation using a custom scss file:
https://stackblitz.com/edit/react-tuq49c-g6ofwn?file=index.scss
Notice that bootstrap styling is no longer applied to the dropdowns, which do not have focus shadowing.
Kind regards,
David
We are currently passing a React.Node which contains both text and custom icons to the DropDownButton text property. The automatically generated aria-label of the DropDownButton returns [object Object] instead of any recognizable text.
Steps to Reproduce:
<DropDownButton text={<div>test text</div>}>
Expected Result:
aria-label contains the text inside the React.Node
aria-label="test text dropdownbutton"
Actual Result:
aria-label contains [object Object]
aria-label="[object Object] dropdownbutton"
Hi,
The KendoReact NumericTextBox responds to mousewheel events when in focus. It is very easy to focus on the textbox, type in a value, scroll up or down and inadvertently change the value just entered. This behaviour can be seen clearly on any of the Telerik example pages e.g. https://www.telerik.com/kendo-react-ui/components/inputs/numerictextbox/predefined-step/
I think this behaviour should be disabled by default if spinners are set to default, but otherwise I would like a property to disable it. The normal event handlers which could be used to disable this behaviour are not available on the NumericTextBoxProps.
Kind regards,
David
Not only would I like control over the group order (like from this thread https://feedback.telerik.com/kendo-react-ui/1523636-need-to-be-able-to-have-more-control-over-the-order-of-groups-in-the-kendo-grid-sort-on-the-text-is-insufficient), it would be awesome if we could sort groups themselves.
I understand that the current set up sorts children within groups but not the groups themselves. However, sorting within and between groups is a bit more intuitive to the user when they see visually-grouped information and try to sort on it => most of our users expect the groups to get sorted as well.
Although I can write my own sorting functionality, it can get out of hand quickly with ascending/descending, numeric vs alphabetic columns, and multi-sort vs single sort, but KendoReact already has the capability to sort in these three ways with its non-grouped grid functionality.