On the kendo editor for angular, when the toolbar controls for both background color and foreground color are present and I select a background color, the color chosen for background is shown in the swatch for both the back ground and foreground buttons even though nothing has been selected in the foreground

Hello Kendo UI for Angular team,
We found a memory leak in the Kendo UI for Angular DateTimePicker and would like to ask you to fix it. Every time the popup is opened and closed, the complete popup DOM (about 2,000 nodes) and one keydown listener stay in memory until the DateTimePicker itself is destroyed. We could not find an existing report on GitHub, the feedback portal or the forums.

ENVIRONMENT
- @progress/kendo-angular-dateinputs 23.4.0 (our version). The same code is in 24.2.2, in 25.3.0 and in the bundle of your online demo.
- Angular 21.2, RxJS 7.8, Chrome 153, production build.
- Default calendarType ('infinite').

STEPS TO REPRODUCE (on your online demo)
1. Open https://demos.telerik.com/kendo-angular-ui/demos/dateinputs/datetimepicker/basic_usage in Chrome.
2. Open DevTools > Performance monitor (DOM Nodes, JS event listeners), or the Memory tab.
3. Open the popup with the calendar button and close it with Escape. Repeat 8 times.
4. Collect garbage (Memory tab > "Collect garbage") and take a heap snapshot. Filter by "Detached".

ACTUAL RESULT
After forced garbage collection following each cycle:
- DOM nodes: 122 → 2,452 → 4,497 → 6,542 → 8,587 → 10,632 → 12,677 → 14,722 → 16,767 (about +2,045 per open).
- JS event listeners: 63 → 71 (+1 per open).
- The heap snapshot contains 8 detached table.k-calendar-table elements, each with its whole popup subtree, retained by an RxJS subscription teardown.
Closing with Cancel, Set or the toggle button behaves the same. In the same setup, the DatePicker and TimePicker do not grow.

EXPECTED RESULT
After the popup closes and garbage is collected, the DOM node and listener counts return to their previous level.

ROOT CAUSE
For the infinite calendar, DateTimePickerComponent.openPopup() adds a keydown subscription on the month list to the component-lifetime `subscriptions`:
    if (this.calendar.type === 'infinite') {
        this.subscriptions.add(fromEvent(this.calendar.monthView.list.nativeElement, 'keydown').subscribe((event) => {
            ...
        }));
    }
(fesm2022/progress-kendo-angular-dateinputs.mjs: line 16741 in 23.4.0, line 18024 in 25.3.0.)
closePopup() unsubscribes ariaActiveDescendantSubscription, but not this subscription, and `subscriptions` is only unsubscribed in ngOnDestroy(). Every open therefore adds another listener on the new calendar table, and that listener keeps the closed popup alive.

SUGGESTED FIX
Keep the subscription per popup and release it when the popup closes, for example:
    private calendarKeydownSubscription: Subscription | null = null;
    // openPopup()
    if (this.calendar.type === 'infinite') {
        this.calendarKeydownSubscription = fromEvent(this.calendar.monthView.list.nativeElement, 'keydown').subscribe((event) => {
            ...
        });
    }
    // closePopup() and ngOnDestroy()
    this.calendarKeydownSubscription?.unsubscribe();
    this.calendarKeydownSubscription = null;

IMPACT
We use the DateTimePicker in form fields and in the filter row of a data grid, where the picker lives as long as the grid is shown. Each open adds about 2,000 detached DOM nodes, so memory keeps growing on long-lived screens (100 opens leave about 200,000 detached nodes) until the user leaves the page. Because `subscriptions` is private, we cannot release the subscription cleanly from application code. The subscription is only created for the infinite calendar, but switching to calendarType 'classic' is not an option for us because it changes the calendar experience.

REQUEST
- Please confirm the issue and fix it in an upcoming release, and let us know which version will include the fix.
- If you track it publicly (feedback portal or GitHub), please send us the link so we can follow it.
- Please let us know whether there is a supported workaround until the fix is released.
We are happy to share heap snapshots and our automated Playwright reproduction script.

Kind regards,
Kamil

