I'm using latest v11 KendoReact packages and Tailwind v4 and Vite 7.

I saw this example 

Github (forked) - StackBlitz

And even though it does switch between themes, but I'm unable to get it to work with Tailwind. Seems like Kendo classes overwrite Tailwind's.

Also, Tailwind v4 docs states that we only put this in our .css file

@import "tailwindcss";

How do I get it to work in a way that if I do this

        <Button
          className="rounded-lg bg-blue-600 px-4 py-2 font-medium text-white shadow hover:bg-blue-700 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:outline-none"
        >
          Next Theme
        </Button>
        <Button themeColor={"primary"}>Primary</Button>
        <Button disabled={true}>Disabled</Button>

The first button will have the Tailwind styling but the 2nd two will have the default Kendo styling?

Thanks!

Hi.

I'm using a Drawer component but instead of using the svg-icons provided by the Kendo-UI I would like to use Font Awesome icons. Is that possible?

Thanks,

Greetings,

Bernd

I have built a component in stackblitz
https://stackblitz.com/edit/react-sjktqaua?file=app%2Fapp.tsx,app%2Fgd-products.ts

Notably it has both the props needed for ctrl+c functionality:

and a row override:

This breaks the ctrl+C event. It no longer fires when custom row is applied to the grid. Am I missing anything? I am passing trProps

I want to create a custom Kendo Grid component in React so that if there's any future update (e.g., changes like cell to cells), we can make the change in just one place instead of updating it everywhere in the project.

Currently, I have tried creating a custom wrapper for the Grid and Column components, but it's causing rendering issues.

Can you guide me on the correct way to create a reusable custom Grid and Column component using Kendo React Grid that works reliably with all features (sorting, filtering, paging, custom cells, etc.)?

Ideally, we want a centralized Grid component where we can pass in props like columns, data, and events, and handle all common logic in one place.

Hi,

I am trying to make a page with the grid that gets data from a Flask REST API. The data received is paginated. From the grid I also want to allow the user to filter and sort the data, which should make a request to the backend API, to receive filtered, sorted, and paginated data.

I have previously done this in Telerik Blazor using the OnRead function. I overwrote the OnRead function to automatically make a request upon filter, sort, or page change . Looking through the Kendo React documentation, I can't figure how to use DataSource with a REST API, the documentation seems to use OData. Is there something like Telerik Blazor OnRead, which I can use in Kendo React, or do i need to use functions like OnPageChange, OnFilterChange, to bind this functionality with the API?

For example, this is the kind of data i get from the API:

{
    "metadata": {
        "page": 1,
        "perPage": 50,
        "total": 120,
        "totalPages": 3
    },
    "assignments": [
        {
            "createdAt": "2025-02-20T00:00:00",
            "updatedAt": "2025-06-11T11:23:26.913674"
        }
    ]
}

And with the request on page change, on filter, or on sort, I would want to get the page, filter, sort data, and put them into query parameters to pass to the endpoint. I have attached an example image of query params I have from Postman below. 

I would highly appreciate it if anyone can help me figure out implement this functionality, ideally using a function like Telerik Blazor OnRead.

Thanks!

Hi Kendo Team,

We recently upgraded our project dependencies — Kendo UI Grid to v11.1 and React to v19.1.

After the update, we faced several issues with cell and headerCell, which we managed to resolve using your documentation. However, we are still encountering issues with the following:

1. rowRender – Our custom row rendering is not working as expected after the upgrade.

2. selectedField – Selection is not applying correctly on rows using this field.

3. expandField="expanded" – The expand/collapse functionality is not behaving as it did previously or not rendering the detail rows.

Can you please confirm:

• Are these features fully supported in Grid v11.1 with React 19.1?

• Are there any breaking changes or updated implementation patterns we should follow?

• Could you share examples or updated documentation for these features?

Thank you,

Hello! We've noticed that only in KendoReact components (not reproducible with our custom or 3rd party components) sometimes completely randomly these weird "â€<" characters show up. For example:

- Dropdowns:

- Dialogs:

This issue seems very similar to: https://www.telerik.com/forums/strange-characters-in-different-kendo-objects but while that's for Angular we are using React.

Some information:

- We are using an ARM64 version of Ubuntu with the Chromium browser
- We've checked and all data is stored as UTF-8 in our database (with the correct DB settings)
- We've checked and all response & request headers related to UTF-8 are set for all of our endpoint
- The issues does not reproduce on X86 Windows based systems or while working locally (from localhost)
- We are using KendoReact version 9.3.1 with the Fluent Theme version 10.1.0
- This issue pops up completely randomly and cannot be reproduced constantly
- We've investigated and checked and our fonts are loaded correctly. We also have some fallbacks in place, in case our font fails. All of them support UTF-8 characters
- We are NOT using Kendo's localisation feature
- Checking the Network requests from the DevTools reveals that the data comes correctly but is displayed incorrectly somehow

We ran out of ideas and this issue is really critical for our environment. Could you advise what should we investigate? As this issue only happens with Kendo components, to us it seems pretty clear that the issue lies there somewhere.
Thank you!