@progress/kendo-angular-listbox 21.0.0-develop.2 → 21.0.0-develop.21

package/index.d.ts

@@ -10,7 +10,6 @@ export { ItemSelectableDirective } from './item-selectable.directive';
 export { ListBoxSize } from './size';
 export { ActionName } from './toolbar';
 export { ListBoxToolbarPosition } from './toolbar';
-export { Toolbar } from './toolbar';
 export { ListBoxToolbarConfig } from './toolbar';
 export { ListBoxSelectionEvent } from './selection.service';
 export { CustomMessagesComponent } from './localization/custom-messages.component';

package/keyboard-navigation.service.d.ts

@@ -6,8 +6,17 @@ import { ElementRef, EventEmitter, NgZone, Renderer2 } from "@angular/core";
 import { Button } from "@progress/kendo-angular-buttons";
 import { ListBoxComponent } from "./listbox.component";
 import { ActionName, Tool } from "./toolbar";
-import { ListBoxSelectionEvent } from "./selection.service";
 import * as i0 from "@angular/core";
+/**
+ * @hidden
+ * Internal event for keyboard navigation selection changes
+ */
+export interface KeyboardSelectionEvent {
+    index: number;
+    prevIndex?: number;
+    ctrlKey?: boolean;
+    shiftKey?: boolean;
+}
 /**
  * @hidden
  */
