Please repeat the following steps to reproduce this critical accessibility issue:

it seems like for defining a custom color palette it's currently not possible to use css variables. When doing something like this:

I get a "Cannot parse color: var(--my-color)". 
Am I missing something?

If not, is this feature planned to be implemented sometime soon?

For me, I absolutely need this feature since I want to maintain the link between colors used within the application. We have custom colors defined as css variables. I want those colors to appear inside the kendo colorpicker palette and when selecting one I want this css variable to be used, let's say as a colored line in a graph component. when later changing the value of the css variable the color within the graph should update. that's why converting my css variables into hex values does not work for me, since it's breaking the link. 

On a sidenote - is it possibel to define a custom palette preset, like the ones available: 

  public palettes: string[] = [
    "office",
    "clarity",
    "slipstream",
    "basic",
    "monochrome",
  ];

Thanks for your help.
Thomas

Hi,

We're heavily using the Scheduler component, but we've hit a problem with `slotClick` in scenarios involving multiple scheduler instances on the same page.

With two schedulers on one page, slot detection for the second scheduler (used in context-menu flows via slotByPosition) can be wrong.

Detaild repro: Stackblitz

Hi Telerik Support Team,

I would like to request a feature enhancement for the Kendo UI for Angular TreeList component, specifically regarding the selection mechanisms.

Feature Request:

Please consider adding a (selectAllChange) event emitter to the <kendo-treelist-checkbox-column> component, similar to how selection events are handled or how other advanced components expose header checkbox interactions.

Use Case / Motivation:

Currently, when a user clicks the "Select-All" checkbox in the header, it is difficult to intercept this specific action efficiently to run custom business logic, perform secondary async operations, or manually update external states that depend strictly on the "all selected/unselected" toggle.

While we can listen to general selection changes on the TreeList, having a dedicated (selectAllChange) event that emits the current state (e.g., true, false, or even a custom event object) would provide much cleaner control over the application state, especially in complex data-binding scenarios.

Proposed Syntax:

<kendo-treelist-checkbox-column 
    [showSelectAll]="true" 
    (selectAllChange)="onSelectAllChange($event)">
</kendo-treelist-checkbox-column>

This event would be useful to focus the editor on some specific scenarios like in the Dialog:

https://www.telerik.com/kendo-angular-ui/components/knowledge-base/focusing-editor-inside-dialog

It currently relies on a short delay, which might differ depending on the machine.

The multiCheckbox filter popup in the Grid sorts its distinct-value list using JavaScript's native string comparison, which orders characters by Unicode code point. This produces correct results for ASCII-only data but breaks for any locale whose alphabet includes characters outside the ASCII range (Turkish İ/Ğ/Ş/Ö/Ü/Ç, German ä/ö/ü, Czech/Polish diacritics, etc.).

The request is to sort the filter item list using locale-aware comparison (`String.prototype.localeCompare`) so that values appear in the correct alphabetical order for the active language, or provide a custom way to order the filter options.

When a DropDownList is configured with both sticky headers and grouping, the first group header is rendered twice when opening the component - once as the sticky header and once as part of the list.

Currently, there is no built-in way to suppress this duplicate. Achieving the desired appearance requires custom CSS styles, and in cases where virtual scrolling is enabled, custom DOM manipulation of internal elements is needed, which causes side effects and edge cases.

Enhancing the DropDownList with a built-in option for achieving this would allow developers to control this behavior without relying on unsupported workarounds.

When Toolbar component is configured to

1. Have spacer between two elements: Angular ToolBar Control Types - Kendo UI for Angular
2. AND it uses `overflow=menu` strategy: Angular ToolBar Responsive ToolBar - Kendo UI for Angular
3. AND when there is sufficient space, so the Toolbar is NOT overflowing. In other words, the visibility of the overflow button is set to hidden.
   

THEN the elements are not properly aligned with the right edge of the Toolbar component. This is because the overflow button still occupies the space as is the bahviour of the `visibility` style: visibility CSS property - CSS | MDN

• The visibility CSS property shows or hides an element without changing the layout of a document.

Minimal reproducible example:

import { Component } from '@angular/core';
import { KENDO_TOOLBAR } from '@progress/kendo-angular-toolbar';
import { FormsModule } from '@angular/forms';
import { KENDO_INPUTS } from '@progress/kendo-angular-inputs';
import { KENDO_LABELS } from '@progress/kendo-angular-label';

