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

package/esm2022/binding-directives/hierarchy-binding.directive.mjs

@@ -1,109 +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 { Directive, Input, Optional } from '@angular/core';
-import { getter, setter } from '@progress/kendo-common';
-import { BaseBindingDirective } from './base-binding.directive';
-import { HierarchyEditService } from '../editing-directives/hierarchy-edit.service';
-import { DataBoundTreeComponent } from './data-bound-tree-component';
-import { RowReorderService } from '../row-reordering/row-reorder.service';
-import { HierarchicalRowReorderService } from '../row-reordering/hierarchical-reorder.service';
-import * as i0 from "@angular/core";
-import * as i1 from "./data-bound-tree-component";
-import * as i2 from "../row-reordering/row-reorder.service";
-/**
- * Represents the Kendo UI for Angular TreeList hierarchy binding directive.
- * Use this directive to bind the TreeList to a tree of objects using a field that holds child data items.
- * Handles in-memory data operations [sorting]({% slug sorting_treelist %}), [aggregation]({% slug treelist_with_aggregates %})
- * and [filtering]({% slug filtering_treelist %}). [More information and examples.](slug:local_databinding_treelist#toc-binding-to-hierarchical-data-1)
- *
- * @example
- * ```html
- * <kendo-treelist [kendoTreeListHierarchyBinding]="data" [children]="childrenField"></kendo-treelist>
- * ```
- *
- * @remarks
- * Applied to: {@link TreeListComponent}.
- */
-export class HierarchyBindingDirective extends BaseBindingDirective {
-    component;
-    rowReorderService;
-    /**
-     * Sets the name of the field that holds the child data items of the node.
-     */
-    set childrenField(value) {
-        this.childrenGetter = getter(value);
-        this.childrenSetter = setter(value);
-        this._childrenField = value;
-    }
-    get childrenField() {
-        return this._childrenField;
-    }
-    /**
-     * Sets the array of data that populates the TreeList.
-     */
-    data;
-    childrenGetter = getter('items');
-    childrenSetter = setter('items');
-    constructor(component, rowReorderService) {
-        super(component);
-        this.component = component;
-        this.rowReorderService = rowReorderService;
-        component.localEditService = new HierarchyEditService(this);
-        if (this.rowReorderService) {
-            this.rowReorderService.bindingDirective = this;
-        }
-    }
-    _childrenField;
-    /**
-     * @hidden
-     */
-    getChildren(item) {
-        return item ? this.childrenGetter(item) || [] : this.originalData;
-    }
-    itemKey(item) {
-        return item;
-    }
-    onRowReorder(ev) {
-        if (ev.dropPosition === 'forbidden') {
-            return;
-        }
-        const dropTargetItem = ev.dropTargetRow.dataItem;
-        if (ev.dropPosition === 'over') {
-            if (!dropTargetItem.hasOwnProperty(this.childrenField)) {
-                dropTargetItem[this.childrenField] = [];
-            }
-        }
-        this.rowReorderService.reorderRows(ev, this.originalData, this.childrenField);
-        this.rebind();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: HierarchyBindingDirective, deps: [{ token: i1.DataBoundTreeComponent }, { token: i2.RowReorderService, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: HierarchyBindingDirective, isStandalone: true, selector: "[kendoTreeListHierarchyBinding]", inputs: { childrenField: "childrenField", data: ["kendoTreeListHierarchyBinding", "data"] }, providers: [
-            {
-                provide: RowReorderService,
-                useClass: HierarchicalRowReorderService
-            }
-        ], exportAs: ["kendoTreeListHierarchyBinding"], usesInheritance: true, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: HierarchyBindingDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    exportAs: 'kendoTreeListHierarchyBinding',
-                    selector: '[kendoTreeListHierarchyBinding]',
-                    providers: [
-                        {
-                            provide: RowReorderService,
-                            useClass: HierarchicalRowReorderService
-                        }
-                    ],
-                    standalone: true
-                }]
-        }], ctorParameters: () => [{ type: i1.DataBoundTreeComponent }, { type: i2.RowReorderService, decorators: [{
-                    type: Optional
-                }] }], propDecorators: { childrenField: [{
-                type: Input
-            }], data: [{
-                type: Input,
-                args: ["kendoTreeListHierarchyBinding"]
-            }] } });

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

