@progress/kendo-angular-treelist 4.0.6 → 5.0.0-next.202204071600

package/esm2015/column-menu/column-menu-item-content-template.directive.js

@@ -0,0 +1,35 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Directive, Optional } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Represents the content template of the
+ * [`kendo-treelist-columnmenu-item`]({% slug api_treelist_columnmenuitemcomponent %}) component.
+ * Provides an option for specifying the content of a column item.
+ * To define the content template, nest an `<ng-template>` tag with the
+ * `kendoTreeListColumnMenuItemContentTemplate` directive inside a `<kendo-treelist-columnmenu-item>`.
+ *
+ * {% meta height:500 %}
+ * {% embed_file column-menu/template-item-content/app.component.ts preview %}
+ * {% embed_file column-menu/template-item-content/app.module.ts %}
+ * {% embed_file shared/main.ts %}
+ * {% embed_file shared/employees.ts %}
+ * {% endmeta %}
+ */
+export class ColumnMenuItemContentTemplateDirective {
+    constructor(templateRef) {
+        this.templateRef = templateRef;
+    }
+}
+ColumnMenuItemContentTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuItemContentTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+ColumnMenuItemContentTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: ColumnMenuItemContentTemplateDirective, selector: "[kendoTreeListColumnMenuItemContentTemplate]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuItemContentTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kendoTreeListColumnMenuItemContentTemplate]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef, decorators: [{
+                    type: Optional
+                }] }]; } });

package/esm2015/column-menu/column-menu-item.component.js

