We would like to use Kendo React to build a micro frontend UI but we did not found any relevant information that this is currently supported.

The main issue we are facing is how it isolate Kendo theme styling between different micro frontends.

Let's say we have 2 micro frontends A and B:

- A is using Kendo v6.

- B is using Kendo v7 (or some other future/past version).

Both of them will include their global Kendo styles which will collide.

After some investigation, we came up with 2 possible approaches:

1. Isolating micro frontends using shadow DOM. This is the most common technique but unfortunately not supported by Kendo React yet.
2. Prepend custom class to all Kendo CSS selectors (for example ".microfronend-a .k-button" instead of just ".k-button").

We have experimented with the second approach and it seems like a way to go. It also required to append all popups to root DOM node of a micro frontend which can be done easily using PopupPropsContext.

But adding a class to all Kendo CSS selector is technically not a trivial task. It would be nice if Kendo supported this out of the box, for example by providing some SCSS configuration variable.

I've noticed in your other products, the dropdownlists have a property that allows for grouping sets of data. 

What would it take to get that included in Kendo UI React?

We have a use case that this would be very helpful.

Thanks.

Hello,

could you add remove / delete event to multiselect, like onRemove or something like that.

Now, because onChange event gives only the currently selected items, I need to do manual diffing what was the item that was removed.

If there were an event for remove / deletion of an item, it would be much easier to handle that.

Br, Miika

If the datagrid inside popup is wider than max screen width, then there is no scrollbar to scroll it horizontally, which means user cannot see the whole datagrid.

When I tried to somehow hack it and set max width of 100vw for the datagrid, then it partially worked - the content could be scrolled horizontally, but the header remained static; position of header cells didn't match positions of scrolled body cells, which would be confusing for the user.

How to reproduce:

1. Open this link: the componet preview

2. Set screen width to 500px.

3. Open the datagrid using the input arrow button.

Result:

The datagrid is truncated horizontally.

Expected:

The datagrid can be scrolled horizontally..

Currently, there is a following signature of function "rowRender" passed to React Grid:

rowRender?: (row: React.ReactElement<HTMLTableRowElement>, props: GridRowProps) => React.ReactNode;

I managed to access something which I assume represents this index somehow by using "row._owner.index" although I'm not completely sure if that is always identical to the index of the row being rendered.

It would be very helpful if an index of a rendered row could be accessed as follows:

rowRender?: (row: React.ReactElement<HTMLTableRowElement>, props: GridRowProps, index: number) => React.ReactNode;

Hi, 

Please check this example

https://stackblitz.com/edit/react-bri58e?file=app%2Fmain.jsx

We wanted to break the page once its started overlapping the footer.

Hi,

If you use kendo-theme-bootstrap for most Kendo React inputs, it results in bootstrap styling being applied to the input e.g. https://www.telerik.com/kendo-react-ui/components/dateinputs/datepicker/ or https://www.telerik.com/kendo-react-ui/components/dropdowns/combobox/. With the Bootstrap theme selected the DatePicker and Combobox have blue shadows on focus.

This is not true for the DropDrownList: https://www.telerik.com/kendo-react-ui/components/dropdowns/dropdownlist/. The border on focus does not match Bootstrap styling.

Kind regards,

David

It would be nice to have natively some kind of copy-paste of data between excel and kendo 

more and more clients are requesting this feature but currently it is pretty difficult to implement..

being more specific the expected behavior should be:

user copying a range of cells from excel

pastes it into a grid cell 

data should spread starting from the cell where it was pasted and inserting new rows if there are not enough to contain all the content

then user should be able to copy a range of cells/rows or a single row and paste it to excel

Hi,

Can We have an admin Dashboard for KendoReact? which has some ready components Like NavBar on top and Left, Dark and Light mode, RTL, and LTR Layouts and Forms with all input Components

I Have More projects in this React MUI Admin Dashboard and now it's very hard for me to use the KendoReact Components here.

if we Have KendoReact Admin Dashboard like that it will be easy to use KendoReact components there.

Thanks

Currently the React DateRangePicker component shows its calendar popup any time either of the date text inputs are focused.

It would be nice to have more control over this behavior buy providing a prop to customize what actions open the popup.

Our use case is that currently the DateRangePicker (as of v5.11.0) cannot be used to make a 508 accessibility compliant site (reference support ticket 1597095  : which IMO is a bug, but trying to also find a workaround that we can roll out quickly) due to the way the popup breaks tab order in the browser. If keyboard users could tab into the Start/End inputs without the popup opening, then they could type in a date and tab to the next control (currently they cannot because the popup breaks tab order). A mouse user clicking into the input would be fine to see the popup. So having a prop to specify the auto-open should happen in click, not on focus, with a keyboard shortcut to open the popup if they want it (which already exists as alt+down), would be an easy workaround to get us back into 508 compliance.

I could imagine such a pop to control auto-open of the calendar popup to take one of 3 values; 'focus' (same behavior as current) 'click' (open on click, but not on keyboard focus) 'none' (no auto open. user can press alt+down to open).

Hi, I am Lavanya!

in my dropdown list, there are horizontal layouts I need to change to the vertical dropdown list

and also I have attached bar data in that I need to make a dropdown filter of the month how can I use that