@@ -1,45 +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 { ContentChild, Directive, ElementRef, HostBinding, Input } from '@angular/core';
-import { CheckBoxComponent } from '@progress/kendo-angular-inputs';
-import { Subscription } from 'rxjs';
-import * as i0 from "@angular/core";
-/**
- * @hidden
- */
-export class ColumnMenuChooserItemCheckedDirective {
-    host;
-    kendoColumnMenuChooserItemChecked;
-    checkbox;
-    checkedChangeSub = new Subscription();
-    constructor(host) {
-        this.host = host;
-    }
-    ngAfterViewInit() {
-        this.checkedChangeSub.add(this.checkbox.checkedStateChange.subscribe(() => {
-            this.kendoColumnMenuChooserItemChecked = this.checkbox.checkedState === true;
-        }));
-    }
-    ngOnDestroy() {
-        this.checkedChangeSub.unsubscribe();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnMenuChooserItemCheckedDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: ColumnMenuChooserItemCheckedDirective, isStandalone: true, selector: "[kendoColumnMenuChooserItemChecked]", inputs: { kendoColumnMenuChooserItemChecked: "kendoColumnMenuChooserItemChecked" }, host: { properties: { "attr.aria-checked": "this.kendoColumnMenuChooserItemChecked" } }, queries: [{ propertyName: "checkbox", first: true, predicate: CheckBoxComponent, descendants: true }], ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnMenuChooserItemCheckedDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoColumnMenuChooserItemChecked]',
-                    standalone: true
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { kendoColumnMenuChooserItemChecked: [{
-                type: HostBinding,
-                args: ['attr.aria-checked']
-            }, {
-                type: Input
-            }], checkbox: [{
-                type: ContentChild,
-                args: [CheckBoxComponent]
-            }] } });

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