In firefox, open the Kendo Radio Button documentation and slowly resize the window (https://www.telerik.com/kendo-angular-ui/components/inputs/radiobutton)

The radio button will kind of jiggle around and occasionally the white dot in the radio button will become off-center.

This also seems to happen in response to some material bouncy (cubic-bezier) animation transitions.

Built-in editors lack the option to set accessible labels. This can be worked around by declaring an editor template.

A built-in setting for the label would be nice to have. The column title can be used as a default.

Basically, we have just a limitation that we could not use host directives if the directive is not standalone:

see for example :

https://angular.io/guide/directive-composition-api#adding-directives-to-a-component

and about cdk (they are not ready as well):

https://github.com/angular/components/issues/26036#issuecomment-1588683306

Thanks

Diego

Hi,

This feature request considers the Kendo Angular UI Grid component.

We use the builtin drag & drop columns reordering functionallity. When we try to drag a column to the edge of the visible part of the grid with a horizontal scroll the scroll does not adjust automatically so we cann't drag to column to a place outside of the horizontal visible area.

It would be nice if you could enable automatic horizontal Grid scroll when a grid column is reordered and dragged to the edge the visible column area.

Thanks,

Shai

Current behavior
ToolbarComponent, DropDownButton and SplitButton utilize the PopupSettings of type:

interface PopupSettings { animate?: boolean; appendTo?: 'root' | 'component' | ViewContainerRef; popupClass?: string; anchorAlign?: Align; popupAlign?: Align; width?: number | string; height?: number | string; }

For the overflow popup, they all work fine, but for the buttons:

- popupAlign
- anchorAlign
- height
- width
properties don't work.

https://stackblitz.com/edit/angular-jqhp2d?file=app/app.component.ts

Currently, the DropDownButton and SplitButton popup alignment can be changed, by using the align property of the Buttons PopupSettings type
https://stackblitz.com/edit/angular-jqhp2d-smtyhp?file=app/app.component.ts

Expected behavior
Create separate PopupSettings interface for the DropDownButton and SplitButton components to:

isolate the width and height options
to unify the PopupSettings of the Toolbar SplitBtn and DropDownBtn with the updated Buttons PopupSettings:

interface PopupSettings {
    animate?: boolean;
    appendTo?: 'root' | 'component' | ViewContainerRef;
    popupClass?: string;
    anchorAlign?: Align;
    popupAlign?: Align;
    width?: number | string;
    height?: number | string;
}

Currently, the supported approach for setting values for the input properties of the Kendo UI for Angular components is by binding them to a DOM property. 

Please provide support for the ability to set values for the input properties programmatically.

Tab Key: When you press the TAB key, the editor loses control of the focus. It is intended to give tab space rather than leave editor control. The indent space actually differs greatly from the tab space.

The TextBox component allows us to specify a template for the prefix and suffix areas by applying the TextBoxPrefixTemplate and TextBoxSufffixTemplate directives to an ng-template.

I would also like to able to specify a template for the actual input area itself. 

My use case for this is that I have a directive that I use within my application that I would normally apply to the <input> tag to ensure some custom processing is undertaken during user input. With the current TextBox component I am unable to do this.

Additionally I would like to specify the autocomplete attribute for the <input> tag to alow the browser to autocomplete things such as shipping-address etc. or even to disable the browser autocomplete completely by setting this to "off". Again this is not possible with the current TextBox but would be easily achievable if I could specify the template for the input area.

If this was implemented as requested I would expect my angular HTML to look something like:

 <kendo-textbox>
   <ng-template kendoTextBoxPrefixTemplate>
       <button kendoButton look="clear" icon="image"></button>
   </ng-template>
   <ng-template kendoTextBoxInputTemplate>
       <input myDirective [autocomplete]="myValue" />
   </ng-template>
   <ng-template kendoTextBoxSuffixTemplate>
       <kendo-textbox-separator></kendo-textbox-separator>
       <button kendoButton fillMode="clear" icon="calendar"></button>
       <kendo-icon name="bell"></kendo-icon>
    </ng-template>
 </kendo-textbox>

Hi Kendo Angular team,

It will be a good addition to the Kendo UI internalization to add support for the 'j' input skeleton symbol.

https://www.unicode.org/reports/tr35/tr35-dates.html#dfst-hour

Thank you for your consideration.

Hi

I've started using Filter component since your recent editorTemplate feature makes is more usable when it comes to selecting predefined list of values.

One problem with this is that majority of values for filterable fields are based on predefined list of values that we put in dropdown list.
So our component template has many repeated templates like this

Writing these editor templates with handlers for valueChange that differs only in the source list and using onInit to set these as editorTemplate seems inefficient. 
Our component ended up with mostly filter editor templates just in order to use filter component.
I am aware that this could be all done in markup but using filters property on Filter is more flexible as filters can be driven from server side.

It would be a good that FilterExpression type has some property like valuesListData: {text: string, value: any}[].so that dropdown get generated automatically.
I assume that picking from the dropdown is the mostly used scenario and would satisfy majority use cases.

So this is a feature request:

As a developer I would like to be able to set a list of objects on FilterExpression object so that Filter component create dropdown for value editor with the provided list.

Hi team,

It will be a good addition to the library to have a MultiColumnDropDownList component similar to the already existing MultiColumnComboBox.

Thank you.

The nodeViews feature of proseMirror can't be used if not exposed as an input as it should be set in construction of the EditorView which is done internally the component.

We would like to supply it as an input to your component

Currently toODataString constructs the entire query string used to make a request. When API endpoints are automatically generated (using swagger/OpenAPI for example), this makes toODataString less helpful. I would like a function that exposes the individual properties generated by toODataString

For example, toODataString currently produces something like

'$skip=0&$top=20&$orderby=quantity&$filter=date ge 2020-01-01T00:00:00.000Z'

I'd like something like toODataObject that produces something like

{$skip: 0, $top: 20, $orderby: 'quantity', $filter: 'date ge 2020-01-01T00:00:00.000Z'}

so that I could pass individual properties as parameters to generated API functions.

Thanks.

Currently it is not possible to touch-scroll the locked section of the Grid on mobile devices - this is a known limitation:

https://www.telerik.com/kendo-angular-ui/components/grid/columns/locked/#toc-known-limitations

https://www.telerik.com/kendo-angular-ui-develop/components/treelist/columns/locked/#toc-known-limitations

Please provide the opportunity for touch-scrolling the locked section of Grid and TreeList similar to the one available on other devices via the mousewheel.