Greetings,

I hope this message finds you well.

I would like to request a new feature for the Kendo Vue Dropdown List component: the ability to disable selected items directly within the dropdown list configuration. This functionality is already available for Kendo React users, as outlined in your documentation:
Disabled Items in Kendo React DropdownList.

Why This Feature is Valuable for Kendo Vue Users

1. Consistency Across Frameworks
   Many users work across multiple frameworks, including React and Vue. Consistency in feature availability ensures a seamless transition and experience for developers leveraging Kendo UI in different projects.

2. Improved User Experience
   Disabling items within the dropdown is a common requirement in dynamic forms and data-driven applications. For example, when users are selecting items from a list, disabling already-selected options prevents confusion and enhances usability by guiding them effectively.

3. Reduced Development Overhead
   While developers can currently implement this feature manually in Vue, a built-in option would significantly reduce the amount of custom code required. This aligns with the Kendo philosophy of providing robust, ready-to-use components that save time and effort.

4. Enhanced Accessibility
   A built-in disabled item option ensures proper handling of accessibility concerns, such as ARIA attributes, keyboard navigation, and screen reader compatibility. This would help developers create inclusive and accessible applications without requiring additional customizations.

5. Competitive Edge
   Offering this functionality natively in Kendo Vue would strengthen the feature parity between your React and Vue libraries, making Kendo UI even more appealing to developers evaluating dropdown components across frameworks.

Proposal

Introduce a configuration option, similar to the one in Kendo React, that allows users to disable specific items in the Vue Dropdown List component. This feature could be implemented by providing a function or property to dynamically determine which items should be disabled based on their state or other criteria.

The change event of the DropDownList is emitted when navigating between DropDownList options using the keyboard. 

The DropDownList should have a select event like it is in other Kendo UI suites and this select event should be emitted when using the keyboard with an expanded popup. Once a value is selected with, for example, click or 'Enter' press, then the change event should be triggered.

Describe the bug
When we have a Chart Tooltip in the Native Vue Chart and this Tooltip appears over the Chart itself, if we hover the Tooltip it starts to flicker.

To Reproduce

1. Open this StackBlitz example
2. Hover random series to display the ToolTip
3. Move the mouse cursor over the ToolTip

Expected behavior
The Tooltip of the Native Chart should not flicker when moving the mouse cursor over it.

• Possible workaround is to use the following CSS definition:

.k-animation-container.k-chart-tooltip-wrapper {
  pointer-events: none;
}

Add HTMLElement autofocus property support for input components like Input, Textbox etc...  See https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/autofocus

Currently, unable to apply autofocus as an attribute to Input (separately or as part of a Form).

Describe the bug
If you try to group the data in a Grid by a column that has a value of "null", the browser hangs, and an error appears in the console.

To Reproduce

1. Open this StackBlitz example
2. Group the Grid by "Unit Price" field

Expected behavior
The data should be grouped according to the values inside the UnitPrice column. A column with an empty header should appear for the group with a "null" value.

Screenshots

Workaround

Convert the "null" values to empty string with a code like this:
this.products.forEach((o) => { o.UnitPrice = o.UnitPrice === null ? '' : o.UnitPrice; });
Here is a modified example in which the above code is added to the getData method.

Describe the bug
The selectionChange & headerselectionchange events of the Native Grid component are unexpectedly triggered when filtering data in the component.

• The issue is not replicable on Chrome and Safari.

• A possible workaround for the bug is demonstrated in this StackBlitz example

To Reproduce

1. Open this StackBlitz project in Firefox
2. Enter random text in the filter input of some of the fields
3. See the following two errors in the console:

and

Expected behavior
No JS errors should appear when filtering the Grid component, no matter the browser that is used.

Describe the bug
The MultiSelect component throws a console error when a text value is entered in its input and the component is used as a part of the Native Form.

The issue is replicable only when a text is entered in the component's input. Everything works as expected if a value is selected from the MultiSelect's popup list.

• A possible workaround for the bug is demonstrated in this StackBlitz project.

To Reproduce

1. Open this StackBlitz example
2. Enter random text in the MultiSelect's input
3. Open the browser's console and see the following error

Expected behavior
No errors should appear in the browser's console when using the MultiSelect component as a part of the Form component, no matter the specific configuration of the MultiSelect.

Describe the bug
The Tooltip is not correctly positioned in scenarios where a longer text needs to be displayed. This incorrect positioning leads to the inability to automatically close the Tooltip when the mouse is hovered out of the component.

To Reproduce

1. Open this CodeSandbox example.
2. Hover the yellow dot on the right

Expected behavior
The Tooltip should appear correctly positioned above the yellow point as it is in the scenario when you hover the left point in the above example

Screenshots

Describe the bug

The events displayed inside a Timeline view are not fully expanded to the time boundaries of the slots available in the view. Events that are 30 minutes long are displayed like something around 20 minutes in length.

To Reproduce

1. Open this StackBlitz example
2. Check the way the 'Website upload' event is displayed

Expected behavior
The 'Website upload' event should be displayed inside two 15 minute slots

Screenshots

The data tools kfilter component uses a DropDownList component to list the fields available for building a query. It looks like there is no way to apply the :filterable prop to the DropDownList that allows a user to type inside the list in order to filter down the list. This is especially useful if you have hundreds of fields in your dropdown. Instead a user must scroll through the entire list to find the field they are looking for.

We also use this component in our older web forms application and this functionality is available in the old component.  I would suggest allowing the :filterable prop to be applied to the kfilter component which would be passed down to the child DropDownList component.

Hi Team,

How to show loading spinner for Schedular control when we changing the views (from day view to week view).

I am not able to find any props like loader or no-data-template.

Please help me on this.

Thanks,

Lingaraju