With the current implementation of the Native Grid, if one needs to set a minimum width to a column that needs to add the implementation suggested in this Setting a Minimum Column Width example.

While the approach in the above example works as expected, the logic that needs to be added can be internal for the Grid component. Thus the users will have to add a simple column property like the below and no other configuration should be set.

  {
    field: "ProductName",
    title: "Name",
    minWidth: 200
  }

Describe the bug
When we have multiple TimePickers on a page and start expanding their popups, the popups that are already expanded are not automatically closing.

To Reproduce

1. Open this StackBlitz example
2. Click on the "clock" icon of a random TimePicker to open its popup
3. Repeat step 2 over other randomly selected TimePicker

Expected behavior
The visible popup of a TimepPicker should be automatically closed when we expand the popup of another TimePicker

Screenshots

Currently, the Chip component provides the option to add an image to it by using a CSS class whose background-color property has a value of the image we want to be displayed in the Chip.

While the above works in a scenario with a smaller number of Chips, where the values of the Chips are pre-defined, this approach can't be used when we have dynamic data that holds different URL links. To be able to pass an image URL to the Chip component one of the following can be implemented:

• Option 1: Add an option to define a custom template for the Chip component
• Option 2: Provide a Chip property to which the image URL can be passed and the component will handle the correct visualization

Describe the bug
A licensing warning may continue to appear in the browser's console, no matter whether the licensing activation has been successful or not.

The issue is replicable when the user trying to activate a license has had an active license in the past and this license is already expired.

To Reproduce
Because of the specifics of the issue, a project in which the bug can be replicated won't be publicly provided.

Expected behavior
The license activation process should activate one's license no matter the previous licensing history of the user

Describe the bug
There is a blank space at the bottom of the Grid when the user scrolls the data. This blank space appears on a specific configuration where the Native Grid is configured with virtual scrolling and the groupable property is set as follows:

:groupable="{ footer: 'visible' }"

• The issue is replicable in both Vue 2 and Vue 3
• The issue is not replicable if the groupable prop is defined like this:

:groupable="true"

To Reproduce

1. Open this StackBlitz example
2. Scroll the data items to the bottom of the Grid

Expected behavior
There shouldn't be any white/blank spaces at the bottom of the Grid

Screenshots

Describe the bug
When the Grid's resizable property is set to true, the following test fails:

import { describe, it, expect } from "vitest";
import App from "../App.vue";
import { render } from "@testing-library/vue";

describe("App.vue", () => {
  it("renders apps", async () => {
    render(App);
  });
});

• The issue is not replicable if in Draggable.js file the:

import KendoDraggable from '@progress/kendo-draggable';

is changed with:

import { Draggable as KendoDraggable } from '@progress/kendo-draggable';

With this error:

To Reproduce

1. Open this project
2. Run 'npm install'
3. Run 'npm run test:unit'

Expected behavior
The test should pass as it used to pass in version 3.5.0, for example.

Describe the bug
With the current Upload implementation, the component doesn't provide an option to filter the files that are selected for upload if the auto-upload property is set to true.

Currently, the files can be filtered only if the auto-upload is set to false as in this StackBlitz example.

To Reproduce

1. Open this StackBlitz example with auto-upload property set to true
2. Select multiple files + one that has the letter "g" in its name

Expected behavior
The file with the letter "g" should not be uploaded

• As a possible solution for the issue, we can provide an event that is triggered before the file upload and when the event is triggered, the files will be filtered.

Describe the bug
When activating the keyboard navigation inside the Native Grid and there are custom cells in this Grid, the navigation between the cells(in a specific scenario) is slow.

Scenario: In a Grid whose cells are all custom, focus a random cell in the first column. Then press and hold the right keyboard arrow. The focused cell starts moving to the right and then freezes until the last Grid column is reached.

Here is a video demonstrating the described scenario: https://user-images.githubusercontent.com/41293735/202707680-1964d01e-dbd3-4a35-93c4-1dbcfd45e887.mp4

• The issue is replicable on Chrome and Chromium-based browsers, on Windows 10.
• Testing the scenario on Firefox(Windows 10), the issue cannot be reproduced.

To Reproduce
Steps to reproduce the behavior:

1. Open this StackBlitz example on Windows and Chrome/Chromium-based browser
2. Focus a cell in the first column of the Grid
3. Press and hold the right keyboard arrow

Expected behavior
The movement of focus inside the Grid should be smooth and visible

Describe the bug
The value of the data-grid-row-index attribute of the different Native Grid rows is always -1, no matter the scenario in which the component is used.