@@ -21,7 +30,11 @@ export declare class KeyboardNavigationService {
     onMoveSelectedItem: EventEmitter<string>;
     onTransferAllEvent: EventEmitter<ActionName>;
     onShiftSelectedItem: EventEmitter<ActionName>;
-    onSelectionChange: EventEmitter<ListBoxSelectionEvent>;
+    onSelectionChange: EventEmitter<KeyboardSelectionEvent>;
+    onSelectAll: EventEmitter<void>;
+    onSelectToEnd: EventEmitter<{
+        direction: 'home' | 'end';
+    }>;
     constructor(renderer: Renderer2, zone: NgZone);
     onKeyDown(event: any, toolsRef: Array<Button>, toolbar: Tool[], childListbox: ListBoxComponent, parentListbox: ListBoxComponent, listboxItems: Array<ElementRef>): void;
     changeTabindex(previousItem: HTMLElement, currentItem: HTMLElement, shouldBlur?: boolean): void;
@@ -34,6 +47,7 @@ export declare class KeyboardNavigationService {
     private transferAllItems;
     private transferItem;
     private changeFocusedItem;
+    private onShiftArrow;
     private onArrowDown;
     private onArrowUp;
     static ɵfac: i0.ɵɵFactoryDeclaration<KeyboardNavigationService, never>;

package/listbox.component.d.ts

@@ -2,12 +2,13 @@
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, NgZone, OnDestroy, OnInit, QueryList, Renderer2 } from '@angular/core';
+import { AfterViewInit, ElementRef, EventEmitter, NgZone, OnDestroy, OnInit, QueryList, Renderer2 } from '@angular/core';
 import { ListBoxSelectionEvent, ListBoxSelectionService } from './selection.service';
 import { ItemTemplateDirective } from './item-template.directive';
 import { Direction } from './util';
 import { ListBoxSize } from './size';
 import { ActionName, ListBoxToolbarConfig, Tool } from './toolbar';
+import { SelectionMode } from './selection-mode';
 import { Button } from '@progress/kendo-angular-buttons';
 import { KeyboardNavigationService } from './keyboard-navigation.service';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
@@ -48,7 +49,6 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
     private renderer;
     private zone;
     private localization;
-    private changeDetector;
     /**
      * @hidden
      */
@@ -81,6 +81,13 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
      * Specifies the field of the data item that provides the text content of the nodes.
      */
     textField: string;
+    /**
+     * Sets the selection mode of the ListBox.
+     *
+     * @default 'single'
+     */
+    set selectable(mode: SelectionMode);
+    get selectable(): SelectionMode;
     /**
      * Specifies the data that the ListBox displays.
      *
@@ -96,8 +103,10 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
     /**
      * Configures the toolbar of the ListBox.
      * Specifies whether to display a toolbar and which tools and position to use.
+     *
+     * @default false
      */
-    set toolbar(config: ListBoxToolbarConfig);
+    set toolbar(config: boolean | ListBoxToolbarConfig);
     /**
      * Specifies the value of the `aria-label` attribute of the Listbox element.
      *
@@ -122,7 +131,7 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
     /**
      * Fires when you click a ListBox item.
      */
-    actionClick: EventEmitter<ActionName>;
+    action: EventEmitter<ActionName>;
     /**
      * @hidden
      */
@@ -167,7 +176,8 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
     private _size;
     private subs;
     private shouldFireFocusIn;
-    constructor(keyboardNavigationService: KeyboardNavigationService, selectionService: ListBoxSelectionService, hostElement: ElementRef, renderer: Renderer2, zone: NgZone, localization: LocalizationService, changeDetector: ChangeDetectorRef);
+    private _selectable;
+    constructor(keyboardNavigationService: KeyboardNavigationService, selectionService: ListBoxSelectionService, hostElement: ElementRef, renderer: Renderer2, zone: NgZone, localization: LocalizationService);
     ngOnInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
@@ -175,8 +185,14 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
      * @hidden
      */
     performAction(actionName: ActionName): void;
+    /**
+     * Selects multiple ListBox nodes programmatically.
+     */
+    select(indices: number[]): void;
     /**
      * Selects a ListBox node programmatically.
+     *
+     * @hidden
      */
     selectItem(index: number): void;
     /**
@@ -184,9 +200,9 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
      */
     clearSelection(): void;
     /**
-     * Gets the index of the currently selected item in the ListBox.
+     * Gets the indexes of the currently selected items in the ListBox.
      */
-    get selectedIndex(): number;
+    get selectedIndices(): number[];
     /**
      * @hidden
      */
@@ -203,7 +219,6 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
      * @hidden
      */
     toolSVGIcon(icon: SVGIcon): SVGIcon;
-    private onClickEvent;
     private initSubscriptions;
     private onFocusIn;
     private setIds;
@@ -211,5 +226,5 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
     private setToolbarClass;
     private setSizingClass;
     static ɵfac: i0.ɵɵFactoryDeclaration<ListBoxComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ListBoxComponent, "kendo-listbox", never, { "textField": { "alias": "textField"; "required": false; }; "data": { "alias": "data"; "required": false; }; "size": { "alias": "size"; "required": false; }; "toolbar": { "alias": "toolbar"; "required": false; }; "listboxLabel": { "alias": "listboxLabel"; "required": false; }; "listboxToolbarLabel": { "alias": "listboxToolbarLabel"; "required": false; }; "itemDisabled": { "alias": "itemDisabled"; "required": false; }; }, { "selectionChange": "selectionChange"; "actionClick": "actionClick"; "getChildListbox": "getChildListbox"; }, ["itemTemplate"], never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ListBoxComponent, "kendo-listbox", never, { "textField": { "alias": "textField"; "required": false; }; "selectable": { "alias": "selectable"; "required": false; }; "data": { "alias": "data"; "required": false; }; "size": { "alias": "size"; "required": false; }; "toolbar": { "alias": "toolbar"; "required": false; }; "listboxLabel": { "alias": "listboxLabel"; "required": false; }; "listboxToolbarLabel": { "alias": "listboxToolbarLabel"; "required": false; }; "itemDisabled": { "alias": "itemDisabled"; "required": false; }; }, { "selectionChange": "selectionChange"; "action": "action"; "getChildListbox": "getChildListbox"; }, ["itemTemplate"], never, true, never>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-listbox",
-  "version": "21.0.0-develop.2",
+  "version": "21.0.0-develop.21",
   "description": "Kendo UI for Angular ListBox",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -16,10 +16,35 @@
   ],
   "@progress": {
     "friendlyName": "ListBox",
+    "migrations": {
+      "options": {
+        "parser": "tsx",
+        "pattern": "*.{ts,html}"
+      },
+      "codemods": {
+        "19": [
+          {
+            "description": "Migrate selectedIndex to selectedIndices for ListBox component.",
+            "file": "codemods/v21/listbox-selectedindex.js",
+            "prompt": "true"
+          },
+          {
+            "description": "Migrate actionClick to action for ListBox component.",
+            "file": "codemods/v21/listbox-actionclick.js",
+            "prompt": "true"
+          },
+          {
+            "description": "Migrate Toolbar interface name to ListBoxToolbarConfig.",
+            "file": "codemods/v21/listbox-toolbar.js",
+            "prompt": "true"
+          }
+        ]
+      }
+    },
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1761753096,
+      "publishDate": 1762427032,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"
     }
   },
@@ -29,15 +54,16 @@
     "@angular/core": "18 - 20",
     "@angular/platform-browser": "18 - 20",
     "@progress/kendo-licensing": "^1.7.0",
