@progress/kendo-angular-grid 21.4.1 → 22.0.0-develop.1

package/esm2022/column-menu/column-menu-item.component.mjs

@@ -1,514 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { Component, Input, Output, EventEmitter, ContentChild, NgZone, ElementRef } from '@angular/core';
-import { trigger, transition, style, animate, state } from '@angular/animations';
-import { ColumnMenuItemContentTemplateDirective } from './column-menu-item-content-template.directive';
-import { chevronDownIcon, chevronRightIcon, chevronUpIcon, filterIcon, sortAscSmallIcon, sortDescSmallIcon } from '@progress/kendo-svg-icons';
-import { guid } from '@progress/kendo-angular-common';
-import { ColumnMenuService } from './column-menu.service';
-import { NgTemplateOutlet } from '@angular/common';
-import { IconWrapperComponent } from '@progress/kendo-angular-icons';
-import { take } from 'rxjs/operators';
-import { ContextService } from '../common/provider.service';
-import { filtersByField } from '../filtering/base-filter-cell.component';
-import { AdaptiveGridService } from '../common/adaptiveness.service';
-import { ColumnComponent } from '../columns/column.component';
-import { normalize } from '../columns/sort-settings';
-import { isPresent } from '../utils';
-import * as i0 from "@angular/core";
-import * as i1 from "../common/provider.service";
-import * as i2 from "../common/adaptiveness.service";
-/**
- * Represents an item that you can place inside a
- * [`ColumnMenuTemplate`]({% slug api_grid_columnmenutemplatedirective %}) directive.
- *
- * @example
- * ```html
- * <kendo-grid [columnMenu]="true" ...>
- *   <ng-template kendoGridColumnMenuTemplate let-service="service" let-column="column">
- *     <kendo-grid-columnmenu-item text="Fit column"></kendo-grid-columnmenu-item>
- *   </ng-template>
- * </kendo-grid>
- * ```
- * @example
- * ```html
- * <kendo-grid-column field="ProductName">
- *   <ng-template kendoGridColumnMenuTemplate let-service="service">
- *     kendo-grid-columnmenu-item text="Fit column"></kendo-grid-columnmenu-item>
- *   </ng-template>
- * </kendo-grid-column>
- * ```
- */
-export class ColumnMenuItemComponent {
-    ngZone;
-    ctx;
-    adaptiveGridService;
-    element;
-    /**
-     * @hidden
-     */
-    sortAscSmallIcon = sortAscSmallIcon;
-    /**
-     * @hidden
-     */
-    sortDescSmallIcon = sortDescSmallIcon;
-    /**
-     * Fires when the item is clicked.
-     */
-    itemClick = new EventEmitter();
-    /**
-     * Fires when the content expands.
-     */
-    expand = new EventEmitter();
-    /**
-     * Fires when the content collapses.
-     */
-    collapse = new EventEmitter();
-    /**
-     * Specifies the name of the font icon to render within the item.
-     */
-    icon;
-    /**
-     * Specifies the SVG icon to render within the item.
-     */
-    svgIcon;
-    /**
-     * @hidden
-     */
-    indicatorIcon;
-    /**
-     * Specifies the item text.
-     */
-    text;
-    /**
-     * Specifies if the item is selected.
-     */
-    selected;
-    /**
-     * Specifies if the item is disabled.
-     */
-    disabled;
-    /**
-     * Specifies if the item is expanded.
-     */
-    expanded;
-    /**
-     * @hidden
-     */
-    focused;
-    /**
-     * Represents the [ColumnMenuService]({% slug api_grid_columnmenuservice %}) class.
-     * Required to include the item in the column menu keyboard navigation sequence.
-     */
-    service;
-    /**
-     * @hidden
-     */
-    column;
-    contentTemplate;
-    contentState = 'collapsed';
-    contentId;
-    chevronUpIcon = chevronUpIcon;
-    chevronDownIcon = chevronDownIcon;
-    chevronRightIcon = chevronRightIcon;
-    filterIcon = filterIcon;
-    /**
-     * @hidden
-     */
-    get hasFilters() {
-        return filtersByField(this.ctx.grid.filter, this.column.field).length > 0;
-    }
-    get expandedIcon() {
-        if (this.ctx.grid.isActionSheetExpanded) {
-            return 'arrow-chevron-right';
-        }
-        return this.expanded ? 'arrow-chevron-up' : 'arrow-chevron-down';
-    }
-    get expandedSvgIcon() {
-        if (this.ctx.grid.isActionSheetExpanded) {
-            return this.chevronRightIcon;
-        }
-        return this.expanded ? this.chevronUpIcon : this.chevronDownIcon;
-    }
-    constructor(ngZone, ctx, adaptiveGridService, element) {
-        this.ngZone = ngZone;
-        this.ctx = ctx;
-        this.adaptiveGridService = adaptiveGridService;
-        this.element = element;
-    }
-    ngAfterViewInit() {
-        this.ngZone.onStable.pipe(take(1)).subscribe(() => {
-            this.contentTemplate && (this.contentId = `k-${guid()}`);
-        });
-    }
-    ngOnChanges(changes) {
-        if (changes.expanded) {
-            this.updateContentState();
-        }
-    }
-    /**
-     * @hidden
-     */
-    sortDescriptor(field) {
-        return this.ctx.grid.sort.find(item => item.field === field) || { field };
-    }
-    /**
-     * @hidden
-     */
-    showSortNumbering(column) {
-        const { showIndexes } = normalize(this.ctx.grid.sortable);
-        return showIndexes
-            && this.ctx.grid.sort
-            && this.ctx.grid.sort.filter(({ dir }) => isPresent(dir)).length > 1
-            && this.sortOrder(column.field) > 0;
-    }
-    /**
-     * @hidden
-     */
-    sortOrder(field) {
-        return this.ctx.grid.sort
-            .filter(({ dir }) => isPresent(dir))
-            .findIndex(x => x.field === field)
-            + 1;
-    }
-    /**
-     * @hidden
-     */
-    onClick(e) {
-        this.itemClick.emit(e);
-        if (this.contentTemplate) {
-            if (!this.ctx.grid.isActionSheetExpanded) {
-                this.expanded = !this.expanded;
-                this.updateContentState();
-            }
-            if (this.expanded) {
-                this.expand.emit();
-            }
-            else {
-                this.collapse.emit();
-            }
-        }
-    }
-    updateContentState() {
-        this.contentState = this.expanded ? 'expanded' : 'collapsed';
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnMenuItemComponent, deps: [{ token: i0.NgZone }, { token: i1.ContextService }, { token: i2.AdaptiveGridService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ColumnMenuItemComponent, isStandalone: true, selector: "kendo-grid-columnmenu-item", inputs: { icon: "icon", svgIcon: "svgIcon", indicatorIcon: "indicatorIcon", text: "text", selected: "selected", disabled: "disabled", expanded: "expanded", focused: "focused", service: "service", column: "column" }, outputs: { itemClick: "itemClick", expand: "expand", collapse: "collapse" }, queries: [{ propertyName: "contentTemplate", first: true, predicate: ColumnMenuItemContentTemplateDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
-        @if (contentTemplate) {
-          <div class="k-expander">
-            <ng-container [ngTemplateOutlet]="content"></ng-container>
-          </div>
-        } @else {
-          <div
-            class="k-columnmenu-item"
-            (click)="onClick($event)"
-            (keydown.enter)="onClick($event)"
-            [class.k-selected]="selected"
-            [class.k-disabled]="disabled"
-            [class.k-focus]="focused"
-            role="button"
-            [attr.aria-expanded]="expanded"
-            [attr.aria-controls]="expanded ? contentId : undefined">
-            @if (icon || svgIcon) {
-              <kendo-icon-wrapper
-                [name]="icon"
-              [svgIcon]="svgIcon"></kendo-icon-wrapper>
-            }
-            {{ text }}
-            @if ((ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'sortToolbarTool' && sortDescriptor(column.field).dir)) {
-              <span
-                class="k-columnmenu-indicators">
-                <kendo-icon-wrapper
-                  [name]="sortDescriptor(column.field).dir === 'asc' ? 'sort-asc-small' : 'sort-desc-small'"
-                  [svgIcon]="sortDescriptor(column.field).dir === 'asc' ? sortAscSmallIcon : sortDescSmallIcon">
-                </kendo-icon-wrapper>
-                @if (showSortNumbering(column)) {
-                  <span class="k-sort-index">{{sortOrder(column.field)}}</span>
-                }
-              </span>
-            }
-            @if ((ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'filterToolbarTool' && hasFilters) || indicatorIcon) {
-              <kendo-icon-wrapper
-                class="k-columnmenu-indicators"
-                name="filter"
-                [svgIcon]="filterIcon">
-              </kendo-icon-wrapper>
-            }
-            @if (contentTemplate && adaptiveGridService.viewType !== 'sortToolbarTool') {
-              <span class="k-spacer"></span>
-            }
-            @if (contentTemplate && adaptiveGridService.viewType !== 'sortToolbarTool') {
-              <span class="k-expander-indicator">
-                <kendo-icon-wrapper
-                  [name]="expandedIcon"
-                  [svgIcon]="expandedSvgIcon">
-                </kendo-icon-wrapper>
-              </span>
-            }
-          </div>
-          @if (contentTemplate) {
-            <div [attr.id]="contentId" [@state]="contentState" [style.overflow]="'hidden'" class="k-columnmenu-item-content">
-              <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
-              </ng-container>
-            </div>
-          }
-        }
-        
-        <ng-template #content>
-          <div
-            class="k-columnmenu-item"
-            (click)="onClick($event)"
-            (keydown.enter)="onClick($event)"
-            [class.k-selected]="selected"
-            [class.k-disabled]="disabled"
-            [class.k-focus]="focused"
-            role="button"
-            [attr.aria-expanded]="expanded"
-            [attr.aria-controls]="expanded ? contentId : undefined">
-            @if (icon || svgIcon) {
-              <kendo-icon-wrapper
-                [name]="icon"
-              [svgIcon]="svgIcon"></kendo-icon-wrapper>
-            }
-            {{ text }}
-            @if ((ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'sortToolbarTool' && sortDescriptor(column.field).dir)) {
-              <span
-                class="k-columnmenu-indicators">
-                <kendo-icon-wrapper
-                  [name]="sortDescriptor(column.field).dir === 'asc' ? 'sort-asc-small' : 'sort-desc-small'"
-                  [svgIcon]="sortDescriptor(column.field).dir === 'asc' ? sortAscSmallIcon : sortDescSmallIcon">
-                </kendo-icon-wrapper>
-                @if (showSortNumbering(column)) {
-                  <span class="k-sort-index">{{sortOrder(column.field)}}</span>
-                }
-              </span>
-            }
-            @if ((ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'filterToolbarTool' && hasFilters) || indicatorIcon) {
-              <kendo-icon-wrapper
-                class="k-columnmenu-indicators"
-                name="filter"
-                [svgIcon]="filterIcon">
-              </kendo-icon-wrapper>
-            }
-            @if (contentTemplate && adaptiveGridService.viewType !== 'sortToolbarTool') {
-              <span class="k-spacer"></span>
-            }
-            @if (contentTemplate && adaptiveGridService.viewType !== 'sortToolbarTool') {
-              <span class="k-expander-indicator">
-                <kendo-icon-wrapper
-                  [name]="expandedIcon"
-                  [svgIcon]="expandedSvgIcon">
-                </kendo-icon-wrapper>
-              </span>
-            }
-          </div>
-          @if (contentTemplate) {
-            <div [attr.id]="contentId" [@state]="contentState" [style.overflow]="'hidden'" class="k-columnmenu-item-content">
-              <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
-              </ng-container>
-            </div>
-          }
-        </ng-template>
-        `, isInline: true, dependencies: [{ kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
-            trigger('state', [
-                state('collapsed', style({ display: 'none' })),
-                state('expanded', style({ display: 'block' })),
-                transition('collapsed => expanded', [
-                    style({
-                        height: '0px',
-                        display: 'block'
-                    }),
-                    animate('100ms ease-in', style({
-                        height: '*'
-                    }))
-                ]),
-                transition('expanded => collapsed', [
-                    style({
-                        height: '*'
-                    }),
-                    animate('100ms ease-in', style({
-                        height: '0px'
-                    }))
-                ])
-            ])
-        ] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnMenuItemComponent, decorators: [{
-            type: Component,
-            args: [{
-                    animations: [
-                        trigger('state', [
-                            state('collapsed', style({ display: 'none' })),
-                            state('expanded', style({ display: 'block' })),
-                            transition('collapsed => expanded', [
-                                style({
-                                    height: '0px',
-                                    display: 'block'
-                                }),
-                                animate('100ms ease-in', style({
-                                    height: '*'
-                                }))
-                            ]),
-                            transition('expanded => collapsed', [
-                                style({
-                                    height: '*'
-                                }),
-                                animate('100ms ease-in', style({
-                                    height: '0px'
-                                }))
-                            ])
-                        ])
-                    ],
-                    selector: 'kendo-grid-columnmenu-item',
-                    template: `
-        @if (contentTemplate) {
-          <div class="k-expander">
-            <ng-container [ngTemplateOutlet]="content"></ng-container>
-          </div>
-        } @else {
-          <div
-            class="k-columnmenu-item"
-            (click)="onClick($event)"
-            (keydown.enter)="onClick($event)"
-            [class.k-selected]="selected"
-            [class.k-disabled]="disabled"
-            [class.k-focus]="focused"
-            role="button"
-            [attr.aria-expanded]="expanded"
-            [attr.aria-controls]="expanded ? contentId : undefined">
-            @if (icon || svgIcon) {
-              <kendo-icon-wrapper
-                [name]="icon"
-              [svgIcon]="svgIcon"></kendo-icon-wrapper>
-            }
-            {{ text }}
-            @if ((ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'sortToolbarTool' && sortDescriptor(column.field).dir)) {
-              <span
-                class="k-columnmenu-indicators">
-                <kendo-icon-wrapper
-                  [name]="sortDescriptor(column.field).dir === 'asc' ? 'sort-asc-small' : 'sort-desc-small'"
-                  [svgIcon]="sortDescriptor(column.field).dir === 'asc' ? sortAscSmallIcon : sortDescSmallIcon">
-                </kendo-icon-wrapper>
-                @if (showSortNumbering(column)) {
-                  <span class="k-sort-index">{{sortOrder(column.field)}}</span>
-                }
-              </span>
-            }
-            @if ((ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'filterToolbarTool' && hasFilters) || indicatorIcon) {
-              <kendo-icon-wrapper
-                class="k-columnmenu-indicators"
-                name="filter"
-                [svgIcon]="filterIcon">
-              </kendo-icon-wrapper>
-            }
-            @if (contentTemplate && adaptiveGridService.viewType !== 'sortToolbarTool') {
-              <span class="k-spacer"></span>
-            }
-            @if (contentTemplate && adaptiveGridService.viewType !== 'sortToolbarTool') {
-              <span class="k-expander-indicator">
-                <kendo-icon-wrapper
-                  [name]="expandedIcon"
-                  [svgIcon]="expandedSvgIcon">
-                </kendo-icon-wrapper>
-              </span>
-            }
-          </div>
-          @if (contentTemplate) {
-            <div [attr.id]="contentId" [@state]="contentState" [style.overflow]="'hidden'" class="k-columnmenu-item-content">
-              <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
-              </ng-container>
-            </div>
-          }
-        }
-        
-        <ng-template #content>
-          <div
-            class="k-columnmenu-item"
-            (click)="onClick($event)"
-            (keydown.enter)="onClick($event)"
-            [class.k-selected]="selected"
-            [class.k-disabled]="disabled"
-            [class.k-focus]="focused"
-            role="button"
-            [attr.aria-expanded]="expanded"
-            [attr.aria-controls]="expanded ? contentId : undefined">
-            @if (icon || svgIcon) {
-              <kendo-icon-wrapper
-                [name]="icon"
-              [svgIcon]="svgIcon"></kendo-icon-wrapper>
-            }
-            {{ text }}
-            @if ((ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'sortToolbarTool' && sortDescriptor(column.field).dir)) {
-              <span
-                class="k-columnmenu-indicators">
-                <kendo-icon-wrapper
-                  [name]="sortDescriptor(column.field).dir === 'asc' ? 'sort-asc-small' : 'sort-desc-small'"
-                  [svgIcon]="sortDescriptor(column.field).dir === 'asc' ? sortAscSmallIcon : sortDescSmallIcon">
-                </kendo-icon-wrapper>
-                @if (showSortNumbering(column)) {
-                  <span class="k-sort-index">{{sortOrder(column.field)}}</span>
-                }
-              </span>
-            }
-            @if ((ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'filterToolbarTool' && hasFilters) || indicatorIcon) {
-              <kendo-icon-wrapper
-                class="k-columnmenu-indicators"
-                name="filter"
-                [svgIcon]="filterIcon">
-              </kendo-icon-wrapper>
-            }
-            @if (contentTemplate && adaptiveGridService.viewType !== 'sortToolbarTool') {
-              <span class="k-spacer"></span>
-            }
-            @if (contentTemplate && adaptiveGridService.viewType !== 'sortToolbarTool') {
-              <span class="k-expander-indicator">
-                <kendo-icon-wrapper
-                  [name]="expandedIcon"
-                  [svgIcon]="expandedSvgIcon">
-                </kendo-icon-wrapper>
-              </span>
-            }
-          </div>
-          @if (contentTemplate) {
-            <div [attr.id]="contentId" [@state]="contentState" [style.overflow]="'hidden'" class="k-columnmenu-item-content">
-              <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
-              </ng-container>
-            </div>
-          }
-        </ng-template>
-        `,
-                    standalone: true,
-                    imports: [IconWrapperComponent, NgTemplateOutlet]
-                }]
-        }], ctorParameters: () => [{ type: i0.NgZone }, { type: i1.ContextService }, { type: i2.AdaptiveGridService }, { type: i0.ElementRef }], propDecorators: { itemClick: [{
-                type: Output
-            }], expand: [{
-                type: Output
-            }], collapse: [{
-                type: Output
-            }], icon: [{
-                type: Input
-            }], svgIcon: [{
-                type: Input
-            }], indicatorIcon: [{
-                type: Input
-            }], text: [{
-                type: Input
-            }], selected: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], expanded: [{
-                type: Input
-            }], focused: [{
-                type: Input
-            }], service: [{
-                type: Input
-            }], column: [{
-                type: Input
-            }], contentTemplate: [{
-                type: ContentChild,
-                args: [ColumnMenuItemContentTemplateDirective]
-            }] } });

package/esm2022/column-menu/column-menu-item.directive.mjs

@@ -1,164 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { ChangeDetectorRef, Directive, ElementRef, Input, NgZone, Renderer2 } from '@angular/core';
-import { Subscription } from 'rxjs';
-import { Keys } from '@progress/kendo-angular-common';
-import { ColumnMenuPositionComponent } from './column-menu-position.component';
-import { ColumnMenuChooserComponent } from './column-menu-chooser.component';
-import { ColumnMenuFilterComponent } from './column-menu-filter.component';
-import { ContextService } from '../common/provider.service';
-import * as i0 from "@angular/core";
-import * as i1 from "../common/provider.service";
-/**
- * Represents a directive that manages keyboard navigation for a column menu item ([see example](slug:columnmenu_grid#customizing-the-content)).
- *
- * @example
- * ```html
- * <ng-template kendoGridColumnMenuTemplate let-service="service" let-column="column">
- *   <kendo-grid-columnmenu-sort #sortItem [kendoGridColumnMenuItem]="sortItem" [service]="service"></kendo-grid-columnmenu-sort>
- * </ng-template>
- * ```
- * @remarks
- * Applied to:
- * {@link ColumnMenuChooserComponent},
- * {@link ColumnMenuFilterComponent},
- * {@link ColumnMenuSortComponent},
- * {@link ColumnMenuLockComponent},
- * {@link ColumnMenuStickyComponent},
- * {@link ColumnMenuComponent},
- * {@link ColumnMenuItemComponent},
- * {@link ColumnMenuPositionComponent},
- * {@link ColumnMenuAutoSizeAllColumnsComponent},
- * {@link ColumnMenuAutoSizeColumnComponent}.
- */
-export class ColumnMenuItemDirective {
-    hostElement;
-    renderer;
-    ngZone;
-    cdr;
-    ctx;
-    /**
-     * Reference to the Grid column menu item. Required when you want to include the item in the built-in keyboard navigation.
-     */
-    menuItemComponent;
-    /**
-     * Holds the first focusable element.
-     */
-    firstFocusableElement;
-    /**
-     * Holds the last focusable element.
-     */
-    lastFocusableElement;
-    /**
-     * @hidden
-     */
-    set isFirst(value) {
-        if (value) {
-            const focusableElement = this.columnMenuItems[0];
-            this.menuItemComponent.service.menuTabbingService.firstFocusable = focusableElement;
-            this.ngZone.runOutsideAngular(() => {
-                const firstItemKeydownSub = this.renderer.listen(focusableElement, 'keydown', this.onTab);
-                this.subs.add(firstItemKeydownSub);
-            });
-        }
-        this._isFirst = value;
-    }
-    /**
-     * @hidden
-     */
-    get isFirst() {
-        return this._isFirst;
-    }
-    /**
-     * @hidden
-     */
-    set isLast(value) {
-        if (!this.columnMenuItems) {
-            return;
-        }
-        if (value) {
-            const lastFocusableElement = this.getLastColumnMenuItem();
-            this.menuItemComponent.service.menuTabbingService.lastFocusable = lastFocusableElement;
-            this.ngZone.runOutsideAngular(() => {
-                const lastItemKeydownSub = this.renderer.listen(lastFocusableElement, 'keydown', this.onTab);
-                this.subs.add(lastItemKeydownSub);
-            });
-            if (this.isExpandableItem()) {
-                this.menuItemComponent.isLast = true;
-                if (this.ctx.grid.isActionSheetExpanded) {
-                    this.cdr.detectChanges();
-                }
-            }
-        }
-        this._isLast = value;
-    }
-    /**
-     * @hidden
-     */
-    get isLast() {
-        return this._isLast;
-    }
-    _isFirst = false;
-    _isLast = false;
-    columnMenuItems;
-    subs = new Subscription();
-    constructor(hostElement, renderer, ngZone, cdr, ctx) {
-        this.hostElement = hostElement;
-        this.renderer = renderer;
-        this.ngZone = ngZone;
-        this.cdr = cdr;
-        this.ctx = ctx;
-    }
-    ngAfterViewInit() {
-        this.columnMenuItems = this.hostElement.nativeElement.querySelectorAll('.k-columnmenu-item');
-        [].slice.apply(this.columnMenuItems).forEach(el => this.renderer.setAttribute(el, 'tabindex', '0'));
-        if (this.menuItemComponent instanceof ColumnMenuFilterComponent) {
-            this.menuItemComponent.service.menuTabbingService.isColumnMenu = true;
-        }
-        this.menuItemComponent.service?.columnMenuContainer?.templateMenuItems.push(this);
-    }
-    ngOnDestroy() {
-        if (this.subs) {
-            this.subs.unsubscribe();
-        }
-    }
-    onTab = (e) => {
-        if (e.code !== Keys.Tab) {
-            return;
-        }
-        if (this.isFirst && e.shiftKey && e.target === this.columnMenuItems[0]) {
-            e.preventDefault();
-            this.menuItemComponent.service.menuTabbingService.lastFocusable.focus();
-        }
-        if (this.isLast && !e.shiftKey) {
-            const lastColumnMenuItem = this.getLastColumnMenuItem();
-            const isExpanded = this.menuItemComponent.expanded;
-            if (lastColumnMenuItem === e.target && !isExpanded) {
-                e.preventDefault();
-                this.menuItemComponent.service.menuTabbingService.firstFocusable.focus();
-            }
-        }
-    };
-    getLastColumnMenuItem() {
-        return (this.columnMenuItems.length === 1 ? this.columnMenuItems[0] : this.columnMenuItems[1]);
-    }
-    isExpandableItem() {
-        return this.menuItemComponent instanceof ColumnMenuFilterComponent ||
-            this.menuItemComponent instanceof ColumnMenuChooserComponent ||
-            this.menuItemComponent instanceof ColumnMenuPositionComponent;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnMenuItemDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i1.ContextService }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: ColumnMenuItemDirective, isStandalone: true, selector: "[kendoGridColumnMenuItem]", inputs: { menuItemComponent: ["kendoGridColumnMenuItem", "menuItemComponent"] }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnMenuItemDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoGridColumnMenuItem]',
-                    standalone: true
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i1.ContextService }], propDecorators: { menuItemComponent: [{
-                type: Input,
-                args: ['kendoGridColumnMenuItem']
-            }] } });