To Reproduce

1. Open this StackBlitz example
2. Inspect a random Grid row and see its attributes

Expected behavior
The different rows inside the Grid should have different values for the data-grid-row-index attribute.

Describe the bug
When expanding/collapsing grouped data in the Grid re-renders all Grid rows while only the collapsed ones should be re-rendered.

To Reproduce

1. Open this CodeSandbox
2. Collapse a group
3. Open the browser's console and see that row-render has been called 1000 times

Expected behavior
The row-render method should be called for the rows that hold the collapsed data, not for all Grid rows.

Describe the bug
The following JS error appears in the console when using the Insert Table tool of the Native Editor without choosing a table size to insert.

To Reproduce

1. Open this StackBlitz example
2. Click on the "Insert table" tool to open a popup
3. Click outside the popup

Expected behavior
No JS should appear when the user opens the popup of the "Insert Table" tool and doesn't select a table size in it.

Screenshots

In the jQuery version of the Grid, the columnMenu can be configured to show/hide the different column menu options.

Here is an example of how the sortable prop can be configured in a way the sorting options will be hidden in the column menu. 

Please provide the same configurations options for the column menu in the Native Grid

Describe the bug

In a Native Editor scenario, if you open the View HTML window, the window can be closed only using the two buttons at its bottom.

To Reproduce

1. Open this StackBlitz example.
2. Click on the View HTML button.
3. Try to close the window using the "x" button in the upper right corner.

Expected behavior
The popup window should be closed when the "x" button is clicked

Describe the bug
The rowReorder event is missing in the Wrapper Grid component, while it is available in the Kendo UI for jQuery Grid. Currently, the only way the event can be used is by using a code like the below in the mounted hook of the Vue app:

    var grid = this.$refs.grid.kendoWidget();
    grid.bind('rowReorder', function (e) {
      console.log('row', e);
    });

Expected behavior
The rowReorder event should be available for usage as the other events of the Wrapper Grid

Describe the bug
Grid rowRender is triggered for every more than once in in-cell editing scenario vue 2

To Reproduce
https://codesandbox.io/s/confident-wind-50llik
1 Click on some cell
Current: RowRender is triggered for every row
Expected: RowRender is triggered only for the clicked row

https://stackblitz.com/edit/mzrap6-afgvuk?file=src%2Fmain.vue

reorder the second column
result the innderHTML is NOT visible

Expected behavior
result the innderHTML is visible

workaround: use inner array instead of innerHTML - https://stackblitz.com/edit/mzrap6-y35krb?file=src%2Fmain.vue

Currently, the value of the TimePicker component can be changed by updating the values of the lists in the popup of the component and then pressing the "Set" button inside it. 

Can you provide the option to configure the component to automatically updates its value when a value in the lists inside the popup is changed? With this option, the functionality of the "Set" button won't be needed. 

Describe the bug
When using Teleport in the Tab template it is rendered for every tab

To Reproduce
https://stackblitz.com/edit/7malny-zw7ibq?file=public%2Findex.html,src%2Fmain.js,src%2Fmain.vue

The teleport is added in the tab template

Current: result it is rendered several times at the bottom
Expected: it is rendered only once at the bottom

Workaround :
Only render the teleport if the desired tab is selected: https://stackblitz.com/edit/7malny-gqxkma?file=public%2Findex.html,src%2FTabOne.vue,src%2Fmain.vue

The native Grid allows you to lock selected columns inside it. When we have locked columns, these are constantly visible inside the Grid, while the unlocked columns can be horizontally scrolled to see their content. 

The width of the area in which the unlocked columns can be scrolled depends on a combination of the following:

• The number of locked columns
• The width of the locked columns
• The width of the Grid

Having the above, there are some scenarios in which the area where the unlocked columns are displayed can be covered by locked columns or its size can become so small that the Grid data cannot be read.

Some examples of how the area that displays the unlocked column can become invisible or minified in size are:

• In a Grid with many columns, define many of them as locked
• In a Grid with resizable columns, resize one or a few of the columns in a way their sum width is bigger than the Grid's width
• A few Grid columns are locked but the Grid's width is too small

The current Feature request is about a property that defines the minimum width of the area in which the unlocked columns are scrolled. It could be a property like minUnlockedColumnsVisibleAreaWidth. Having this property defined, it should have a bigger priority over the defined column widths. This means that if there is not enough space to display the different locked columns with their pre-defined widths, the locked columns should be resized in a way the minimum visible area for the unlocked columns has enough width to display data.