-    "@progress/kendo-angular-buttons": "21.0.0-develop.2",
-    "@progress/kendo-angular-common": "21.0.0-develop.2",
-    "@progress/kendo-angular-popup": "21.0.0-develop.2",
+    "@progress/kendo-angular-buttons": "21.0.0-develop.21",
+    "@progress/kendo-angular-common": "21.0.0-develop.21",
+    "@progress/kendo-angular-popup": "21.0.0-develop.21",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "21.0.0-develop.2",
-    "@progress/kendo-common": "^1.0.1"
+    "@progress/kendo-angular-schematics": "21.0.0-develop.21",
+    "@progress/kendo-common": "^1.0.1",
+    "node-html-parser": "^7.0.1"
   },
   "schematics": "./schematics/collection.json",
   "module": "fesm2022/progress-kendo-angular-listbox.mjs",

package/schematics/ngAdd/index.js

@@ -7,11 +7,11 @@ function default_1(options) {
         // Additional dependencies to install.
         // See https://github.com/telerik/kendo-schematics/issues/28
         peerDependencies: {
-            '@progress/kendo-angular-buttons': '21.0.0-develop.2',
-            '@progress/kendo-angular-common': '21.0.0-develop.2',
-            '@progress/kendo-angular-l10n': '21.0.0-develop.2',
+            '@progress/kendo-angular-buttons': '21.0.0-develop.21',
+            '@progress/kendo-angular-common': '21.0.0-develop.21',
+            '@progress/kendo-angular-l10n': '21.0.0-develop.21',
             // Peer of kendo-angular-buttons
-            '@progress/kendo-angular-popup': '21.0.0-develop.2'
+            '@progress/kendo-angular-popup': '21.0.0-develop.21'
         } });
     return (0, schematics_1.externalSchematic)('@progress/kendo-angular-schematics', 'ng-add', finalOptions);
 }

package/selection-mode.d.ts

@@ -0,0 +1,12 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2025 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * Represents the possible selection options of the ListBox.
+ *
+ * The possible values are:
+ * - `'single'` - allows the selection of a single item.
+ * - `'multiple'` - allows the selection of multiple items.
+ */
+export type SelectionMode = 'single' | 'multiple';

package/selection.service.d.ts

@@ -3,6 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { EventEmitter } from "@angular/core";
+import { SelectionMode } from "./selection-mode";
 import * as i0 from "@angular/core";
 /**
  * Defines the event that fires when you make a new selection in the ListBox component.
@@ -10,21 +11,32 @@ import * as i0 from "@angular/core";
  */
 export interface ListBoxSelectionEvent {
     /**
-     * The index of the currently selected item.
+     * The indices of items that were selected with the last selection operation.
+     * Returns `null` if no items were selected.
      */
-    index: number;
+    selectedIndices: number[] | null;
     /**
-     * The index of the previously selected item.
+     * The indices of items that were deselected with the last selection operation.
+     * Returns `null` if no items were deselected.
      */
-    prevIndex: number;
+    deselectedIndices: number[] | null;
 }
 /**
  * @hidden
  */
 export declare class ListBoxSelectionService {
+    selectedIndices: number[];
+    selectionMode: SelectionMode;
+    lastSelectedOrUnselectedIndex: number | null;
+    rangeSelectionTargetIndex: number | null;
+    private rangeSelectionAnchorIndex;
     onSelect: EventEmitter<any>;
-    selectedIndex: number;
-    select(index: number): void;
+    select(index: number, ctrlKey?: boolean, shiftKey?: boolean): void;
+    selectRange(targetIndex: number): void;
+    setSelectedIndices(indices: number[]): void;
+    addToSelectedIndices(index: number): void;
+    selectAll(totalItems: number): void;
+    areAllSelected(totalItems: number): boolean;
     isSelected(index: number): boolean;
     clearSelection(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ListBoxSelectionService, never>;

package/toolbar.d.ts

@@ -14,7 +14,7 @@ export type ListBoxToolbarPosition = 'left' | 'right' | 'top' | 'bottom';
 /**
  * Defines the possible tool and position settings that the ListBox can accept for its built-in toolbar.
  */
-export interface Toolbar {
+export interface ListBoxToolbarConfig {
     /**
      * Specifies the set of tools to display in the toolbar.
      * When you omit this setting, all tools are included.
@@ -25,15 +25,6 @@ export interface Toolbar {
      */
     position?: ListBoxToolbarPosition;
 }
-/**
- * Defines the possible values that the ListBox can accept for its built-in toolbar.
- *
- * - Use `false` to hide the toolbar.
- * - Omit the setting or use `true` to show the default settings, which are the full set of possible tools and position `"right"`.
- * - Use a config object of type [`Toolbar`]({% slug api_listbox_toolbar %}) to specify tools or position. When you specify only [`tools`]({% slug api_listbox_toolbar %}#toc-tools) or [`position`]({% slug api_listbox_toolbar %}#toc-position), the other property will use its default value.
- *
- */
-export type ListBoxToolbarConfig = boolean | Toolbar;
 /**
  * @hidden
  */