@@ -0,0 +1,157 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 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 } from '@angular/core';
+import { trigger, transition, style, animate, state } from '@angular/animations';
+import { ColumnMenuItemContentTemplateDirective } from './column-menu-item-content-template.directive';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+/**
+ * Represents an item that can be placed inside a
+ * [`ColumnMenuTemplate`]({% slug api_treelist_columnmenutemplatedirective %}) directive.
+ *
+ * {% meta height:500 %}
+ * {% embed_file column-menu/template-item/app.component.ts preview %}
+ * {% embed_file column-menu/template-item/app.module.ts %}
+ * {% embed_file shared/main.ts %}
+ * {% embed_file shared/employees.ts %}
+ * {% endmeta %}
+ */
+export class ColumnMenuItemComponent {
+    constructor() {
+        /**
+         * Fires when the item is clicked.
+         */
+        this.itemClick = new EventEmitter();
+        /**
+         * Fires when the content is expanded.
+         */
+        this.expand = new EventEmitter();
+        /**
+         * Fires when the content is collapsed.
+         */
+        this.collapse = new EventEmitter();
+        this.contentState = 'collapsed';
+    }
+    get iconClass() {
+        return `k-i-${this.icon}`;
+    }
+    ngOnChanges(changes) {
+        if (changes.expanded) {
+            this.updateContentState();
+        }
+    }
+    /**
+     * @hidden
+     */
+    onClick(e) {
+        this.itemClick.emit(e);
+        if (this.contentTemplate) {
+            this.expanded = !this.expanded;
+            this.updateContentState();
+            if (this.expanded) {
+                this.expand.emit();
+            }
+            else {
+                this.collapse.emit();
+            }
+        }
+    }
+    updateContentState() {
+        this.contentState = this.expanded ? 'expanded' : 'collapsed';
+    }
+}
+ColumnMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ColumnMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ColumnMenuItemComponent, selector: "kendo-treelist-columnmenu-item", inputs: { icon: "icon", text: "text", selected: "selected", disabled: "disabled", expanded: "expanded" }, outputs: { itemClick: "itemClick", expand: "expand", collapse: "collapse" }, queries: [{ propertyName: "contentTemplate", first: true, predicate: ColumnMenuItemContentTemplateDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+        <div class="k-columnmenu-item" (click)="onClick($event)" [class.k-state-selected]="selected" [class.k-state-disabled]="disabled">
+           <span *ngIf="icon" class="k-icon" [ngClass]="iconClass">
+           </span>
+           {{ text }}
+        </div>
+        <div *ngIf="contentTemplate" [@state]="contentState" style="overflow:hidden;" class="k-columnmenu-item-content">
+            <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
+            </ng-container>
+        <div>
+    `, isInline: true, directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], 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: "12.2.16", 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-treelist-columnmenu-item',
+                    template: `
+        <div class="k-columnmenu-item" (click)="onClick($event)" [class.k-state-selected]="selected" [class.k-state-disabled]="disabled">
+           <span *ngIf="icon" class="k-icon" [ngClass]="iconClass">
+           </span>
+           {{ text }}
+        </div>
+        <div *ngIf="contentTemplate" [@state]="contentState" style="overflow:hidden;" class="k-columnmenu-item-content">
+            <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
+            </ng-container>
+        <div>
+    `
+                }]
+        }], propDecorators: { itemClick: [{
+                type: Output
+            }], expand: [{
+                type: Output
+            }], collapse: [{
+                type: Output
+            }], icon: [{
+                type: Input
+            }], text: [{
+                type: Input
+            }], selected: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], expanded: [{
+                type: Input
+            }], contentTemplate: [{
+                type: ContentChild,
+                args: [ColumnMenuItemContentTemplateDirective, { static: false }]
+            }] } });

package/esm2015/column-menu/column-menu-lock.component.js

@@ -0,0 +1,85 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Component } from '@angular/core';
+import { ColumnMenuItemBase } from './column-menu-item-base';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-l10n";
+import * as i2 from "../common/column-info.service";
+import * as i3 from "./column-menu-item.component";
+/**
+ * Represents a column-menu item that can be placed inside a
+ * [`ColumnMenuTemplate`]({% slug api_treelist_columnmenutemplatedirective %}) directive.
+ * Allows the user to lock or unlock the columns.
+ *
+ * > You have to set the [ColumnMenuService]({% slug api_treelist_columnmenuservice %}) that is passed by
+ * > the template to the service input of the `kendo-treelist-columnmenu-lock` component.
+ *
+ * {% meta height:500 %}
+ * {% embed_file column-menu/template-lock/app.component.ts preview %}
+ * {% embed_file column-menu/template-lock/app.module.ts %}
+ * {% embed_file shared/main.ts %}
+ * {% embed_file shared/employees.ts %}
+ * {% endmeta %}
+ */
+export class ColumnMenuLockComponent extends ColumnMenuItemBase {
+    constructor(localization, columnInfoService, changeDetector) {
+        super();
+        this.localization = localization;
+        this.columnInfoService = columnInfoService;
+        this.changeDetector = changeDetector;
+    }
+    get text() {
+        return this.localization.get(this.locked ? 'unlock' : 'lock');
+    }
+    get icon() {
+        return this.locked ? 'unlock' : 'lock';
+    }
+    get disabled() {
+        return !this.locked && this.columnInfoService.unlockedRootCount < 2;
+    }
+    /**
+     * @hidden
+     */
+    toggleColumn() {
+        this.toggleHierarchy(!this.locked);
+        this.close();
+        this.changeDetector.markForCheck();
+    }
+    toggleHierarchy(locked) {
+        let root = this.service.column;
+        while (root.parent) {
+            root = root.parent;
+        }
+        const columns = [root];
+        const allChanged = [];
+        while (columns.length) {
+            const column = columns.shift();
+            column.locked = locked;
+            allChanged.push(column);
+            if (column.hasChildren) {
+                columns.push(...column.childrenArray);
+            }
+        }
+        this.columnInfoService.changeLocked(allChanged);
+    }
+    get locked() {
+        return this.service.column.locked;
+    }
+}
+ColumnMenuLockComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuLockComponent, deps: [{ token: i1.LocalizationService }, { token: i2.ColumnInfoService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+ColumnMenuLockComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ColumnMenuLockComponent, selector: "kendo-treelist-columnmenu-lock", usesInheritance: true, ngImport: i0, template: `
+       <kendo-treelist-columnmenu-item [text]="text" [icon]="icon" (itemClick)="toggleColumn()" [disabled]="disabled">
+       </kendo-treelist-columnmenu-item>
+    `, isInline: true, components: [{ type: i3.ColumnMenuItemComponent, selector: "kendo-treelist-columnmenu-item", inputs: ["icon", "text", "selected", "disabled", "expanded"], outputs: ["itemClick", "expand", "collapse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuLockComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kendo-treelist-columnmenu-lock',
+                    template: `
+       <kendo-treelist-columnmenu-item [text]="text" [icon]="icon" (itemClick)="toggleColumn()" [disabled]="disabled">
+       </kendo-treelist-columnmenu-item>
+    `
+                }]
+        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i2.ColumnInfoService }, { type: i0.ChangeDetectorRef }]; } });

package/esm2015/column-menu/column-menu-settings.interface.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export {};

package/esm2015/column-menu/column-menu-sort.component.js

@@ -0,0 +1,86 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Component } from '@angular/core';
+import { normalize } from '../columns/sort-settings';
+import { ColumnMenuItemBase } from './column-menu-item-base';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-l10n";
+import * as i2 from "../common/sort.service";
+import * as i3 from "./column-menu-item.component";
+/**
+ * Represents a column-menu item for sorting TreeList columns that can be placed inside a
+ * [`ColumnMenuTemplate`]({% slug api_treelist_columnmenutemplatedirective %}) directive.
+ * Allows the user to sort the column.
+ *
+ * > You have to set the [ColumnMenuService]({% slug api_treelist_columnmenuservice %}) that is passed by
+ * > the template to the service input of the `kendo-treelist-columnmenu-sort` component.
+ *
+ * {% meta height:500 %}
+ * {% embed_file column-menu/template-sort/app.component.ts preview %}
+ * {% embed_file column-menu/template-sort/app.module.ts %}
+ * {% embed_file shared/main.ts %}
+ * {% embed_file shared/employees.ts %}
+ * {% endmeta %}
+ */
+export class ColumnMenuSortComponent extends ColumnMenuItemBase {
+    constructor(localization, sortService) {
+        super();
+        this.localization = localization;
+        this.sortService = sortService;
+    }
+    get sortedAsc() {
+        const descriptor = this.descriptor;
+        return descriptor && (!descriptor.dir || descriptor.dir === 'asc');
+    }
+    get sortedDesc() {
+        const descriptor = this.descriptor;
+        return descriptor && descriptor.dir === 'desc';
+    }
+    /**
+     * @hidden
+     */
+    toggleSort(dir) {
+        const field = this.service.column.field;
+        const { mode, allowUnsort } = normalize(this.service.sortable);
+        const descriptor = this.descriptor;
+        const sort = mode === 'multiple' ? this.service.sort.filter(s => s.field !== field) : [];
+        if (descriptor && descriptor.dir === dir) {
+            if (!allowUnsort) {
+                return;
+            }
+        }
+        else {
+            sort.push({ field, dir });
+        }
+        this.sortService.sort(sort);
+        this.close();
+    }
+    get descriptor() {
+        return [].concat(this.service.sort || []).find(s => s.field === this.service.column.field);
+    }
+}
+ColumnMenuSortComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuSortComponent, deps: [{ token: i1.LocalizationService }, { token: i2.SortService }], target: i0.ɵɵFactoryTarget.Component });
+ColumnMenuSortComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ColumnMenuSortComponent, selector: "kendo-treelist-columnmenu-sort", usesInheritance: true, ngImport: i0, template: `
+        <kendo-treelist-columnmenu-item [text]="localization.get('sortAscending')"
+            icon="sort-asc-sm" (itemClick)="toggleSort('asc')" [selected]="sortedAsc">
+        </kendo-treelist-columnmenu-item>
+        <kendo-treelist-columnmenu-item [text]="localization.get('sortDescending')"
+            icon="sort-desc-sm" (itemClick)="toggleSort('desc')" [selected]="sortedDesc">
+        </kendo-treelist-columnmenu-item>
+    `, isInline: true, components: [{ type: i3.ColumnMenuItemComponent, selector: "kendo-treelist-columnmenu-item", inputs: ["icon", "text", "selected", "disabled", "expanded"], outputs: ["itemClick", "expand", "collapse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuSortComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kendo-treelist-columnmenu-sort',
+                    template: `
+        <kendo-treelist-columnmenu-item [text]="localization.get('sortAscending')"
+            icon="sort-asc-sm" (itemClick)="toggleSort('asc')" [selected]="sortedAsc">
+        </kendo-treelist-columnmenu-item>
+        <kendo-treelist-columnmenu-item [text]="localization.get('sortDescending')"
+            icon="sort-desc-sm" (itemClick)="toggleSort('desc')" [selected]="sortedDesc">
+        </kendo-treelist-columnmenu-item>
+    `
+                }]
+        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i2.SortService }]; } });

package/esm2015/column-menu/column-menu-template.directive.js

@@ -0,0 +1,38 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Directive, Optional } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Represents the template for the column menu in the TreeList. Provides an option for
+ * customizing the content of the column menu for all or for specific columns.
+ * To define the content template, nest an `<ng-template>` tag with the
+ * `kendoTreeListColumnMenuTemplate` directive inside the `kendo-treelist` or the `<kendo-treelist-column>` component.
+ *
+ * The template context is passes through the following fields:
+ * - `service`&mdash;Represents the [ColumnMenuService]({% slug api_treelist_columnmenuservice %}).
+ * - `column`&mdash;Represents the TreeList column.
+ *
+ * {% meta height:500 %}
+ * {% embed_file column-menu/template/app.component.ts preview %}
+ * {% embed_file column-menu/template/app.module.ts %}
+ * {% embed_file shared/main.ts %}
+ * {% embed_file shared/employees.ts %}
+ * {% endmeta %}
+ */
+export class ColumnMenuTemplateDirective {
+    constructor(templateRef) {
+        this.templateRef = templateRef;
+    }
+}
+ColumnMenuTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+ColumnMenuTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: ColumnMenuTemplateDirective, selector: "[kendoTreeListColumnMenuTemplate]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kendoTreeListColumnMenuTemplate]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef, decorators: [{
+                    type: Optional
+                }] }]; } });

package/esm2015/column-menu/column-menu.component.js

@@ -0,0 +1,201 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Component, Input, HostBinding } from '@angular/core';
+import { ColumnMenuService } from './column-menu.service';
+import { filtersByField } from '../filtering/base-filter-cell.component';
+import { hasFilter, hasSort, hasLock, hasColumnChooser } from './utils';
+import * as i0 from "@angular/core";
+import * as i1 from "../common/single-popup.service";
+import * as i2 from "@progress/kendo-angular-l10n";
+import * as i3 from "./column-menu.service";
+import * as i4 from "./column-menu-sort.component";
+import * as i5 from "./column-menu-lock.component";
+import * as i6 from "./column-menu-chooser.component";
+import * as i7 from "./column-menu-filter.component";
+import * as i8 from "@angular/common";
+const POPUP_CLASS = 'k-grid-columnmenu-popup';
+/**
+ * Represents the [column menu]({% slug columnmenu_treelist %}) component.
+ */
+export class ColumnMenuComponent {
+    constructor(popupService, localization, service) {
+        this.popupService = popupService;
+        this.localization = localization;
+        this.service = service;
+        /**
+         * @hidden
+         */
+        this.standalone = true;
+        /**
+         * The settings for the Column Menu.
+         */
+        this.settings = {};
+        /**
+         * @hidden
+         */
+        this.sortable = true;
+        /**
+         * @hidden
+         */
+        this.expandedFilter = false;
+        /**
+         * @hidden
+         */
+        this.expandedColumns = false;
+        this.closeSubscription = service.closeMenu.subscribe(this.close.bind(this));
+    }
+    /**
+     * @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 hasSort() {
+        return hasSort(this.settings, this.column);
+    }
+    /**
+     * @hidden
+     */
+    get hasColumnChooser() {
+        return hasColumnChooser(this.settings);
+    }
+    /**
+     * @hidden
+     */
+    get hasLock() {
+        return hasLock(this.settings, this.column);
+    }
+    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();
+    }
+    /**
+     * @hidden
+     */
+    toggle(e, anchor, template) {
+        e.preventDefault();
+        this.expandedFilter = !this.hasColumnChooser;
+        this.expandedColumns = !this.hasFilter;
+        this.popupRef = this.popupService.open(anchor, template, this.popupRef, POPUP_CLASS);
+    }
+    /**
+     * @hidden
+     */
+    close() {
+        this.popupService.destroy();
+        this.popupRef = null;
+    }
+    /**
+     * @hidden
+     */
+    onColumnsExpand() {
+        this.expandedColumns = true;
+        this.expandedFilter = false;
+    }
+    /**
+     * @hidden
+     */
+    onFilterExpand() {
+        this.expandedFilter = true;
+        this.expandedColumns = false;
+    }
+}
+ColumnMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuComponent, deps: [{ token: i1.SinglePopupService }, { token: i2.LocalizationService }, { token: i3.ColumnMenuService }], target: i0.ɵɵFactoryTarget.Component });
+ColumnMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ColumnMenuComponent, selector: "kendo-treelist-column-menu", inputs: { standalone: "standalone", column: "column", settings: "settings", sort: "sort", filter: "filter", sortable: "sortable", columnMenuTemplate: "columnMenuTemplate" }, host: { properties: { "class.k-grid-column-menu-standalone": "this.standalone" } }, providers: [ColumnMenuService], usesOnChanges: true, ngImport: i0, template: `
+        <a #anchor
+            class="k-grid-column-menu k-grid-filter"
+            [ngClass]="{ 'k-state-active': isActive }"
+            (click)="toggle($event, anchor, template)"
+            href="#"
+            tabindex="-1"
+            [attr.title]="localization.get('columnMenu')">
+            <span class="k-icon k-i-more-vertical"></span>
+        </a>
+        <ng-template #template>
+            <ng-container [ngTemplateOutlet]="column.columnMenuTemplateRef || columnMenuTemplate || defaultTemplate"
+                          [ngTemplateOutletContext]="{ service: service, column: column }">
+            </ng-container>
+        </ng-template>
+        <ng-template #defaultTemplate>
+            <kendo-treelist-columnmenu-sort *ngIf="hasSort" [service]="service">
+            </kendo-treelist-columnmenu-sort>
+            <kendo-treelist-columnmenu-lock *ngIf="hasLock" [service]="service">
+            </kendo-treelist-columnmenu-lock>
+            <kendo-treelist-columnmenu-chooser *ngIf="hasColumnChooser" [service]="service"
+                [expanded]="expandedColumns" (expand)="onColumnsExpand()">
+            </kendo-treelist-columnmenu-chooser>
+            <kendo-treelist-columnmenu-filter *ngIf="hasFilter" [service]="service"
+                [expanded]="expandedFilter" (expand)="onFilterExpand()">
+            </kendo-treelist-columnmenu-filter>
+        </ng-template>
+    `, isInline: true, components: [{ type: i4.ColumnMenuSortComponent, selector: "kendo-treelist-columnmenu-sort" }, { type: i5.ColumnMenuLockComponent, selector: "kendo-treelist-columnmenu-lock" }, { type: i6.ColumnMenuChooserComponent, selector: "kendo-treelist-columnmenu-chooser", inputs: ["expanded"], outputs: ["expand", "collapse"] }, { type: i7.ColumnMenuFilterComponent, selector: "kendo-treelist-columnmenu-filter", inputs: ["expanded"], outputs: ["expand", "collapse"] }], directives: [{ type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i8.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnMenuComponent, decorators: [{
+            type: Component,
+            args: [{
+                    providers: [ColumnMenuService],
+                    selector: 'kendo-treelist-column-menu',
+                    template: `
+        <a #anchor
+            class="k-grid-column-menu k-grid-filter"
+            [ngClass]="{ 'k-state-active': isActive }"
+            (click)="toggle($event, anchor, template)"
+            href="#"
+            tabindex="-1"
+            [attr.title]="localization.get('columnMenu')">
+            <span class="k-icon k-i-more-vertical"></span>
+        </a>
+        <ng-template #template>
+            <ng-container [ngTemplateOutlet]="column.columnMenuTemplateRef || columnMenuTemplate || defaultTemplate"
+                          [ngTemplateOutletContext]="{ service: service, column: column }">
+            </ng-container>
+        </ng-template>
+        <ng-template #defaultTemplate>
+            <kendo-treelist-columnmenu-sort *ngIf="hasSort" [service]="service">
+            </kendo-treelist-columnmenu-sort>
+            <kendo-treelist-columnmenu-lock *ngIf="hasLock" [service]="service">
+            </kendo-treelist-columnmenu-lock>
+            <kendo-treelist-columnmenu-chooser *ngIf="hasColumnChooser" [service]="service"
+                [expanded]="expandedColumns" (expand)="onColumnsExpand()">
+            </kendo-treelist-columnmenu-chooser>
+            <kendo-treelist-columnmenu-filter *ngIf="hasFilter" [service]="service"
+                [expanded]="expandedFilter" (expand)="onFilterExpand()">
+            </kendo-treelist-columnmenu-filter>
+        </ng-template>
+    `
+                }]
+        }], ctorParameters: function () { return [{ type: i1.SinglePopupService }, { type: i2.LocalizationService }, { type: i3.ColumnMenuService }]; }, 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
+            }] } });