@progress/kendo-angular-grid 21.4.1 → 22.0.0

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

@@ -1,839 +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 { MenuTabbingService } from './../filtering/menu/menu-tabbing.service';
-import { NavigationService } from './../navigation/navigation.service';
-import { Component, Renderer2, Input, TemplateRef, HostBinding, ElementRef, ViewChild, isDevMode, ChangeDetectorRef, Optional } from '@angular/core';
-import { SinglePopupService } from '../common/single-popup.service';
-import { ColumnMenuService } from './column-menu.service';
-import { filtersByField } from '../filtering/base-filter-cell.component';
-import { hasFilter, hasSort, hasLock, hasStick, hasColumnChooser, hasAutoSizeColumn, hasPosition, hasAutoSizeAllColumns } from './utils';
-import { ContextService } from '../common/provider.service';
-import { ColumnMenuErrorMessages } from '../common/error-messages';
-import { moreVerticalIcon, columnsIcon, filterIcon, slidersIcon } from '@progress/kendo-svg-icons';
-import { TabContentDirective, TabStripComponent, TabStripTabComponent, TabTitleDirective } from '@progress/kendo-angular-layout';
-import { ColumnInfoService } from '../common/column-info.service';
-import { IdService } from '../common/id.service';
-import { FilterMenuContainerComponent } from '../filtering/menu/filter-menu-container.component';
-import { ColumnMenuFilterComponent } from './column-menu-filter.component';
-import { ColumnMenuAutoSizeAllColumnsComponent } from './column-menu-autosize-all.component';
-import { ColumnMenuAutoSizeColumnComponent } from './column-menu-autosize.component';
-import { ColumnMenuChooserComponent } from './column-menu-chooser.component';
-import { ColumnMenuPositionComponent } from './column-menu-position.component';
-import { ColumnMenuStickComponent } from './column-menu-stick.component';
-import { ColumnMenuLockComponent } from './column-menu-lock.component';
-import { ColumnMenuItemDirective } from './column-menu-item.directive';
-import { ColumnMenuSortComponent } from './column-menu-sort.component';
-import { ColumnMenuContainerComponent } from './column-menu-container.component';
-import { NgClass, NgTemplateOutlet } from '@angular/common';
-import { IconWrapperComponent } from '@progress/kendo-angular-icons';
-import { AdaptiveGridService } from '../common/adaptiveness.service';
-import { replaceMessagePlaceholder } from '@progress/kendo-angular-common';
-import { ColumnChooserContentComponent } from './column-chooser-content.component';
-import * as i0 from "@angular/core";
-import * as i1 from "./../navigation/navigation.service";
-import * as i2 from "../common/single-popup.service";
-import * as i3 from "./column-menu.service";
-import * as i4 from "../common/provider.service";
-import * as i5 from "../common/column-info.service";
-import * as i6 from "../common/id.service";
-import * as i7 from "../common/adaptiveness.service";
-const POPUP_CLASSES = 'k-grid-columnmenu-popup k-column-menu';
-let id = 0;
-const getId = (gridId) => `${gridId}-column-menu-${id++}`;
-/**
- * Represents the [column menu](slug:columnmenu_grid#toc-customizing-the-position) component.
- *
- * @example
- * ```html
- * <kendo-grid ...>
- *   <kendo-grid-column field="ProductName" [columnMenu]="false">
- *     <ng-template kendoGridHeaderTemplate let-column>
- *       <kendo-grid-column-menu [column]="column"></kendo-grid-column-menu>
- *     </ng-template>
- *   </kendo-grid-column>
- * </kendo-grid>
- * ```
- * @example
- * ```html
- * <kendo-grid-column field="ProductName">
- *   <ng-template kendoGridColumnMenuTemplate let-service="service">
- *     <kendo-grid-column-menu [column]="column"></kendo-grid-column-menu>
- *   </ng-template>
- * </kendo-grid-column>
- * ```
- */
-export class ColumnMenuComponent {
-    navigationService;
-    popupService;
-    service;
-    ctx;
-    renderer;
-    cdr;
-    columnInfoService;
-    idService;
-    adaptiveGridService;
-    /**
-     * @hidden
-     */
-    standalone = true;
-    /**
-     * The Grid column instance controlled by the menu.
-     */
-    column;
-    /**
-     * The settings for the column menu.
-     */
-    settings = {};
-    /**
-     * The sort descriptors for the Grid data.
-     * Typically bound to [`GridComponent.sort`]({% slug api_grid_gridcomponent %}#toc-sort).
-     */
-    sort;
-    /**
-     * The filter descriptor for the Grid data.
-     * Typically bound to [`GridComponent.filter`]({% slug api_grid_gridcomponent %}#toc-filter).
-     */
-    filter;
-    /**
-     * @hidden
-     */
-    sortable = true;
-    /**
-     * @hidden
-     */
-    columnMenuTemplate;
-    /**
-     * @hidden
-     */
-    tabIndex = '-1';
-    anchor;
-    template;
-    defaultTemplate;
-    tabbedInterfaceTemplate;
-    tabStrip;
-    /**
-     * @hidden
-     */
-    columnsIcon = columnsIcon;
-    /**
-     * @hidden
-     */
-    actionsClass = 'k-actions';
-    /**
-     * @hidden
-     */
-    slidersIcon = slidersIcon;
-    /**
-     * @hidden
-     */
-    filterIcon = filterIcon;
-    /**
-     * @hidden
-     */
-    expandedFilter = false;
-    /**
-     * @hidden
-     */
-    expandedColumns = false;
-    /**
-     * @hidden
-     */
-    expandedPosition = false;
-    /**
-     * @hidden
-     */
-    get showGeneralTab() {
-        return this.hasSort
-            || this.hasLock
-            || this.hasStick
-            || this.hasPosition
-            || this.hasAutoSizeColumn
-            || this.hasAutoSizeAllColumns;
-    }
-    moreVerticalIcon = moreVerticalIcon;
-    popupRef;
-    closeSubscription;
-    popupSubs;
-    constructor(navigationService, popupService, service, ctx, renderer, cdr, columnInfoService, idService, adaptiveGridService) {
-        this.navigationService = navigationService;
-        this.popupService = popupService;
-        this.service = service;
-        this.ctx = ctx;
-        this.renderer = renderer;
-        this.cdr = cdr;
-        this.columnInfoService = columnInfoService;
-        this.idService = idService;
-        this.adaptiveGridService = adaptiveGridService;
-        this.closeSubscription = service.closeMenu.subscribe(this.close.bind(this, true));
-    }
-    /**
-     * @hidden
-     */
-    get isActive() {
-        return (this.hasFilter && filtersByField(this.filter, this.column.field).length > 0) ||
-            (!this.sortable && this.hasSort && this.sort.find(descriptor => descriptor.field === this.column.field));
-    }
-    /**
-     * @hidden
-     */
-    get hasFilter() {
-        return hasFilter(this.settings, this.column);
-    }
-    /**
-     * @hidden
-     */
-    get isNavigable() {
-        return this.navigationService.tableEnabled;
-    }
-    /**
-     * @hidden
-     */
-    get hasSort() {
-        return hasSort(this.settings, this.column);
-    }
-    /**
-     * @hidden
-     */
-    get hasColumnChooser() {
-        return hasColumnChooser(this.settings);
-    }
-    /**
-     * @hidden
-     */
-    get hasAutoSizeColumn() {
-        return hasAutoSizeColumn(this.settings);
-    }
-    /**
-     * @hidden
-     */
-    get hasAutoSizeAllColumns() {
-        return hasAutoSizeAllColumns(this.settings);
-    }
-    /**
-     * @hidden
-     */
-    get hasLock() {
-        return hasLock(this.settings, this.column);
-    }
-    /**
-     * @hidden
-     */
-    get hasStick() {
-        return hasStick(this.settings, this.column);
-    }
-    /**
-     * @hidden
-     */
-    get hasPosition() {
-        return hasPosition(this.settings, this.column);
-    }
-    /**
-     * @hidden
-     */
-    get columns() {
-        return this.columnInfoService.leafNamedColumns;
-    }
-    ngAfterViewInit() {
-        if (this.ctx.grid.virtualColumns && isDevMode()) {
-            if (this.settings.autoSizeAllColumns) {
-                this.settings.autoSizeAllColumns = false;
-                console.warn(ColumnMenuErrorMessages.autoSizeAllColumns);
-            }
-            if (this.settings.autoSizeColumn) {
-                this.settings.autoSizeColumn = false;
-                console.warn(ColumnMenuErrorMessages.autoSizeColumn);
-            }
-        }
-        this.service.menuTabbingService.isTabbedInterface = this.settings.view === 'tabbed' ? true : false;
-    }
-    ngOnChanges() {
-        this.service.column = this.column;
-        this.service.sort = this.sort;
-        this.service.filter = this.filter;
-        this.service.sortable = this.sortable;
-    }
-    ngOnDestroy() {
-        this.close();
-        this.closeSubscription.unsubscribe();
-        this.popupSubs?.unsubscribe();
-        this.closeSubscription = this.popupSubs = null;
-    }
-    /**
-     * @hidden
-     */
-    toggle(e, anchor, template) {
-        if (e) {
-            e.preventDefault();
-            e instanceof KeyboardEvent && e.stopImmediatePropagation();
-        }
-        if (this.ctx.grid.adaptiveMode === 'auto' && this.adaptiveGridService.windowSize !== 'large') {
-            if (!this.ctx.grid.isActionSheetExpanded) {
-                this.adaptiveGridService.viewType = 'columnMenu';
-                this.adaptiveGridService.columns = this.columns;
-                this.adaptiveGridService.columnMenuService = this.service;
-                this.adaptiveGridService.column = this.column;
-                this.ctx.grid.adaptiveRenderer.actionSheet.toggle(true);
-            }
-        }
-        else {
-            this.expandedFilter = this.getExpandedState(this.settings.filter);
-            this.expandedColumns = this.getExpandedState(this.settings.columnChooser);
-            this.expandedPosition = this.getExpandedState(this.settings.setColumnPosition);
-            this.popupRef = this.popupService.open(anchor, template, this.popupRef, POPUP_CLASSES);
-            // Needed as changes to 'popupRef' and 'popupId' are not reflected
-            // automatically when the Popup is closed by clicking outside the anchor
-            const ariaRoot = this.isNavigable ? anchor.closest('.k-table-th') : anchor;
-            if (this.popupRef) {
-                this.popupSubs?.unsubscribe();
-                this.popupSubs = this.popupRef.popup.instance.anchorViewportLeave.subscribe(() => {
-                    this.popupSubs?.unsubscribe();
-                    this.popupSubs = null;
-                    this.close(true);
-                    this.updateAria(ariaRoot);
-                });
-                this.popupSubs.add(() => this.popupRef.popup.instance.close.subscribe(() => {
-                    this.popupSubs?.unsubscribe();
-                    this.popupSubs = this.popupRef = null;
-                    this.updateAria(ariaRoot);
-                }));
-                const popupAriaElement = this.popupRef.popupElement.querySelector('.k-grid-columnmenu-popup');
-                if (popupAriaElement) {
-                    const popupId = getId(this.idService?.gridId());
-                    this.renderer.setAttribute(popupAriaElement, 'id', popupId);
-                    this.renderer.setAttribute(popupAriaElement, 'role', 'dialog');
-                    this.renderer.setAttribute(popupAriaElement, 'aria-label', this.columnMenuTitle);
-                    ariaRoot && this.renderer.setAttribute(ariaRoot, 'aria-controls', popupId);
-                    ariaRoot && this.renderer.setAttribute(ariaRoot, 'aria-expanded', 'true');
-                }
-                if (this.settings.view === 'tabbed') {
-                    this.renderer.addClass(popupAriaElement, 'k-column-menu-tabbed');
-                    this.renderer.addClass(popupAriaElement, 'k-column-menu');
-                    this.cdr.detectChanges();
-                    this.tabStrip?.selectTab(0);
-                }
-            }
-            else {
-                this.focusRoot();
-            }
-        }
-    }
-    /**
-     * @hidden
-     */
-    close(triggerFocus = false) {
-        if (this.ctx.grid.adaptiveMode === 'auto' && this.adaptiveGridService.windowSize !== 'large') {
-            this.ctx.grid.adaptiveRenderer.actionSheet.toggle(false);
-        }
-        else {
-            this.popupService.destroy();
-            this.popupRef = null;
-            this.cdr.markForCheck();
-        }
-        if (!triggerFocus) {
-            return;
-        }
-        this.focusRoot();
-    }
-    /**
-     * @hidden
-     */
-    get columnMenuTitle() {
-        const localizationMsg = this.ctx.localization.get('columnMenu') || '';
-        const columnName = this.column.title || this.column.field;
-        return replaceMessagePlaceholder(localizationMsg, 'columnName', columnName);
-    }
-    getExpandedState(menuItemSettings) {
-        return typeof (menuItemSettings) === 'object' ? menuItemSettings.expanded : false;
-    }
-    updateAria(ariaRoot) {
-        ariaRoot && this.renderer.removeAttribute(ariaRoot, 'aria-controls');
-        ariaRoot && this.renderer.setAttribute(ariaRoot, 'aria-expanded', 'false');
-    }
-    focusRoot() {
-        if (this.isNavigable) {
-            this.navigationService.preventScroll = true;
-            this.navigationService.focusCell(0, this.column.leafIndex);
-        }
-        else {
-            this.anchor.nativeElement.focus({ preventScroll: true });
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnMenuComponent, deps: [{ token: i1.NavigationService }, { token: i2.SinglePopupService }, { token: i3.ColumnMenuService }, { token: i4.ContextService }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i5.ColumnInfoService }, { token: i6.IdService, optional: true }, { token: i7.AdaptiveGridService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ColumnMenuComponent, isStandalone: true, selector: "kendo-grid-column-menu", inputs: { standalone: "standalone", column: "column", settings: "settings", sort: "sort", filter: "filter", sortable: "sortable", columnMenuTemplate: "columnMenuTemplate", tabIndex: "tabIndex" }, host: { properties: { "class.k-grid-column-menu-standalone": "this.standalone" } }, providers: [
-            ColumnMenuService,
-            MenuTabbingService
-        ], viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }, { propertyName: "template", first: true, predicate: ["template"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultTemplate", first: true, predicate: ["defaultTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "tabbedInterfaceTemplate", first: true, predicate: ["tabbedInterfaceTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "tabStrip", first: true, predicate: TabStripComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
-        <a #anchor
-          class="k-grid-header-menu k-grid-column-menu"
-          [ngClass]="{ 'k-active': isActive }"
-          (click)="toggle($event, anchor, template)"
-          (keydown.enter)="$event.stopImmediatePropagation()"
-          href="#"
-          [tabindex]="tabIndex"
-          [attr.title]="columnMenuTitle"
-          [attr.aria-expanded]="isNavigable ? undefined : false"
-          [attr.aria-haspopup]="isNavigable ? undefined : 'dialog'">
-          <kendo-icon-wrapper
-            name="more-vertical"
-          [svgIcon]="moreVerticalIcon"></kendo-icon-wrapper>
-        </a>
-        <ng-template #template>
-          <kendo-grid-columnmenu-container
-            (keydown.escape)="close(true)"
-            (keydown.enter)="$event.stopImmediatePropagation()">
-            <ng-container
-              [ngTemplateOutlet]="column.columnMenuTemplateRef || columnMenuTemplate || (settings.view === 'tabbed' ? tabbedInterfaceTemplate : defaultTemplate)"
-              [ngTemplateOutletContext]="{ service: service, column: column }">
-            </ng-container>
-          </kendo-grid-columnmenu-container>
-        </ng-template>
-        <ng-template #defaultTemplate>
-          <kendo-grid-columnmenu-container
-            (keydown.escape)="close(true)"
-            (keydown.enter)="$event.stopImmediatePropagation()">
-            @if (hasSort) {
-              <kendo-grid-columnmenu-sort #sortItem [kendoGridColumnMenuItem]="sortItem" [service]="service">
-              </kendo-grid-columnmenu-sort>
-            }
-            @if (hasLock && !hasPosition) {
-              <kendo-grid-columnmenu-lock #lockItem [kendoGridColumnMenuItem]="lockItem" [service]="service">
-              </kendo-grid-columnmenu-lock>
-            }
-            @if (hasStick && !hasPosition) {
-              <kendo-grid-columnmenu-stick #stickItem [kendoGridColumnMenuItem]="stickItem" [service]="service">
-              </kendo-grid-columnmenu-stick>
-            }
-            @if (hasPosition) {
-              <kendo-grid-columnmenu-position
-                #positionItem
-                [showLock]="hasLock"
-                [showStick]="hasStick"
-                [kendoGridColumnMenuItem]="positionItem"
-                [service]="service"
-                [expanded]="expandedPosition"
-                >
-              </kendo-grid-columnmenu-position>
-            }
-            @if (hasColumnChooser || hasAutoSizeColumn || hasAutoSizeAllColumns) {
-              <span [style.borderColor]="'rgba(0, 0, 0, 0.08)'" class="k-separator"></span>
-            }
-            @if (hasColumnChooser) {
-              <kendo-grid-columnmenu-chooser
-                #chooserItem
-                [kendoGridColumnMenuItem]="chooserItem"
-                [service]="service"
-                [expanded]="expandedColumns">
-              </kendo-grid-columnmenu-chooser>
-            }
-            @if (hasAutoSizeColumn) {
-              <kendo-grid-columnmenu-autosize-column
-                #autoSizeColumnItem
-                [service]="service"
-                [kendoGridColumnMenuItem]="autoSizeColumnItem"
-                [column]="column"
-                >
-              </kendo-grid-columnmenu-autosize-column>
-            }
-
-            @if (hasAutoSizeAllColumns) {
-              <kendo-grid-columnmenu-autosize-all-columns
-                #autoSizeAllColumnsItem
-                [service]="service"
-                [kendoGridColumnMenuItem]="autoSizeAllColumnsItem"
-                >
-              </kendo-grid-columnmenu-autosize-all-columns>
-            }
-            @if (hasColumnChooser || hasAutoSizeColumn || hasAutoSizeAllColumns) {
-              <span [style.borderColor]="'rgba(0, 0, 0, 0.08)'" class="k-separator"></span>
-            }
-            @if (hasFilter) {
-              <kendo-grid-columnmenu-filter
-                #filterItem
-                [kendoGridColumnMenuItem]="filterItem"
-                [service]="service"
-                [expanded]="expandedFilter">
-              </kendo-grid-columnmenu-filter>
-            }
-          </kendo-grid-columnmenu-container>
-        </ng-template>
-        <ng-template #tabbedInterfaceTemplate>
-          <kendo-tabstrip #tabstrip
-            (keydown.escape)="close(true)">
-            @if (hasFilter) {
-              <kendo-tabstrip-tab>
-                <ng-template kendoTabTitle>
-                  <kendo-icon-wrapper
-                    [attr.title]="ctx.localization.get('columnMenuFilterTabTitle')"
-                    name="filter"
-                    [svgIcon]="filterIcon">
-                  </kendo-icon-wrapper>
-                </ng-template>
-                <ng-template kendoTabContent>
-                  <kendo-grid-filter-menu-container
-                    [column]="service.column"
-                    [menuTabbingService]="service.menuTabbingService"
-                    [filter]="service.filter"
-                    [actionsClass]="actionsClass"
-                    (keydown.shift.tab)="$event.stopImmediatePropagation()"
-                    (close)="close()">
-                  </kendo-grid-filter-menu-container>
-                </ng-template>
-              </kendo-tabstrip-tab>
-            }
-            @if (showGeneralTab) {
-              <kendo-tabstrip-tab>
-                <ng-template kendoTabTitle>
-                  <kendo-icon-wrapper
-                    [attr.title]="ctx.localization.get('columnMenuGeneralTabTitle')"
-                    name="sliders"
-                    [svgIcon]="slidersIcon">
-                  </kendo-icon-wrapper>
-                </ng-template>
-                <ng-template kendoTabContent>
-                  @if (hasSort) {
-                    <kendo-grid-columnmenu-sort #sortItem [kendoGridColumnMenuItem]="sortItem" [service]="service">
-                    </kendo-grid-columnmenu-sort>
-                  }
-                  @if (hasSort && (hasLock || hasStick || hasPosition || hasAutoSizeColumn || hasAutoSizeAllColumns)) {
-                    <span [style.borderColor]="'rgba(0, 0, 0, 0.08)'" class="k-separator"></span>
-                  }
-                  @if (hasLock && !hasPosition) {
-                    <kendo-grid-columnmenu-lock #lockItem [kendoGridColumnMenuItem]="lockItem" [service]="service">
-                    </kendo-grid-columnmenu-lock>
-                  }
-                  @if (hasStick && !hasPosition) {
-                    <kendo-grid-columnmenu-stick #stickItem [kendoGridColumnMenuItem]="stickItem" [service]="service">
-                    </kendo-grid-columnmenu-stick>
-                  }
-                  @if ((hasLock || hasStick) && !hasPosition && (hasAutoSizeColumn || hasAutoSizeAllColumns)) {
-                    <span [style.borderColor]="'rgba(0, 0, 0, 0.08)'" class="k-separator"></span>
-                  }
-                  @if (hasPosition) {
-                    <kendo-grid-columnmenu-position
-                      #positionItem
-                      [showLock]="hasLock"
-                      [showStick]="hasStick"
-                      [kendoGridColumnMenuItem]="positionItem"
-                      [service]="service"
-                      [expanded]="expandedPosition">
-                    </kendo-grid-columnmenu-position>
-                  }
-                  @if (hasPosition && (hasAutoSizeColumn || hasAutoSizeAllColumns)) {
-                    <span [style.borderColor]="'rgba(0, 0, 0, 0.08)'" class="k-separator"></span>
-                  }
-                  @if (hasAutoSizeColumn) {
-                    <kendo-grid-columnmenu-autosize-column
-                      #autoSizeColumnItem
-                      [service]="service"
-                      [kendoGridColumnMenuItem]="autoSizeColumnItem"
-                      [column]="column"
-                      >
-                    </kendo-grid-columnmenu-autosize-column>
-                  }
-                  @if (hasAutoSizeAllColumns) {
-                    <kendo-grid-columnmenu-autosize-all-columns
-                      #autoSizeAllColumnsItem
-                      [service]="service"
-                      [kendoGridColumnMenuItem]="autoSizeAllColumnsItem"
-                      >
-                    </kendo-grid-columnmenu-autosize-all-columns>
-                  }
-                </ng-template>
-              </kendo-tabstrip-tab>
-            }
-            @if (hasColumnChooser) {
-              <kendo-tabstrip-tab>
-                <ng-template kendoTabTitle>
-                  <kendo-icon-wrapper
-                    [attr.title]="ctx.localization.get('columnMenuColumnsTabTitle')"
-                    name="columns"
-                    [svgIcon]="columnsIcon">
-                  </kendo-icon-wrapper>
-                </ng-template>
-                <ng-template kendoTabContent>
-                  <kendo-grid-column-chooser-content
-                    [columns]="columns"
-                    [service]="service"
-                    (close)="close()"
-                    >
-                  </kendo-grid-column-chooser-content>
-                </ng-template>
-              </kendo-tabstrip-tab>
-            }
-          </kendo-tabstrip>
-        </ng-template>
-
-        `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: ColumnMenuContainerComponent, selector: "kendo-grid-columnmenu-container" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ColumnMenuSortComponent, selector: "kendo-grid-columnmenu-sort" }, { kind: "directive", type: ColumnMenuItemDirective, selector: "[kendoGridColumnMenuItem]", inputs: ["kendoGridColumnMenuItem"] }, { kind: "component", type: ColumnMenuLockComponent, selector: "kendo-grid-columnmenu-lock" }, { kind: "component", type: ColumnMenuStickComponent, selector: "kendo-grid-columnmenu-stick" }, { kind: "component", type: ColumnMenuPositionComponent, selector: "kendo-grid-columnmenu-position", inputs: ["expanded", "showLock", "showStick", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuChooserComponent, selector: "kendo-grid-columnmenu-chooser", inputs: ["expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuAutoSizeColumnComponent, selector: "kendo-grid-columnmenu-autosize-column", inputs: ["column"] }, { kind: "component", type: ColumnMenuAutoSizeAllColumnsComponent, selector: "kendo-grid-columnmenu-autosize-all-columns" }, { kind: "component", type: ColumnMenuFilterComponent, selector: "kendo-grid-columnmenu-filter", inputs: ["expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "size", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "component", type: TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: TabTitleDirective, selector: "[kendoTabTitle]" }, { kind: "directive", type: TabContentDirective, selector: "[kendoTabContent]" }, { kind: "component", type: FilterMenuContainerComponent, selector: "kendo-grid-filter-menu-container", inputs: ["column", "isLast", "isExpanded", "menuTabbingService", "filter", "actionsClass"], outputs: ["close"] }, { kind: "component", type: ColumnChooserContentComponent, selector: "kendo-grid-column-chooser-content", inputs: ["filterable", "showSelectAll", "showCheckedCount", "allowHideAll", "autoSync", "actionsClass", "closeOnReset", "columns", "isLast", "isExpanded", "service"], outputs: ["close"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnMenuComponent, decorators: [{
-            type: Component,
-            args: [{
-                    providers: [
-                        ColumnMenuService,
-                        MenuTabbingService
-                    ],
-                    selector: 'kendo-grid-column-menu',
-                    template: `
-        <a #anchor
-          class="k-grid-header-menu k-grid-column-menu"
-          [ngClass]="{ 'k-active': isActive }"
-          (click)="toggle($event, anchor, template)"
-          (keydown.enter)="$event.stopImmediatePropagation()"
-          href="#"
-          [tabindex]="tabIndex"
-          [attr.title]="columnMenuTitle"
-          [attr.aria-expanded]="isNavigable ? undefined : false"
-          [attr.aria-haspopup]="isNavigable ? undefined : 'dialog'">
-          <kendo-icon-wrapper
-            name="more-vertical"
-          [svgIcon]="moreVerticalIcon"></kendo-icon-wrapper>
-        </a>
-        <ng-template #template>
-          <kendo-grid-columnmenu-container
-            (keydown.escape)="close(true)"
-            (keydown.enter)="$event.stopImmediatePropagation()">
-            <ng-container
-              [ngTemplateOutlet]="column.columnMenuTemplateRef || columnMenuTemplate || (settings.view === 'tabbed' ? tabbedInterfaceTemplate : defaultTemplate)"
-              [ngTemplateOutletContext]="{ service: service, column: column }">
-            </ng-container>
-          </kendo-grid-columnmenu-container>
-        </ng-template>
-        <ng-template #defaultTemplate>
-          <kendo-grid-columnmenu-container
-            (keydown.escape)="close(true)"
-            (keydown.enter)="$event.stopImmediatePropagation()">
-            @if (hasSort) {
-              <kendo-grid-columnmenu-sort #sortItem [kendoGridColumnMenuItem]="sortItem" [service]="service">
-              </kendo-grid-columnmenu-sort>
-            }
-            @if (hasLock && !hasPosition) {
-              <kendo-grid-columnmenu-lock #lockItem [kendoGridColumnMenuItem]="lockItem" [service]="service">
-              </kendo-grid-columnmenu-lock>
-            }
-            @if (hasStick && !hasPosition) {
-              <kendo-grid-columnmenu-stick #stickItem [kendoGridColumnMenuItem]="stickItem" [service]="service">
-              </kendo-grid-columnmenu-stick>
-            }
-            @if (hasPosition) {
-              <kendo-grid-columnmenu-position
-                #positionItem
-                [showLock]="hasLock"
-                [showStick]="hasStick"
-                [kendoGridColumnMenuItem]="positionItem"
-                [service]="service"
-                [expanded]="expandedPosition"
-                >
-              </kendo-grid-columnmenu-position>
-            }
-            @if (hasColumnChooser || hasAutoSizeColumn || hasAutoSizeAllColumns) {
-              <span [style.borderColor]="'rgba(0, 0, 0, 0.08)'" class="k-separator"></span>
-            }
-            @if (hasColumnChooser) {
-              <kendo-grid-columnmenu-chooser
-                #chooserItem
-                [kendoGridColumnMenuItem]="chooserItem"
-                [service]="service"
-                [expanded]="expandedColumns">
-              </kendo-grid-columnmenu-chooser>
-            }
-            @if (hasAutoSizeColumn) {
-              <kendo-grid-columnmenu-autosize-column
-                #autoSizeColumnItem
-                [service]="service"
-                [kendoGridColumnMenuItem]="autoSizeColumnItem"
-                [column]="column"
-                >
-              </kendo-grid-columnmenu-autosize-column>
-            }
-
-            @if (hasAutoSizeAllColumns) {
-              <kendo-grid-columnmenu-autosize-all-columns
-                #autoSizeAllColumnsItem
-                [service]="service"
-                [kendoGridColumnMenuItem]="autoSizeAllColumnsItem"
-                >
-              </kendo-grid-columnmenu-autosize-all-columns>
-            }
-            @if (hasColumnChooser || hasAutoSizeColumn || hasAutoSizeAllColumns) {
-              <span [style.borderColor]="'rgba(0, 0, 0, 0.08)'" class="k-separator"></span>
-            }
-            @if (hasFilter) {
-              <kendo-grid-columnmenu-filter
-                #filterItem
-                [kendoGridColumnMenuItem]="filterItem"
-                [service]="service"
-                [expanded]="expandedFilter">
-              </kendo-grid-columnmenu-filter>
-            }
-          </kendo-grid-columnmenu-container>
-        </ng-template>
-        <ng-template #tabbedInterfaceTemplate>
-          <kendo-tabstrip #tabstrip
-            (keydown.escape)="close(true)">
-            @if (hasFilter) {
-              <kendo-tabstrip-tab>
-                <ng-template kendoTabTitle>
-                  <kendo-icon-wrapper
-                    [attr.title]="ctx.localization.get('columnMenuFilterTabTitle')"
-                    name="filter"
-                    [svgIcon]="filterIcon">
-                  </kendo-icon-wrapper>
-                </ng-template>
-                <ng-template kendoTabContent>
-                  <kendo-grid-filter-menu-container
-                    [column]="service.column"
-                    [menuTabbingService]="service.menuTabbingService"
-                    [filter]="service.filter"
-                    [actionsClass]="actionsClass"
-                    (keydown.shift.tab)="$event.stopImmediatePropagation()"
-                    (close)="close()">
-                  </kendo-grid-filter-menu-container>
-                </ng-template>
-              </kendo-tabstrip-tab>
-            }
-            @if (showGeneralTab) {
-              <kendo-tabstrip-tab>
-                <ng-template kendoTabTitle>
-                  <kendo-icon-wrapper
-                    [attr.title]="ctx.localization.get('columnMenuGeneralTabTitle')"
-                    name="sliders"
-                    [svgIcon]="slidersIcon">
-                  </kendo-icon-wrapper>
-                </ng-template>
-                <ng-template kendoTabContent>
-                  @if (hasSort) {
-                    <kendo-grid-columnmenu-sort #sortItem [kendoGridColumnMenuItem]="sortItem" [service]="service">
-                    </kendo-grid-columnmenu-sort>
-                  }
-                  @if (hasSort && (hasLock || hasStick || hasPosition || hasAutoSizeColumn || hasAutoSizeAllColumns)) {
-                    <span [style.borderColor]="'rgba(0, 0, 0, 0.08)'" class="k-separator"></span>
-                  }
-                  @if (hasLock && !hasPosition) {
-                    <kendo-grid-columnmenu-lock #lockItem [kendoGridColumnMenuItem]="lockItem" [service]="service">
-                    </kendo-grid-columnmenu-lock>
-                  }
-                  @if (hasStick && !hasPosition) {
-                    <kendo-grid-columnmenu-stick #stickItem [kendoGridColumnMenuItem]="stickItem" [service]="service">
-                    </kendo-grid-columnmenu-stick>
-                  }
-                  @if ((hasLock || hasStick) && !hasPosition && (hasAutoSizeColumn || hasAutoSizeAllColumns)) {
-                    <span [style.borderColor]="'rgba(0, 0, 0, 0.08)'" class="k-separator"></span>
-                  }
-                  @if (hasPosition) {
-                    <kendo-grid-columnmenu-position
-                      #positionItem
-                      [showLock]="hasLock"
-                      [showStick]="hasStick"
-                      [kendoGridColumnMenuItem]="positionItem"
-                      [service]="service"
-                      [expanded]="expandedPosition">
-                    </kendo-grid-columnmenu-position>
-                  }
-                  @if (hasPosition && (hasAutoSizeColumn || hasAutoSizeAllColumns)) {
-                    <span [style.borderColor]="'rgba(0, 0, 0, 0.08)'" class="k-separator"></span>
-                  }
-                  @if (hasAutoSizeColumn) {
-                    <kendo-grid-columnmenu-autosize-column
-                      #autoSizeColumnItem
-                      [service]="service"
-                      [kendoGridColumnMenuItem]="autoSizeColumnItem"
-                      [column]="column"
-                      >
-                    </kendo-grid-columnmenu-autosize-column>
-                  }
-                  @if (hasAutoSizeAllColumns) {
-                    <kendo-grid-columnmenu-autosize-all-columns
-                      #autoSizeAllColumnsItem
-                      [service]="service"
-                      [kendoGridColumnMenuItem]="autoSizeAllColumnsItem"
-                      >
-                    </kendo-grid-columnmenu-autosize-all-columns>
-                  }
-                </ng-template>
-              </kendo-tabstrip-tab>
-            }
-            @if (hasColumnChooser) {
-              <kendo-tabstrip-tab>
-                <ng-template kendoTabTitle>
-                  <kendo-icon-wrapper
-                    [attr.title]="ctx.localization.get('columnMenuColumnsTabTitle')"
-                    name="columns"
-                    [svgIcon]="columnsIcon">
-                  </kendo-icon-wrapper>
-                </ng-template>
-                <ng-template kendoTabContent>
-                  <kendo-grid-column-chooser-content
-                    [columns]="columns"
-                    [service]="service"
-                    (close)="close()"
-                    >
-                  </kendo-grid-column-chooser-content>
-                </ng-template>
-              </kendo-tabstrip-tab>
-            }
-          </kendo-tabstrip>
-        </ng-template>
-
-        `,
-                    standalone: true,
-                    imports: [
-                        NgClass,
-                        IconWrapperComponent,
-                        ColumnMenuContainerComponent,
-                        NgTemplateOutlet,
-                        ColumnMenuSortComponent,
-                        ColumnMenuItemDirective,
-                        ColumnMenuLockComponent,
-                        ColumnMenuStickComponent,
-                        ColumnMenuPositionComponent,
-                        ColumnMenuChooserComponent,
-                        ColumnMenuAutoSizeColumnComponent,
-                        ColumnMenuAutoSizeAllColumnsComponent,
-                        ColumnMenuFilterComponent,
-                        TabStripComponent,
-                        TabStripTabComponent,
-                        TabTitleDirective,
-                        TabContentDirective,
-                        FilterMenuContainerComponent,
-                        ColumnChooserContentComponent
-                    ]
-                }]
-        }], ctorParameters: () => [{ type: i1.NavigationService }, { type: i2.SinglePopupService }, { type: i3.ColumnMenuService }, { type: i4.ContextService }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i5.ColumnInfoService }, { type: i6.IdService, decorators: [{
-                    type: Optional
-                }] }, { type: i7.AdaptiveGridService }], propDecorators: { standalone: [{
-                type: HostBinding,
-                args: ['class.k-grid-column-menu-standalone']
-            }, {
-                type: Input
-            }], column: [{
-                type: Input
-            }], settings: [{
-                type: Input
-            }], sort: [{
-                type: Input
-            }], filter: [{
-                type: Input
-            }], sortable: [{
-                type: Input
-            }], columnMenuTemplate: [{
-                type: Input
-            }], tabIndex: [{
-                type: Input
-            }], anchor: [{
-                type: ViewChild,
-                args: ['anchor', { static: true }]
-            }], template: [{
-                type: ViewChild,
-                args: ['template', { static: true, read: TemplateRef }]
-            }], defaultTemplate: [{
-                type: ViewChild,
-                args: ['defaultTemplate', { static: true, read: TemplateRef }]
-            }], tabbedInterfaceTemplate: [{
-                type: ViewChild,
-                args: ['tabbedInterfaceTemplate', { static: true, read: TemplateRef }]
-            }], tabStrip: [{
-                type: ViewChild,
-                args: [TabStripComponent]
-            }] } });