@@ -1,221 +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, NgZone, Renderer2, ChangeDetectorRef, ViewChild } from '@angular/core';
-import { PopupService } from '@progress/kendo-angular-popup';
-import { LocalizationService } from "@progress/kendo-angular-l10n";
-import { guid, isDocumentAvailable, Keys } from '@progress/kendo-angular-common';
-import { columnsIcon } from '@progress/kendo-svg-icons';
-import { ButtonComponent } from '@progress/kendo-angular-buttons';
-import { ColumnInfoService } from '../common/column-info.service';
-import { closest } from '../rendering/common/dom-queries';
-import { ColumnListComponent } from './column-list.component';
-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 "@progress/kendo-angular-popup";
-/**
- * Represents the Kendo UI for Angular TreeList column chooser component.
- * Use this component to let users show or hide columns in the TreeList. To display the column chooser outside the Column Menu, add it inside the [`ToolbarTemplate`]({% slug api_treelist_toolbartemplatedirective %}) directive.
- *
- * @example
- * ```html
- * <kendo-treelist ...>
- *   <ng-template kendoTreeListColumnMenuTemplate>
- *     <kendo-treelist-column-chooser></kendo-treelist-column-chooser>
- *   </ng-template>
- * </kendo-treelist>
- * ```
- */
-export class ColumnChooserComponent {
-    localization;
-    columnInfoService;
-    popupService;
-    ngZone;
-    renderer;
-    changeDetector;
-    /**
-     * Specifies if changes in column visibility are applied immediately.
-     * @default false
-     */
-    autoSync = false;
-    /**
-     * Specifies if all columns can be hidden.
-     * @default true
-     */
-    allowHideAll = true;
-    anchor;
-    columnList;
-    get columns() {
-        return this.columnInfoService.leafNamedColumns;
-    }
-    columnsIcon = columnsIcon;
-    popupRef;
-    popupId;
-    closeClick;
-    escapeListener;
-    constructor(localization, columnInfoService, popupService, ngZone, renderer, changeDetector) {
-        this.localization = localization;
-        this.columnInfoService = columnInfoService;
-        this.popupService = popupService;
-        this.ngZone = ngZone;
-        this.renderer = renderer;
-        this.changeDetector = changeDetector;
-    }
-    ngOnDestroy() {
-        this.close();
-    }
-    /**
-     * @hidden
-     */
-    toggle(anchor, template) {
-        if (!this.popupRef) {
-            const direction = this.localization.rtl ? 'right' : 'left';
-            this.popupRef = this.popupService.open({
-                anchor: anchor.element,
-                content: template,
-                positionMode: 'absolute',
-                anchorAlign: { vertical: 'bottom', horizontal: direction },
-                popupAlign: { vertical: 'top', horizontal: direction }
-            });
-            const popupElement = this.popupRef?.popupElement;
-            if (popupElement) {
-                const popupId = `k-${guid()}`;
-                const popupAriaElement = popupElement.querySelector('.k-popup');
-                this.ngZone.runOutsideAngular(() => {
-                    this.escapeListener = this.renderer.listen(popupAriaElement, 'keydown', (e) => {
-                        if (e.code === Keys.Escape) {
-                            this.close(true);
-                        }
-                    });
-                });
-                this.renderer.setAttribute(popupElement, 'dir', this.localization.rtl ? 'rtl' : 'ltr');
-                this.renderer.setAttribute(popupAriaElement, 'id', popupId);
-                this.renderer.setAttribute(popupAriaElement, 'role', 'dialog');
-                this.popupId = popupId;
-            }
-            if (!isDocumentAvailable()) {
-                return;
-            }
-            this.ngZone.runOutsideAngular(() => this.closeClick = this.renderer.listen('document', 'click', ({ target }) => {
-                if (!closest(target, node => node === this.popupRef.popupElement || node === anchor.element)) {
-                    this.ngZone.run(() => {
-                        this.close();
-                    });
-                }
-            }));
-        }
-        else {
-            this.close();
-        }
-    }
-    /**
-     * @hidden
-     */
-    onApply(changed) {
-        this.close(true);
-        if (changed.length) {
-            this.changeDetector.markForCheck();
-            this.columnInfoService.changeVisibility(changed);
-        }
-    }
-    /**
-     * @hidden
-     */
-    onChange(changed) {
-        this.changeDetector.markForCheck();
-        this.columnInfoService.changeVisibility(changed);
-    }
-    close(focusAnchor = false) {
-        if (this.popupRef) {
-            this.popupRef.close();
-            this.popupRef = null;
-            this.changeDetector.markForCheck();
-            this.escapeListener?.();
-        }
-        this.detachClose();
-        focusAnchor && this.anchor.element.focus();
-    }
-    detachClose() {
-        if (this.closeClick) {
-            this.closeClick();
-            this.closeClick = null;
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnChooserComponent, deps: [{ token: i1.LocalizationService }, { token: i2.ColumnInfoService }, { token: i3.PopupService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ColumnChooserComponent, isStandalone: true, selector: "kendo-treelist-column-chooser", inputs: { autoSync: "autoSync", allowHideAll: "allowHideAll" }, viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true }, { propertyName: "columnList", first: true, predicate: ["columnList"], descendants: true }], ngImport: i0, template: `
-        <button #anchor
-            kendoButton
-            type="button"
-            (click)="toggle(anchor, template)"
-            fillMode="flat"
-            [attr.title]="localization.get('columns')"
-            icon="columns"
-            [svgIcon]="columnsIcon"
-            [attr.aria-haspopup]="'dialog'"
-            [attr.aria-expanded]="!!(popupRef)"
-            [attr.aria-controls]="!!(popupRef) ? popupId : undefined"></button>
-        <ng-template #template>
-            <span class='k-column-chooser-title'>{{ localization.get('columns') }}</span>
-            <kendo-treelist-columnlist
-                #columnList
-                [columns]="columns"
-                [ariaLabel]="localization.get('columns')"
-                [isLast]="true"
-                [applyText]="localization.get('columnsApply')"
-                [resetText]="localization.get('columnsReset')"
-                [autoSync]="autoSync"
-                [allowHideAll]="allowHideAll"
-                (apply)="onApply($event)"
-                (columnChange)="onChange($event)">
-            </kendo-treelist-columnlist>
-        </ng-template>
-    `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: ColumnListComponent, selector: "kendo-treelist-columnlist", inputs: ["columns", "autoSync", "ariaLabel", "allowHideAll", "applyText", "resetText", "actionsClass", "isLast", "isExpanded", "service"], outputs: ["reset", "apply", "columnChange"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnChooserComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-treelist-column-chooser',
-                    template: `
-        <button #anchor
-            kendoButton
-            type="button"
-            (click)="toggle(anchor, template)"
-            fillMode="flat"
-            [attr.title]="localization.get('columns')"
-            icon="columns"
-            [svgIcon]="columnsIcon"
-            [attr.aria-haspopup]="'dialog'"
-            [attr.aria-expanded]="!!(popupRef)"
-            [attr.aria-controls]="!!(popupRef) ? popupId : undefined"></button>
-        <ng-template #template>
-            <span class='k-column-chooser-title'>{{ localization.get('columns') }}</span>
-            <kendo-treelist-columnlist
-                #columnList
-                [columns]="columns"
-                [ariaLabel]="localization.get('columns')"
-                [isLast]="true"
-                [applyText]="localization.get('columnsApply')"
-                [resetText]="localization.get('columnsReset')"
-                [autoSync]="autoSync"
-                [allowHideAll]="allowHideAll"
-                (apply)="onApply($event)"
-                (columnChange)="onChange($event)">
-            </kendo-treelist-columnlist>
-        </ng-template>
-    `,
-                    standalone: true,
-                    imports: [ButtonComponent, ColumnListComponent]
-                }]
-        }], ctorParameters: () => [{ type: i1.LocalizationService }, { type: i2.ColumnInfoService }, { type: i3.PopupService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }], propDecorators: { autoSync: [{
-                type: Input
-            }], allowHideAll: [{
-                type: Input
-            }], anchor: [{
-                type: ViewChild,
-                args: ['anchor']
-            }], columnList: [{
-                type: ViewChild,
-                args: ['columnList']
-            }] } });

package/esm2022/column-menu/column-list-kb-nav.service.mjs

@@ -1,40 +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 { Injectable, Renderer2 } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * @hidden
- */
-export class ColumnListKeyboardNavigation {
-    renderer;
-    items;
-    activeIndex = 0;
-    constructor(renderer) {
-        this.renderer = renderer;
-    }
-    next() {
-        this.toggle(this.activeIndex, false);
-        this.activeIndex = Math.min(this.activeIndex + 1, this.items.length - 1);
-        this.toggle(this.activeIndex, true);
-    }
-    prev() {
-        this.toggle(this.activeIndex, false);
-        this.activeIndex = Math.max(this.activeIndex - 1, 0);
-        this.toggle(this.activeIndex, true);
-    }
-    toggle(index, active) {
-        const element = this.items[index]?.host.nativeElement;
-        element && this.renderer.setAttribute(this.items[index].host.nativeElement, 'tabindex', active ? '0' : '-1');
-        active && element?.focus();
-    }
-    toggleCheckedState() {
-        this.items[this.activeIndex].host.nativeElement.firstElementChild.click();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnListKeyboardNavigation, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnListKeyboardNavigation });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ColumnListKeyboardNavigation, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [{ type: i0.Renderer2 }] });