@Component({
  selector: 'my-app',
  imports: [FormsModule, KENDO_TOOLBAR, KENDO_INPUTS, KENDO_LABELS],
  template: `
    <kendo-label [for]="width" text="Set toolbar width"></kendo-label>
    <kendo-slider
      #width
      [(ngModel)]="toolbarWidth"
      style="width: 100%; display: block;"
      [showButtons]="false"
      [min]="0"
      [max]="100"
      [largeStep]="1"
      tickPlacement="none"
    ></kendo-slider>

    <kendo-toolbar overflow="menu" [style.width.%]="toolbarWidth">
      <kendo-toolbar-button text="My Kendo Angular Toolbar Button A" />
      
      <kendo-toolbar-spacer></kendo-toolbar-spacer>
      
      <kendo-toolbar-button text="My Kendo Angular Toolbar Button B" />
    </kendo-toolbar>
  `,
})
export class AppComponent {
  toolbarWidth = 100;
}

Expected behaviour: The overflow button does not occupy that space in the scenario described above.

• EITHER has `display: none` OR it is completely removed from the DOM when there is sufficient space.

It would be great if the <kendo-listbox> had the possibility to take in a list of selected values, which causes the matching items to be selected.

Currently, the only option I see is to inject the ListBoxComponent as viewChild, and call .select manually, which is quite cumbersome.

Suggestion:

- additionally to the "textField", provide a "valueField" property

- also add a "selectedValues" property, which takes in an array / signal of value properties, which then are automatically selected, whenever its value changes.

See https://www.telerik.com/kendo-angular-ui/components/listbox/api/listboxcomponent

You're docs say

Open the example in a new window to evaluate it with Axe Core or other accessibility tools.  for the Kendo angular grid

When i do that i see the attached error, which is the same issue i get in our product when running playwright axe

That suggests to me that it is not WCAG 2.2 compliant

Ensure elements with an ARIA role that require child roles contain them

.demo-frame.loaded.demo-module--wrap--718a6 > .demo-module--demoWrap--d1437 > .demo-module--explorerWrap--4bf1f.flex-grow-1 > .demo-module--demoBody--97eee > iframe #k-fbe44131-4768-4755-93c3-e321b714780e

<div role="grid" kendodragtargetcontainer="" kendodroptargetcontainer="" mode="manual" class="k-grid-aria-root" id="k-fbe44131-4768-4755-93c3-e321b714780e" aria-label="Data table" aria-rowcount="62" aria-colcount="5">

<div tabindex="-1" class="k-grid-content k-virtual-content">
 
 

Due to the internal mechanism by which the Scheduler displays events per day, some events are shrunk without reason, because others are shrunk due to overlap.

In the following screenshot, the Scheduler Event 1 has enough space to occupy the entire column, but is shrunk the same as Event 2 (which is shrunk due to the overlap with Event 3). Internally, each day use column separation logic to distribute the events. Since all three events fall into the same slot, the entire column is divided by 3 and events are distributed among them. Since Event 1 is the first event, it has been shown in the first 1/3. This isn't optimal, as this case proves it.

Here is how Kendo Scheduler behaves compared to Google Calendar in this case





Google Calendar

Please provide a way to disable the months or years when displaying months or years in the Calendar. The disabledDates callback function could be evaluated for these views.

Thank you

This will enhance the PDFViewer usability as the Toolbar provides many built-in features like responsiveness, tool customizations, etc., which will add extra value to the component.

The component is already used internally in the Editor and Spreadsheet.

Provide an option to dynamically remove a PDF file from the PDFViewer (a method, property, or a built-in toolbar tool).

When the PDF is removed, show the default blank page or the custom kendoPdfViewerBlankPageTemplate.

Add an optional positionCallback property to PopupSettings.

When using CSS transforms (e.g., transform: scale()) on container elements with dynamic values (CSS variables), the Popup component's positioning calculations don't account for the transformed coordinate space.

While the SCALE injection token exists, it only supports static values set at component initialization and cannot read dynamic CSS variables or respond to runtime changes.

• Enables custom positioning logic without breaking collision detection
• Supports dynamic transforms and CSS variable-based scaling
• Maintains backward compatibility (optional property)
• Eliminates the need for workarounds like MutationObserver
• Applicable to all components that use PopupSettings (DropDownList, ComboBox, MultiSelect, etc.)

With the current default behavior of the Splitter, when a user manually drags a Splitter pane to resize it, the component stores the pane's size as an absolute pixel value (i.e., flex-basis is set to a pixel value), and this is by design.

This means the pane does not scale with the browser window, unlike panes that have not been manually resized.

It would be useful if the Splitter could convert the pixel values to percentages on window resize, so that all panes continue to scale proportionally regardless of whether they were manually resized.

Currently, the Chat component does not provide a dedicated template for customizing only the avatar part of the user messages.

It would be great if such a template exists, so that the avatar can be customized as desired - for example, conditionally displaying an image with the avatarUrl or displaying only the initials if an avatarUrl is not present.