@progress/kendo-angular-treelist 13.0.0-develop.7 → 13.0.0-develop.8

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

@@ -14,18 +14,13 @@ import * as i3 from "./column-menu-item.component";
 import * as i4 from "./column-list.component";
 import * as i5 from "./column-menu-item-content-template.directive";
 /**
- * Represents the component for selecting columns in the TreeList that can be placed
- * inside a [`ColumnMenuTemplate`]({% slug api_treelist_columnmenutemplatedirective %}) directive.
+ * Represents the column-menu item for selecting columns in the TreeList. [See example](slug:columnmenu_treelist#toc-column-chooser-item).
  *
- * > 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-chooser` component.
+ * The component can be placed inside a [`ColumnMenuTemplate`]({% slug api_treelist_columnmenutemplatedirective %}) directive.
+ *
+ * To register the component as a known column menu item, set the [`ColumnMenuService`]({% slug api_treelist_columnmenuservice %})
+ * that is passed by the template to the service input of the `kendo-treelist-columnmenu-chooser` component.
  *
- * {% meta height:500 %}
- * {% embed_file column-menu/template-chooser/app.component.ts preview %}
- * {% embed_file column-menu/template-chooser/app.module.ts %}
- * {% embed_file shared/main.ts %}
- * {% embed_file shared/employees.ts %}
- * {% endmeta %}
  */
 export class ColumnMenuChooserComponent extends ColumnMenuItemBase {
     constructor(localization, columnInfoService, changeDetector) {
@@ -43,6 +38,7 @@ export class ColumnMenuChooserComponent extends ColumnMenuItemBase {
         this.collapse = new EventEmitter();
         /**
          * Specifies if the content is expanded.
+         * @default false
          */
         this.expanded = false;
         /**
@@ -67,7 +63,7 @@ export class ColumnMenuChooserComponent extends ColumnMenuItemBase {
 }
 ColumnMenuChooserComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ColumnMenuChooserComponent, deps: [{ token: i1.LocalizationService }, { token: i2.ColumnInfoService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 ColumnMenuChooserComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ColumnMenuChooserComponent, selector: "kendo-treelist-columnmenu-chooser", inputs: { expanded: "expanded" }, outputs: { expand: "expand", collapse: "collapse" }, usesInheritance: true, ngImport: i0, template: `
-        <kendo-treelist-columnmenu-item 
+        <kendo-treelist-columnmenu-item
             [text]="localization.get('columns')"
             icon="columns"
             [svgIcon]="columnsIcon"
@@ -92,7 +88,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             args: [{
                     selector: 'kendo-treelist-columnmenu-chooser',
                     template: `
-        <kendo-treelist-columnmenu-item 
+        <kendo-treelist-columnmenu-item
             [text]="localization.get('columns')"
             icon="columns"
             [svgIcon]="columnsIcon"

package/esm2020/column-menu/column-menu-filter.component.mjs

@@ -12,18 +12,13 @@ import * as i2 from "./column-menu-item.component";
 import * as i3 from "../filtering/menu/filter-menu-container.component";
 import * as i4 from "./column-menu-item-content-template.directive";
 /**
- * Represents the component for editing column filters in the TreeList that can be placed
- * inside a [`ColumnMenuTemplate`]({% slug api_treelist_columnmenutemplatedirective %}) directive.
+ * Represents the column-menu item for editing column filters in the TreeList.
  *
- * > 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-filter` component.
+ * The component can be placed inside a [`ColumnMenuTemplate`]({% slug api_treelist_columnmenutemplatedirective %}) directive.
+ *
+ * To register the component as a known column menu item, set the [`ColumnMenuService`]({% slug api_treelist_columnmenuservice %})
+ * that is passed by the template to the service input of the `kendo-treelist-columnmenu-filter` component.
  *
- * {% meta height:500 %}
- * {% embed_file column-menu/template-filter/app.component.ts preview %}
- * {% embed_file column-menu/template-filter/app.module.ts %}
- * {% embed_file shared/main.ts %}
- * {% embed_file shared/employees.ts %}
- * {% endmeta %}
  */
 export class ColumnMenuFilterComponent extends ColumnMenuItemBase {
     constructor(localization) {
@@ -39,6 +34,7 @@ export class ColumnMenuFilterComponent extends ColumnMenuItemBase {
         this.collapse = new EventEmitter();
         /**
          * Specifies if the content is expanded.
+         * @default false
          */
         this.expanded = false;
         /**

package/esm2020/column-menu/column-menu-item-content-template.directive.mjs

@@ -13,7 +13,7 @@ import * as i0 from "@angular/core";
  *
  * @example
  * ```html
- * <kendo-treelist>
+ * <kendo-treelist ...>
  *   <kendo-treelist-column field="ProductName">
  *     <ng-template kendoTreeListColumnMenuTemplate>
  *       <kendo-treelist-columnmenu-item text="Item Text" [expanded]="true">

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

@@ -12,12 +12,14 @@ import * as i2 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 %}
+ *  * @example
+ * ```html
+ * <kendo-treelist ...>
+ *   <ng-template kendoTreeListColumnMenuTemplate let-service="service" let-column="column">
+ *     <kendo-treelist-columnmenu-item text="Fit column"></kendo-treelist-columnmenu-item>
+ *   </ng-template>
+ * </kendo-treelist>
+ * ```
  */
 export class ColumnMenuItemComponent {
     constructor() {

package/esm2020/column-menu/column-menu-lock.component.mjs

@@ -12,19 +12,13 @@ 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.
+ * Represents the column-menu item that allows the user to lock or unlock 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.
+ * The componnt can be placed inside a [`ColumnMenuTemplate`]({% slug api_treelist_columnmenutemplatedirective %}) directive.
+ *
+* To register the component as a known column menu item, 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) {

package/esm2020/column-menu/column-menu-sort.component.mjs

@@ -13,19 +13,13 @@ 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.
+ * Represents the column-menu item for sorting TreeList 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-sort` component.
+ * The component can be placed inside a [`ColumnMenuTemplate`]({% slug api_treelist_columnmenutemplatedirective %}) directive.
+ *
+ * To register the component as a known column menu item, 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) {

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

@@ -21,7 +21,7 @@ import * as i8 from "./column-menu-filter.component";
 import * as i9 from "@angular/common";
 const POPUP_CLASS = 'k-grid-columnmenu-popup';
 /**
- * Represents the [column menu]({% slug columnmenu_treelist %}) component.
+ * Represents the [column menu]({% slug columnmenu_treelist %}) component of the TreeList.
  */
 export class ColumnMenuComponent {
     constructor(popupService, localization, service) {

package/esm2020/column-menu/column-menu.service.mjs

@@ -10,7 +10,7 @@ import * as i0 from "@angular/core";
  *
  * @example
  * ```html
- * <kendo-treelist>
+ * <kendo-treelist ...>
  *   <ng-template
  *     kendoTreeListColumnMenuTemplate
  *     let-service="service"

package/esm2020/columns/checkbox-column.component.mjs

@@ -8,7 +8,7 @@ import { CellTemplateDirective } from '../rendering/cell-template.directive';
 import * as i0 from "@angular/core";
 import * as i1 from "./column-base";
 /**
- * Represents the checkbox for selecting rows in the TreeList.
+ * Represents the checkbox for selecting rows in the TreeList. [See example](slug:selection_treelist#toc-select-all-checkbox).
  */
 export class CheckboxColumnComponent extends ColumnBase {
     constructor(parent) {

package/esm2020/columns/column-group.component.mjs

@@ -19,12 +19,15 @@ export function isColumnGroupComponent(column) {
  * Represents the column group header of the TreeList
  * ([more information and examples]({% slug multicolumnheaders_columns_treelist %})).
  *
- * {% meta height:533 %}
- * {% embed_file configuration/multi-column-headers/app.component.ts preview %}
- * {% embed_file configuration/multi-column-headers/app.module.ts %}
- * {% embed_file shared/main.ts %}
- * {% embed_file shared/filesystem.ts %}
- * {% endmeta %}
+ * @example
+ * ```html
+ * <kendo-treelist ...>
+ *   <kendo-treelist-column-group title="File Info">
+ *     <kendo-treelist-column field="type" title="Type"> </kendo-treelist-column>
+ *     <kendo-treelist-column field="size" title="Size"> </kendo-treelist-column>
+ *   </kendo-treelist-column-group>
+ * </kendo-treelist>
+ * ```
  */
 export class ColumnGroupComponent extends ColumnBase {
     constructor(parent, optionChanges) {

package/esm2020/columns/column.component.mjs

@@ -20,14 +20,15 @@ export function isColumnComponent(column) {
     return isPresent(column.field);
 }
 /**
- * Represents the columns of the [Angular TreeList]({% slug getstarted_treelist %}).
+ * Represents the columns of the TreeList.
  *
- * {% meta height:470 %}
- * {% embed_file basic-usage/app.component.ts preview %}
- * {% embed_file basic-usage/app.module.ts %}
- * {% embed_file shared/main.ts %}
- * {% embed_file shared/employees.ts %}
- * {% endmeta %}
+ * @example
+ * ```html
+ * <kendo-treelist [kendoTreeListFlatBinding]="data" ...>
+ *   <kendo-treelist-column field="name" title="Name"></kendo-treelist-column>
+ *   <kendo-treelist-column field="title"title="Title"></kendo-treelist-column>
+ * </kendo-treelist>
+ * ```
  */
 export class ColumnComponent extends ColumnBase {
     constructor(parent, optionChanges) {
@@ -39,51 +40,27 @@ export class ColumnComponent extends ColumnBase {
         this.sortable = true;
         /**
          * Defines the editor type ([see example]({% slug editing_reactive_forms_treelist %}#toc-setup)).
-         * Used when the column enters the edit mode. The default value is `text`.
+         * Used when the column enters the edit mode. [See example](slug:editing_reactive_forms_treelist).
          *
-         * @example
-         * ```html-no-run
-         * <kendo-treelist>
-         *    <kendo-treelist-column field="UnitPrice" editor="numeric">
-         *    </kendo-treelist-column>
-         * </kendo-treelist>
-         * ```
+         * @default 'text'
          */
         this.editor = 'text';
         /**
-         * Defines the filter type that is displayed inside the filter row. The default value is `text`.
+         * Defines the filter type that is displayed inside the filter row.
          *
-         * @example
-         * ```html-no-run
-         * <kendo-treelist>
-         *    <kendo-treelist-column field="UnitPrice" filter="numeric">
-         *    </kendo-treelist-column>
-         * </kendo-treelist>
-         * ```
+         * @default 'text'
          */
         this.filter = 'text';
         /**
-         * Defines if a filter UI will be displayed for this column. The default value is `true`.
+         * Defines if a filter UI will be displayed for this column.
          *
-         * @example
-         * ```html-no-run
-         * <kendo-treelist>
-         *    <kendo-treelist-column field="UnitPrice" [filterable]="false">
-         *    </kendo-treelist-column>
-         * </kendo-treelist>
-         * ```
+         * @default true
          */
         this.filterable = true;
         /**
-         * Defines whether the column is editable. The default value is `true`.
+         * Defines whether the column is editable.
          *
-         * @example
-         * ```html-no-run
-         * <kendo-treelist>
-         *    <kendo-treelist-column field="UnitPrice" [editable]="false">
-         *    </kendo-treelist-column>
-         * </kendo-treelist>
-         * ```
+         * @default true
          */
         this.editable = true;
     }

package/esm2020/columns/command-column.component.mjs

@@ -11,30 +11,28 @@ import * as i1 from "./column-base";
 import * as i2 from "../common/option-changes.service";
 /**
  * Represents the command columns of the TreeList. You have to define the content of the
- * column inside an `<ng-template>` tag. The template context is set to the current
- * data item. For more information and examples on using the passed fields
+ * column inside an `<ng-template>` tag. For more information and examples on using the passed fields
  * and the command directives, refer to the article on
  * [editing the TreeList in Angular Reactive Forms]({% slug editing_reactive_forms_treelist %}).
  *
- * The following additional fields are passed:
- * - `columnIndex`&mdash;The current column index.
- * - `rowIndex`&mdash;The current data row index. If inside a new item row, `rowIndex`is `-1`.
- * - `dataItem`&mdash;The current data item.
- * - `column`&mdash;The current column instance.
- * - `isNew`&mdash;The state of the current item.
- *
  * Usually, the template contains CRUD command directives such as:
  * - [`EditCommandDirective`]({% slug api_treelist_editcommanddirective %})
  * - [`RemoveCommandDirective`]({% slug api_treelist_removecommanddirective %})
  * - [`CancelCommandDirective`]({% slug api_treelist_cancelcommanddirective %})
  * - [`SaveCommandDirective`]({% slug api_treelist_savecommanddirective %})
  *
- * {% meta height:590 %}
- * {% embed_file editing/editing-directives/reactive-editing/app.component.ts preview %}
- * {% embed_file shared/employees.ts %}
- * {% embed_file editing/editing-directives/reactive-editing/app.module.ts %}
- * {% embed_file shared/main.ts %}
- * {% endmeta %}
+ * @example
+ * ```html
+ * <kendo-treelist ...>
+ *   <kendo-treelist-column field="ProductID"></kendo-treelist-column>
+ *   <kendo-treelist-command-column title="command" >
+ *      <ng-template kendoTreeListCellTemplate>
+ *         <button kendoTreeListEditCommand class="k-primary">Edit</button>
+ *         <button kendoTreeListRemoveCommand>Remove</button>
+ *      </ng-template>
+ *   </kendo-treelist-command-column>
+ * </kendo-treelist>
+ * ```
  */
 export class CommandColumnComponent extends ColumnBase {
     constructor(parent, optionChanges) {

package/esm2020/columns/span-column.component.mjs

@@ -25,25 +25,15 @@ export function isSpanColumnComponent(column) {
  * [sorting]({% slug sorting_treelist %}) and [filtering]({% slug filtering_treelist %}). Wrap the columns that will be
  * merged inside the `<kendo-treelist-span-column>` tag.
  *
- * {% meta height:570 %}
- * {% embed_file configuration/span-column/app.component.ts preview %}
- * {% embed_file configuration/span-column/app.module.ts %}
- * {% embed_file shared/main.ts %}
- * {% embed_file shared/employees.ts %}
- * {% endmeta %}
- *
- * By default, the data cell displays the data for the specified fields. To further customize
- * the span-column functionality, use a [cell template]({% slug api_treelist_celltemplatedirective %}).
- *
- * ```html-no-run
+ * ```html
  * <kendo-treelist-span-column>
- *  <kendo-treelist-column field="field1" title="Field 1"></kendo-treelist-column>
- *  <kendo-treelist-column field="field2" title="Field 2"></kendo-treelist-column>
- *    <ng-template kendoTreeListCellTemplate let-dataItem>
- *        <h5>{{ dataItem.field1 }}</h5>
- *        <p>{{ dataItem.field2 }}</p>
- *    </ng-template>
- *  </kendo-treelist-span-column>
+ *   <kendo-treelist-column field="field1" ></kendo-treelist-column>
+ *   <kendo-treelist-column field="field2" ></kendo-treelist-column>
+ *   <ng-template kendoTreeListCellTemplate let-dataItem>
+ *     <h5>{{ dataItem.field1 }}</h5>
+ *     <p>{{ dataItem.field2 }}</p>
+ *   </ng-template>
+ * </kendo-treelist-span-column>
  * ```
  */
 export class SpanColumnComponent extends ColumnBase {
@@ -71,22 +61,8 @@ export class SpanColumnComponent extends ColumnBase {
     /**
      * Defines whether the edit template of the column will be rendered. The default value is `false`.
      *
-     * > To enable the editing functionality for a spanned column, set an edit template for it.
+     * To enable the editing functionality for a spanned column, set an edit template for it.
      *
-     * @example
-     * ```html-no-run
-     * <kendo-treelist>
-     *    <kendo-treelist-span-column [editable]="false">
-     *      <kendo-treelist-column field="UnitPrice">
-     *      </kendo-treelist-column>
-     *      <kendo-treelist-column field="ProductName">
-     *      </kendo-treelist-column>
-     *      <ng-template kendoTreeListEditTemplate>
-     *         .....
-     *      </ng-template>
-     *    </kendo-treelist-span-column>
-     * </kendo-treelist>
-     * ```
      */
     set editable(value) {
         this._editable = value;
@@ -131,56 +107,9 @@ export class SpanColumnComponent extends ColumnBase {
     }
     /**
      * Toggles the locked (frozen) state of the columns. Locked columns are visible
-     * at all times during the horizontal scrolling of the TreeList.
-     *
-     * For the option to work properly, make sure that:
-     * - Scrolling is enabled.
-     * - The `height` option of the TreeList is set.
-     * - The widths of all TreeList columns are explicitly set in pixels. In this way,
-     * the TreeList adjusts the layout of the locked and unlocked columns.
+     * at all times during the horizontal scrolling of the TreeList. [See example](slug:locked_columns_treelist).
      *
      * @default false
-     *
-     * @example
-     * ```ts
-     * _@Component({
-     *    selector: 'my-app',
-     *    template: `
-     *        <kendo-treelist [data]="treelistData" [scrollable]="scrollable" style="height: 200px">
-     *          <kendo-treelist-span-column [locked]="true">
-     *             <kendo-treelist-column field="ProductID" title="Product ID" [width]="120">
-     *             </kendo-treelist-column>
-     *             <kendo-treelist-column field="ProductName" title="Product Name" [width]="200">
-     *             </kendo-treelist-column>
-     *          </kendo-treelist-span-column>
-     *          <kendo-treelist-column field="UnitPrice" title="Unit Price" [width]="230">
-     *          </kendo-treelist-column>
-     *        </kendo-treelist>
-     *    `
-     * })
-     *
-     * class AppComponent {
-     *    public treelistData: any[];
-     *
-     *    constructor() {
-     *        this.treelistData = products;
-     *    }
-     * }
-     *
-     * const products = [{
-     *    "ProductID": 1,
-     *    "ProductName": "Chai",
-     *    "UnitPrice": 18.0000,
-     *    "Discontinued": true
-     *  }, {
-     *    "ProductID": 2,
-     *    "ProductName": "Chang",
-     *    "UnitPrice": 19.0000,
-     *    "Discontinued": false
-     *  }
-     * ];
-     *
-     * ```
      */
     set locked(value) {
         this._locked = value;

package/esm2020/editing/add-command.directive.mjs

@@ -26,7 +26,7 @@ import * as i4 from "@angular/common";
  *
  * @example
  * ```html
- * <kendo-treelist>
+ * <kendo-treelist ...>
  *   <kendo-treelist-command-column title="command">
  *     <ng-template kendoTreeListCellTemplate let-cellContext="cellContext">
  *       <button [kendoTreeListAddCommand]="cellContext" class="k-primary">Edit</button>

package/esm2020/editing/cancel-command.directive.mjs

@@ -23,7 +23,7 @@ import * as i4 from "@angular/common";
  *
  * @example
  * ```html
- * <kendo-treelist>
+ * <kendo-treelist ...>
  *   <kendo-treelist-command-column title="command">
  *     <ng-template kendoTreeListCellTemplate let-cellContext="cellContext">
  *       <button [kendoTreeListCancelCommand]="cellContext">Cancel changes</button>

package/esm2020/editing/edit-command.directive.mjs

@@ -23,7 +23,7 @@ import * as i4 from "@angular/common";
  *
  * @example
  * ```html
- * <kendo-treelist>
+ * <kendo-treelist ...>
  *   <kendo-treelist-command-column title="command">
  *     <ng-template kendoTreeListCellTemplate let-cellContext="cellContext">
  *       <button [kendoTreeListEditCommand]="cellContext">Edit</button>

package/esm2020/editing/edit-template.directive.mjs

@@ -16,6 +16,17 @@ import * as i0 from "@angular/core";
  * - `formGroup`—The current [`FormGroup`](link:site.data.urls.angular['formgroupapi']). If you use the TreeList inside [Template-Driven Forms](link:site.data.urls.angular['forms']), `formGroup` will be `undefined`.
  * - `isNew`—The state of the current item.
  * - `rowIndex`—The current row index. If inside a new item row, `rowIndex` is `-1`.
+ *
+ *  * @example
+ * ```html
+ * <kendo-treelist ...>
+ *   <kendo-treelist-command-column title="command">
+ *     <ng-template kendoTreeListEditTemplate let-rowIndex="rowIndex">
+ *         {{rowIndex}}
+ *     </ng-template>
+ *   </kendo-treelist-command-column>
+ * </kendo-treelist>
+ * ```
  */
 export class EditTemplateDirective {
     constructor(templateRef) {

package/esm2020/editing/remove-command.directive.mjs

@@ -23,7 +23,7 @@ import * as i4 from "@angular/common";
  *
  * @example
  * ```html
- * <kendo-treelist>
+ * <kendo-treelist ...>
  *   <kendo-treelist-command-column title="command">
  *     <ng-template kendoTreeListCellTemplate let-cellContext="cellContext">
  *       <button [kendoTreeListRemoveCommand]="cellContext">Remove row</button>

package/esm2020/editing/save-command.directive.mjs

@@ -23,7 +23,7 @@ import * as i4 from "@angular/common";
  *
  * @example
  * ```html
- * <kendo-treelist>
+ * <kendo-treelist ...>
  *   <kendo-treelist-command-column title="command">
  *     <ng-template kendoTreeListCellTemplate let-cellContext="cellContext">
  *       <button [kendoTreeListSaveCommand]="cellContext">Save changes</button>

package/esm2020/excel/excel-command.directive.mjs

@@ -21,7 +21,7 @@ import * as i4 from "@angular/common";
  *
  * @example
  * ```html
- * <kendo-treelist>
+ * <kendo-treelist ...>
  *   <ng-template kendoTreeListToolbarTemplate>
  *     <button kendoTreeListExcelCommand>Export to PDF</button>
  *   </ng-template>

package/esm2020/filtering/cell/boolean-filter-cell.component.mjs

@@ -14,19 +14,19 @@ import * as i4 from "@progress/kendo-angular-dropdowns";
 import * as i5 from "../filter-input.directive";
 /**
  * Represents a Boolean filter-cell component.
+ * [See example](slug:builtinfiltertemplate_treelist#toc-setting-the-default-filter-operator).
  *
  * @example
- *
- *  ```html-no-run
- *      <kendo-treelist-column field="ProductName" title="Product Name">
- *          <ng-template kendoTreeListFilterCellTemplate let-filter let-column="column">
- *          <kendo-treelist-boolean-filter-cell
- *              [column]="column"
- *              [filter]="filter">
- *          </kendo-treelist-boolean-filter-cell>
- *          </ng-template>
- *      </kendo-treelist-column>
- *   ```
+ * ```html
+ * <kendo-treelist-column field="ProductName" title="Product Name">
+ *   <ng-template kendoTreeListFilterCellTemplate let-filter let-column="column">
+ *     <kendo-treelist-boolean-filter-cell
+ *       [column]="column"
+ *       [filter]="filter">
+ *     </kendo-treelist-boolean-filter-cell>
+ *   </ng-template>
+ * </kendo-treelist-column>
+ * ```
  */
 export class BooleanFilterCellComponent extends BooleanFilterComponent {
     constructor(filterService, localization, cd) {

package/esm2020/filtering/cell/date-filter-cell.component.mjs

@@ -17,17 +17,16 @@ import * as i5 from "../filter-input.directive";
  *
  * @example
  *
- *  ```html-no-run
- *      <kendo-treelist-column field="OrderDate" title="Order Date">
- *          <ng-template kendoTreeListFilterCellTemplate let-filter let-column="column">
- *          <kendo-treelist-date-filter-cell
- *              [showOperators]="false"
- *              [column]="column"
- *              [filter]="filter">
- *          </kendo-treelist-date-filter-cell>
- *          </ng-template>
- *      </kendo-treelist-column>
- *   ```
+ * ```html
+ * <kendo-treelist-column field="OrderDate">
+ *   <ng-template kendoTreeListFilterCellTemplate let-filter let-column="column">
+ *     <kendo-treelist-date-filter-cell
+ *       [column]="column"
+ *       [filter]="filter">
+ *     </kendo-treelist-date-filter-cell>
+ *   </ng-template>
+ * </kendo-treelist-column>
+ * ```
  */
 export class DateFilterCellComponent extends DateFilterComponent {
     constructor(filterService, localization) {
@@ -36,6 +35,7 @@ export class DateFilterCellComponent extends DateFilterComponent {
         /**
          * Determines if the drop-down filter operators will be displayed. The default value is `true`.
          * @type {boolean}
+         * @default true
          */
         this.showOperators = true;
     }

package/esm2020/filtering/cell/filter-cell-operators.component.mjs

@@ -15,6 +15,20 @@ import * as i4 from "@angular/common";
 import * as i5 from "../../navigation/focusable.directive";
 /**
  * Represents a component which accommodates the filter operators.
+ *
+ * @example
+ * ```html
+ * <kendo-treelist ...>
+ *   <kendo-treelist-column field="ProductName">
+ *     <ng-template kendoTreeListFilterCellTemplate let-filter let-column="column">
+ *       <input />
+ *       <kendo-treelist-filter-cell-operators
+ *         [operators]="[{text: 'Equals', value: 'eq'}]">
+ *       </kendo-treelist-filter-cell-operators>
+ *     </ng-template>
+ *   </kendo-treelist-column>
+ * </kendo-treelist>
+ * ```
  */
 export class FilterCellOperatorsComponent {
     constructor(localization) {
@@ -28,6 +42,7 @@ export class FilterCellOperatorsComponent {
         /**
          * Determines if the list of operators will be displayed.
          * @type {boolean}
+         * @default true
          */
         this.showOperators = true;
         /**