Add more animation options to the KendoReact Chart rendering.

For example, we can add the following type of animation:

The new suggested animation type should change smoothly the Y values of the line, that is an animation of the line from its old points to its new points."

This should result in the lines (series) animating not the entire Chart.

Add a shared note property for the Chart.

This property should allow rendering a note for multiple series items similar to the shared tooltip funtionality.

Hi

I have been using Kendo React Scheduler and soon going to integrate it with our product. 

I came across a use-case/functionality requirement. Currently, with the Month View, when we have too many events in the view, we have the functionality of drilling down into the day view by clicking on three dots (I will refer to this as "View More" functionality). Very helpful indeed.

My use-case was when in the week view, we still have limited space per day in small dimensions for the calendar which can lead to the squashed arrangement of events on the time scale as well in the all-day section.

So I was thinking if we could have the same "View More" functionality in Week view as follows:

• Specifying the max number of events to be displayed for all-day view will render those events plus any additional like a "View More" functionality to drill down into Day view.
• Specifying the max number of events to be displayed for the same time frame will render those events plus any additional like a "View More" functionality to drill down into Day view.

Let me know if any other concerns or ideas around this may arise.

Thanks

Aman Gupta

Hi we are wanting to use the scheduler and control the display of overlapping items differently than the default.  Are there any resources you could point me to that explain how two items scheduled over the same time interact or can be customized?

If we wanted for the items to be z-indexed over each other instead of shown side-by-side, is that possible?

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

Actual Result:

Given I have a conteneditable div component in my web application, when I run FastPass using Accessibility Insights for Web, I get the follow error message:

Snippet
<div aria-label="Post a question or answer" contenteditable="true" class="ProseMirror"><p data-prewrap="true"><br></p></div>
How to fix
Fix the following:
ARIA attribute cannot be used, add a role attribute or use a different element: aria-label

Expected behavior

Given I have a conteneditable div component in my web application, when I run FastPass using Accessibility Insights for Web, then I should not receive the following error message above

It doesn't possible to set different "no events" text for the Agenda component, can we add the ability to set it by prop like in the example below?

<Agend noEventMessage="No meetings" />

<Agend noEventMessage="No vacations" />

Hello, 

I am using Filter component from kendo-react-data-tools and I need to parse oData filter string in URL to initialize the filter component. Is there a way to convert oData string to filter data that Filter component can use ? I am using toODataString to convert filter to oDataString and I am looking for the opposite way。

Thanks,

Rita

Due to some recent need (remove the filter buttons) in a Grid I think that having the ability to provide a className for the filter of a column would be very usefull.

Hi,

I require the ability to use generate a PDF of React content using the PDFExport component, but instead of calling the `save()` function to download a file to the client's disk, return the blob/URI back to the JS which can be processed further.

I tried using the `drawDOM` method, however it doesn't support many of the features I require for `PDFExport`, such as 'Author', 'Title' and most importantly 'pageTemplate'. 

Is there a way I can use the drawDOM method to achieve the same functionality as the core PDF export? If not, could another method be exposed of `saveURI` which returns a promise similar to drawDOM?

In addition, is there any temporary workaround you can think of that would facilitate what I'm trying to achieve? I couldn't spot any event I could intercept to solve this problem.

Kind regards,

Thomas

Imaging a GridColumn field that is a simple object {name:"My Item", value: 123}. It would be great to be able to define properties of the object as what to display without having to build a custom renderer.

displayField/displayFunction as a callback function with the fieldName of the columns and the dataItem of the row as parameters

const nameDisplay = (field, dataItem) => {

   return "some value"

}

...

<GridColumn field={"name"} displayFunction={nameDisplay}

We'd like the sorting to be correct and not based on the browser settings.

From support ticket:

We've noticed that our grid is not sorting correctly in our local language (Swedish). I've added LocalizationProvider and IntlProvider around it. The translation works fine.

In Swedish it would be sorted: A, B, Å

It's common in software that A and Å is sorted next to eachother but this is wrong.

I've tried using locale "sv" (language) and "se" (country) but neither sorts it correctly.

Reply on support ticket

We are internally using the built-in JavaScript method localeCompare to compare the values:


    if (a.localeCompare) {
        return a.localeCompare(b);
    }
That means that we will compare the data based on the current browser locale. Still, the result can vary based on the machine. In cases, like this one, we can recommend using server filtering the ensure that the results are specific to the Swedish culture regardless of where this is loaded.

Another option can be to log a feature request that will take the culture parameters from the IntlProvider and pass it as a second parameter to the localeCompare function.

Hello,

I am using React Multiselect in my project. I need every item in the multiselect component selectable with checkboxes and multiselect itself filterable. It would be very nice if you add this features to Multiselect component as built in. There is a workaround which I share links below for this but we need to do all this stuff manually.

1. Checkboxes:

• https://stackblitz.com/edit/kendo-react-multiselect-checkboxes-moavl9?file=app%2Fmain.jsx

2. Filterable

• https://www.telerik.com/kendo-react-ui/components/dropdowns/multiselect/filtering/#toc-basic-configuration

Thanks

Hello Team,

We have got this requirement to open date range picker using a single button input. Is there any way I can achieve this. I can see there is endDateInput and startDateInput available but it still renders 2 different inputs. But we want single button to control whole thing.

Thanks,

Gaurav

We are currently on implementing a component for data grids using the Kendo React Grid and virtual scrolling.
The problem is that the "page down" and "page up" is not working correctly, because of the virtualization (We already contacted the support for it).
Here is a stackblitz where the problem can be reproduced: https://stackblitz.com/edit/react-rapzu9?file=app/main.tsx
Reproduction steps:
1. Click inside the grid
2. Press "Page down" - Page changes, but focus goes to the header cell
3. Press "Page down" again - Nothing happens

Another problem which maybe has the same source is navigating with the arrow keys.
Reproduction steps:
1. Scroll somewhere deeper down
2. Use arrow up to scroll up again
3. At some point it scrolls not up anymore but the focus also changes into the header cell - Not okay

In my opinion its a bug, at least for the arrow keys. If you disagree please open a feature request for it, this functionality will be needed by out customers.

Best regards

Yui

Hello, 

I'm trying to implement an accessible table using your Grid React component. The idea is for the users to be able to navigate the table using the keyboard if need be. Because we are a government contractor we have to make our product accessible and, testable using the Government issued tool for testing, ANDI. 

When I use a normal table, I can implement scopes in the table header, either for the column or the row and thus create relationships between headers and cells as well as, use the keyboard to navigate the entire table.

When the same table is implemented with the Grid component, there are no scopes in the header then again, both header and body are separate even though they reside inside a div with role=grid on it which in turn, contains two divs, one for the header and one for the body each in turn, implementing a table: one for what would be the headers and one for what would be the body. I'm attaching screenshots even though I'm sure you know the product.

The fact that both the <thead> and the <tbody> reside in different places, even though they are within the grid, makes it impossible to add associations furthermore, we're using a data-table and the grid. I tried using different props but, as long as both the header and the body are separate, the ANDI tools can't find the table.

Question is, is there a way to make this table truly accessible just as a one created using the semantic table tags?

Feature request

I am using the `AutoComplete` component to implement a search input and I want to be notified when the user selects an item (via mouse click or keyboard navigation) from the popup list.

I found an undocumented prop `handleItemSelect` on the `AutoCompleteHandle` ref object, and used it to implement my feature successfully.

Please can you expose `handleItemSelect` as an event on the `AutoCompleteProps` API.