@progress/kendo-angular-listbox 11.4.1-develop.9 → 11.5.0-develop.2

package/fesm2020/progress-kendo-angular-listbox.mjs

@@ -3,16 +3,18 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from '@angular/core';
-import { EventEmitter, Injectable, Directive, Input, HostBinding, HostListener, isDevMode, Component, ContentChild, ViewChild, ViewChildren, Output, NgModule } from '@angular/core';
+import { EventEmitter, Injectable, Directive, Input, forwardRef, HostBinding, HostListener, isDevMode, Component, ContentChild, ViewChild, ViewChildren, Output, NgModule } from '@angular/core';
 import { validatePackage } from '@progress/kendo-licensing';
 import { Subscription } from 'rxjs';
 import { getter } from '@progress/kendo-common';
 import { caretAltUpIcon, caretAltDownIcon, caretAltLeftIcon, caretAltRightIcon, caretDoubleAltRightIcon, caretDoubleAltLeftIcon, xIcon } from '@progress/kendo-svg-icons';
 import { Keys, isChanged } from '@progress/kendo-angular-common';
 import { take } from 'rxjs/operators';
-import * as i3 from '@progress/kendo-angular-buttons';
+import * as i1 from '@progress/kendo-angular-l10n';
+import { ComponentMessages, LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
+import * as i4 from '@progress/kendo-angular-buttons';
 import { ButtonsModule } from '@progress/kendo-angular-buttons';
-import * as i4 from '@angular/common';
+import * as i6 from '@angular/common';
 import { CommonModule } from '@angular/common';
 
 /**
@@ -22,8 +24,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-listbox',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1679481186,
-    version: '11.4.1-develop.9',
+    publishDate: 1680079886,
+    version: '11.5.0-develop.2',
     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'
 };
 
@@ -441,6 +443,60 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             type: Injectable
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.NgZone }]; } });
 
+/**
+ * @hidden
+ */
+class Messages extends ComponentMessages {
+}
+Messages.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+Messages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: Messages, inputs: { moveUp: "moveUp", moveDown: "moveDown", remove: "remove", transferTo: "transferTo", transferFrom: "transferFrom", transferAllTo: "transferAllTo", transferAllFrom: "transferAllFrom" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: Messages, decorators: [{
+            type: Directive
+        }], propDecorators: { moveUp: [{
+                type: Input
+            }], moveDown: [{
+                type: Input
+            }], remove: [{
+                type: Input
+            }], transferTo: [{
+                type: Input
+            }], transferFrom: [{
+                type: Input
+            }], transferAllTo: [{
+                type: Input
+            }], transferAllFrom: [{
+                type: Input
+            }] } });
+
+/**
+ * @hidden
+ */
+class LocalizedMessagesDirective extends Messages {
+    constructor(service) {
+        super();
+        this.service = service;
+    }
+}
+LocalizedMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: LocalizedMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+LocalizedMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: LocalizedMessagesDirective, selector: "[kendoListBoxLocalizedMessages]", providers: [
+        {
+            provide: Messages,
+            useExisting: forwardRef(() => LocalizedMessagesDirective)
+        }
+    ], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: LocalizedMessagesDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    providers: [
+                        {
+                            provide: Messages,
+                            useExisting: forwardRef(() => LocalizedMessagesDirective)
+                        }
+                    ],
+                    selector: '[kendoListBoxLocalizedMessages]'
+                }]
+        }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });
+
 /**
  * @hidden
  */
@@ -480,12 +536,13 @@ let idx = 0;
  * Represents the [Kendo UI ListBox component for Angular]({% slug overview_listbox %}).
  */
 class ListBoxComponent {
-    constructor(keyboardNavigationService, selectionService, hostElement, renderer, zone) {
+    constructor(keyboardNavigationService, selectionService, hostElement, renderer, zone, localization) {
         this.keyboardNavigationService = keyboardNavigationService;
         this.selectionService = selectionService;
         this.hostElement = hostElement;
         this.renderer = renderer;
         this.zone = zone;
+        this.localization = localization;
         /**
          * @hidden
          */
@@ -567,6 +624,12 @@ class ListBoxComponent {
     get listClasses() {
         return `k-list k-list-${sizeClassMap[this.size]}`;
     }
+    /**
+     * @hidden
+     */
+    messageFor(key) {
+        return this.localization.get(key);
+    }
     ngOnInit() {
         // This event emitter gives us the connectedWith value from the DataBinding directive
         this.getChildListbox.emit();
@@ -634,13 +697,12 @@ class ListBoxComponent {
     }
     /**
      * @hidden
-    */
+     */
     get getListboxId() {
         const id = ++idx;
         const listboxId = `k-listbox-${id}`;
         return listboxId;
     }
-    ;
     /**
      * @hidden
      */
@@ -663,7 +725,10 @@ class ListBoxComponent {
      */
     swapItems(firstItemIndex, secondItemIndex) {
         const listboxItems = this.keyboardNavigationService.listboxItems;
-        [listboxItems[firstItemIndex], listboxItems[secondItemIndex]] = [listboxItems[secondItemIndex], listboxItems[firstItemIndex]];
+        [listboxItems[firstItemIndex], listboxItems[secondItemIndex]] = [
+            listboxItems[secondItemIndex],
+            listboxItems[firstItemIndex],
+        ];
     }
     onClickEvent(listboxItems, prevIndex, currentIndex, dir) {
         this.selectionChange.next(currentIndex);
@@ -679,7 +744,7 @@ class ListBoxComponent {
     }
     initSubscriptions(navService, hostEl, toolsRef) {
         this.subs.add(navService.onDeleteEvent.subscribe((index) => this.onDeleteEvent(index, navService)));
-        this.subs.add(this.renderer.listen(hostEl, 'keydown', event => navService.onKeyDown(event, toolsRef, this.selectedTools, this.childListbox, this.parentListbox)));
+        this.subs.add(this.renderer.listen(hostEl, 'keydown', (event) => navService.onKeyDown(event, toolsRef, this.selectedTools, this.childListbox, this.parentListbox)));
         this.subs.add(this.renderer.listen(this.listboxElement.nativeElement, 'focusin', () => navService.onFocusIn()));
         this.subs.add(navService.onShiftSelectedItem.subscribe((actionToPerform) => this.onShiftItems(actionToPerform)));
         this.subs.add(navService.onTransferAllEvent.subscribe((actionToPerform) => this.onShiftItems(actionToPerform)));
@@ -736,8 +801,9 @@ class ListBoxComponent {
         this.selectionService.selectedIndex = index;
         this.performAction('remove');
         this.updateListboxItems();
-        const setIndex = index + 1 === navService.listboxItems.length ?
-            { index: index - 1, tabindex: index - 1 } : { index, tabindex: index + 1 };
+        const setIndex = index + 1 === navService.listboxItems.length
+            ? { index: index - 1, tabindex: index - 1 }
+            : { index, tabindex: index + 1 };
         navService.changeTabindex(null, navService.listboxItems[setIndex['tabindex']]);
         this.selectionChange.next({ index: setIndex['index'], prevIndex: null });
         navService.selectedListboxItemIndex = setIndex['index'];
@@ -758,8 +824,39 @@ class ListBoxComponent {
         this.renderer.addClass(this.hostElement.nativeElement, `k-listbox-${sizeClassMap[size]}`);
     }
 }
-ListBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ListBoxComponent, deps: [{ token: KeyboardNavigationService }, { token: ListBoxSelectionService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-ListBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ListBoxComponent, selector: "kendo-listbox", inputs: { textField: "textField", data: "data", size: "size", toolbar: "toolbar", listboxLabel: "listboxLabel", listboxToolbarLabel: "listboxToolbarLabel", itemDisabled: "itemDisabled" }, outputs: { selectionChange: "selectionChange", actionClick: "actionClick", getChildListbox: "getChildListbox" }, host: { properties: { "class.k-listbox": "this.listboxClassName" } }, providers: [ListBoxSelectionService, KeyboardNavigationService], queries: [{ propertyName: "itemTemplate", first: true, predicate: ItemTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "listboxElement", first: true, predicate: ["listbox"], descendants: true }, { propertyName: "toolbarElement", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "tools", predicate: ["tools"], descendants: true }], ngImport: i0, template: `
+ListBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ListBoxComponent, deps: [{ token: KeyboardNavigationService }, { token: ListBoxSelectionService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+ListBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ListBoxComponent, selector: "kendo-listbox", inputs: { textField: "textField", data: "data", size: "size", toolbar: "toolbar", listboxLabel: "listboxLabel", listboxToolbarLabel: "listboxToolbarLabel", itemDisabled: "itemDisabled" }, outputs: { selectionChange: "selectionChange", actionClick: "actionClick", getChildListbox: "getChildListbox" }, host: { properties: { "class.k-listbox": "this.listboxClassName" } }, providers: [
+        ListBoxSelectionService,
+        KeyboardNavigationService,
+        LocalizationService,
+        {
+            provide: L10N_PREFIX,
+            useValue: 'kendo.listbox'
+        },
+    ], queries: [{ propertyName: "itemTemplate", first: true, predicate: ItemTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "listboxElement", first: true, predicate: ["listbox"], descendants: true }, { propertyName: "toolbarElement", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "tools", predicate: ["tools"], descendants: true }], ngImport: i0, template: `
+        <ng-container kendoListBoxLocalizedMessages
+            i18n-moveUp="kendo.listbox.moveUp|The title of the Move Up button"
+            moveUp="Move Up"
+            
+            i18n-moveDown="kendo.listbox.moveDown|The title of the Move Down button"
+            moveDown="Move Down"
+
+            i18n-transferTo="kendo.listbox.transferTo|The title of the Transfer To button"
+            transferTo="Transfer To"
+
+            i18n-transferAllTo="kendo.listbox.transferAllTo|The title of the Transfer All To button"
+            transferAllTo="Transfer All To"
+
+            i18n-transferFrom="kendo.listbox.transferFrom|The title of the Transfer From button"
+            transferFrom="Transfer From"
+
+            i18n-transferAllFrom="kendo.listbox.transferAllFrom|The title of the Transfer All From button"
+            transferAllFrom="Transfer All From"
+
+            i18n-remove="kendo.listbox.remove|The title of the Remove button"
+            remove="Remove"
+            >
+        </ng-container>
         <div
             #toolbar
             class="k-listbox-actions"
@@ -769,13 +866,13 @@ ListBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
         >
             <button
                 #tools
-                *ngFor="let tool of selectedTools; let i = index;"
+                *ngFor="let tool of selectedTools; let i = index"
                 kendoButton
                 [attr.tabindex]="i === 0 ? '0' : '-1'"
                 [size]="this.size"
                 [icon]="tool.icon"
                 [svgIcon]="tool.svgIcon"
-                [attr.title]="tool.label"
+                [attr.title]="messageFor(tool.name)"
                 (click)="performAction(tool.name)"
                 role="button"
             ></button>
@@ -783,7 +880,7 @@ ListBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
         <div class="k-list-scroller k-selectable">
             <div class="{{ listClasses }}">
                 <div class="k-list-content">
-                    <ul 
+                    <ul
                         #listbox
                         class="k-list-ul"
                         role="listbox"
@@ -791,7 +888,7 @@ ListBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
                         [attr.aria-multiselectable]="false"
                     >
                         <li
-                            *ngFor="let item of data; let i = index;"
+                            *ngFor="let item of data; let i = index"
                             kendoListBoxItemSelectable
                             class="k-list-item"
                             [attr.tabindex]="i === 0 ? '0' : '-1'"
@@ -800,11 +897,13 @@ ListBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
                             [index]="i"
                             [class.k-disabled]="itemDisabled(item)"
                         >
-                            <ng-template *ngIf="itemTemplate; else defaultItemTemplate"
+                            <ng-template
+                                *ngIf="itemTemplate; else defaultItemTemplate"
                                 [templateContext]="{
                                     templateRef: itemTemplate.templateRef,
                                     $implicit: item
-                                }">
+                                }"
+                            >
                             </ng-template>
                             <ng-template #defaultItemTemplate>
                                 <span class="k-list-item-text">{{ getText(item) }}</span>
@@ -814,13 +913,44 @@ ListBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
                 </div>
             </div>
         </div>
-    `, isInline: true, components: [{ type: i3.Button, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: ItemSelectableDirective, selector: "[kendoListBoxItemSelectable]", inputs: ["index"] }, { type: i3.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }] });
+    `, isInline: true, components: [{ type: i4.Button, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], directives: [{ type: LocalizedMessagesDirective, selector: "[kendoListBoxLocalizedMessages]" }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: ItemSelectableDirective, selector: "[kendoListBoxItemSelectable]", inputs: ["index"] }, { type: i4.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ListBoxComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-listbox',
-                    providers: [ListBoxSelectionService, KeyboardNavigationService],
+                    providers: [
+                        ListBoxSelectionService,
+                        KeyboardNavigationService,
+                        LocalizationService,
+                        {
+                            provide: L10N_PREFIX,
+                            useValue: 'kendo.listbox'
+                        },
+                    ],
                     template: `
+        <ng-container kendoListBoxLocalizedMessages
+            i18n-moveUp="kendo.listbox.moveUp|The title of the Move Up button"
+            moveUp="Move Up"
+            
+            i18n-moveDown="kendo.listbox.moveDown|The title of the Move Down button"
+            moveDown="Move Down"
+
+            i18n-transferTo="kendo.listbox.transferTo|The title of the Transfer To button"
+            transferTo="Transfer To"
+
+            i18n-transferAllTo="kendo.listbox.transferAllTo|The title of the Transfer All To button"
+            transferAllTo="Transfer All To"
+
+            i18n-transferFrom="kendo.listbox.transferFrom|The title of the Transfer From button"
+            transferFrom="Transfer From"
+
+            i18n-transferAllFrom="kendo.listbox.transferAllFrom|The title of the Transfer All From button"
+            transferAllFrom="Transfer All From"
+
+            i18n-remove="kendo.listbox.remove|The title of the Remove button"
+            remove="Remove"
+            >
+        </ng-container>
         <div
             #toolbar
             class="k-listbox-actions"
@@ -830,13 +960,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         >
             <button
                 #tools
-                *ngFor="let tool of selectedTools; let i = index;"
+                *ngFor="let tool of selectedTools; let i = index"
                 kendoButton
                 [attr.tabindex]="i === 0 ? '0' : '-1'"
                 [size]="this.size"
                 [icon]="tool.icon"
                 [svgIcon]="tool.svgIcon"
-                [attr.title]="tool.label"
+                [attr.title]="messageFor(tool.name)"
                 (click)="performAction(tool.name)"
                 role="button"
             ></button>
@@ -844,7 +974,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         <div class="k-list-scroller k-selectable">
             <div class="{{ listClasses }}">
                 <div class="k-list-content">
-                    <ul 
+                    <ul
                         #listbox
                         class="k-list-ul"
                         role="listbox"
@@ -852,7 +982,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                         [attr.aria-multiselectable]="false"
                     >
                         <li
-                            *ngFor="let item of data; let i = index;"
+                            *ngFor="let item of data; let i = index"
                             kendoListBoxItemSelectable
                             class="k-list-item"
                             [attr.tabindex]="i === 0 ? '0' : '-1'"
@@ -861,11 +991,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                             [index]="i"
                             [class.k-disabled]="itemDisabled(item)"
                         >
-                            <ng-template *ngIf="itemTemplate; else defaultItemTemplate"
+                            <ng-template
+                                *ngIf="itemTemplate; else defaultItemTemplate"
                                 [templateContext]="{
                                     templateRef: itemTemplate.templateRef,
                                     $implicit: item
-                                }">
+                                }"
+                            >
                             </ng-template>
                             <ng-template #defaultItemTemplate>
                                 <span class="k-list-item-text">{{ getText(item) }}</span>
@@ -875,9 +1007,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 </div>
             </div>
         </div>
-    `
+    `,
                 }]
-        }], ctorParameters: function () { return [{ type: KeyboardNavigationService }, { type: ListBoxSelectionService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }]; }, propDecorators: { listboxClassName: [{
+        }], ctorParameters: function () { return [{ type: KeyboardNavigationService }, { type: ListBoxSelectionService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i1.LocalizationService }]; }, propDecorators: { listboxClassName: [{
                 type: HostBinding,
                 args: ['class.k-listbox']
             }], itemTemplate: [{
@@ -1049,20 +1181,72 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 type: Input
             }] } });
 
+/**
+ * Custom component messages override default component messages
+ * ([see example]({% slug globalization_listbox %}#toc-localization)).
+ */
+class CustomMessagesComponent extends Messages {
+    constructor(service) {
+        super();
+        this.service = service;
+    }
+    get override() {
+        return true;
+    }
+}
+CustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: CustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+CustomMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: CustomMessagesComponent, selector: "kendo-listbox-messages", providers: [
+        {
+            provide: Messages,
+            useExisting: forwardRef(() => CustomMessagesComponent)
+        }
+    ], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: CustomMessagesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    providers: [
+                        {
+                            provide: Messages,
+                            useExisting: forwardRef(() => CustomMessagesComponent)
+                        }
+                    ],
+                    selector: 'kendo-listbox-messages',
+                    template: ``
+                }]
+        }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });
+
+const declarationsExports = [
+    LocalizedMessagesDirective,
+    ListBoxComponent,
+    ItemTemplateDirective,
+    ItemSelectableDirective,
+    DataBindingDirective,
+    CustomMessagesComponent,
+];
 /**
  * Represents the [NgModule](https://angular.io/api/core/NgModule) definition for the ListBox component.
  */
 class ListBoxModule {
 }
 ListBoxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ListBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ListBoxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ListBoxModule, declarations: [ListBoxComponent, ItemTemplateDirective, ItemSelectableDirective, DataBindingDirective], imports: [ButtonsModule, CommonModule], exports: [ListBoxComponent, ItemTemplateDirective, ItemSelectableDirective, DataBindingDirective] });
+ListBoxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ListBoxModule, declarations: [LocalizedMessagesDirective,
+        ListBoxComponent,
+        ItemTemplateDirective,
+        ItemSelectableDirective,
+        DataBindingDirective,
+        CustomMessagesComponent], imports: [ButtonsModule, CommonModule], exports: [LocalizedMessagesDirective,
+        ListBoxComponent,
+        ItemTemplateDirective,
+        ItemSelectableDirective,
+        DataBindingDirective,
+        CustomMessagesComponent] });
 ListBoxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ListBoxModule, imports: [[ButtonsModule, CommonModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ListBoxModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [ButtonsModule, CommonModule],
-                    declarations: [ListBoxComponent, ItemTemplateDirective, ItemSelectableDirective, DataBindingDirective],
-                    exports: [ListBoxComponent, ItemTemplateDirective, ItemSelectableDirective, DataBindingDirective]
+                    declarations: [declarationsExports],
+                    exports: [declarationsExports]
                 }]
         }] });
 
@@ -1070,5 +1254,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { DataBindingDirective, ItemSelectableDirective, ItemTemplateDirective, ListBoxComponent, ListBoxModule };
+export { CustomMessagesComponent, DataBindingDirective, ItemSelectableDirective, ItemTemplateDirective, ListBoxComponent, ListBoxModule, LocalizedMessagesDirective };
 

package/index.d.ts

@@ -13,3 +13,5 @@ export { ListBoxToolbarPosition } from './toolbar';
 export { Toolbar } from './toolbar';
 export { ListBoxToolbarConfig } from './toolbar';
 export { ListBoxSelectionEvent } from './selection.service';
+export { CustomMessagesComponent } from './localization/custom-messages.component';
+export { LocalizedMessagesDirective } from "./localization/localized-messages.directive";

package/listbox.component.d.ts

@@ -9,6 +9,7 @@ import { ListBoxSize } from './size';
 import { ActionName, ListBoxToolbarConfig, Tool } from './toolbar';
 import { Button } from '@progress/kendo-angular-buttons';
 import { KeyboardNavigationService } from './keyboard-navigation.service';
+import { LocalizationService } from '@progress/kendo-angular-l10n';
 import * as i0 from "@angular/core";
 /**
  * Represents the [Kendo UI ListBox component for Angular]({% slug overview_listbox %}).
@@ -19,6 +20,7 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
     private hostElement;
     private renderer;
     private zone;
+    private localization;
     /**
      * @hidden
      */
@@ -89,6 +91,10 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
      * @hidden
      */
     get listClasses(): string;
+    /**
+     * @hidden
+     */
+    messageFor(key: string): string;
     /**
      * @hidden
      */
@@ -111,7 +117,7 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
     parentListbox: ListBoxComponent;
     private _size;
     private subs;
-    constructor(keyboardNavigationService: KeyboardNavigationService, selectionService: ListBoxSelectionService, hostElement: ElementRef, renderer: Renderer2, zone: NgZone);
+    constructor(keyboardNavigationService: KeyboardNavigationService, selectionService: ListBoxSelectionService, hostElement: ElementRef, renderer: Renderer2, zone: NgZone, localization: LocalizationService);
     ngOnInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
@@ -133,7 +139,7 @@ export declare class ListBoxComponent implements OnInit, AfterViewInit, OnDestro
     get selectedIndex(): number;
     /**
      * @hidden
-    */
+     */
     get getListboxId(): string;
     /**
      * @hidden

package/listbox.module.d.ts

@@ -3,17 +3,19 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from "@angular/core";
-import * as i1 from "./listbox.component";
-import * as i2 from "./item-template.directive";
-import * as i3 from "./item-selectable.directive";
-import * as i4 from "./data-binding.directive";
-import * as i5 from "@progress/kendo-angular-buttons";
-import * as i6 from "@angular/common";
+import * as i1 from "./localization/localized-messages.directive";
+import * as i2 from "./listbox.component";
+import * as i3 from "./item-template.directive";
+import * as i4 from "./item-selectable.directive";
+import * as i5 from "./data-binding.directive";
+import * as i6 from "./localization/custom-messages.component";
+import * as i7 from "@progress/kendo-angular-buttons";
+import * as i8 from "@angular/common";
 /**
  * Represents the [NgModule](https://angular.io/api/core/NgModule) definition for the ListBox component.
  */
 export declare class ListBoxModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ListBoxModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ListBoxModule, [typeof i1.ListBoxComponent, typeof i2.ItemTemplateDirective, typeof i3.ItemSelectableDirective, typeof i4.DataBindingDirective], [typeof i5.ButtonsModule, typeof i6.CommonModule], [typeof i1.ListBoxComponent, typeof i2.ItemTemplateDirective, typeof i3.ItemSelectableDirective, typeof i4.DataBindingDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ListBoxModule, [typeof i1.LocalizedMessagesDirective, typeof i2.ListBoxComponent, typeof i3.ItemTemplateDirective, typeof i4.ItemSelectableDirective, typeof i5.DataBindingDirective, typeof i6.CustomMessagesComponent], [typeof i7.ButtonsModule, typeof i8.CommonModule], [typeof i1.LocalizedMessagesDirective, typeof i2.ListBoxComponent, typeof i3.ItemTemplateDirective, typeof i4.ItemSelectableDirective, typeof i5.DataBindingDirective, typeof i6.CustomMessagesComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ListBoxModule>;
 }

package/localization/custom-messages.component.d.ts

@@ -0,0 +1,18 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { Messages } from './messages';
+import * as i0 from "@angular/core";
+/**
+ * Custom component messages override default component messages
+ * ([see example]({% slug globalization_listbox %}#toc-localization)).
+ */
+export declare class CustomMessagesComponent extends Messages {
+    protected service: LocalizationService;
+    constructor(service: LocalizationService);
+    protected get override(): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CustomMessagesComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CustomMessagesComponent, "kendo-listbox-messages", never, {}, {}, never, never>;
+}

package/localization/localized-messages.directive.d.ts

@@ -0,0 +1,16 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { Messages } from './messages';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export declare class LocalizedMessagesDirective extends Messages {
+    protected service: LocalizationService;
+    constructor(service: LocalizationService);
+    static ɵfac: i0.ɵɵFactoryDeclaration<LocalizedMessagesDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<LocalizedMessagesDirective, "[kendoListBoxLocalizedMessages]", never, {}, {}, never>;
+}

package/localization/messages.d.ts

@@ -0,0 +1,41 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { ComponentMessages } from '@progress/kendo-angular-l10n';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export declare class Messages extends ComponentMessages {
+    /**
+     * The text of the `Move Up` button title.
+     */
+    moveUp: string;
+    /**
+     * The text of the `Move Down` button title.
+     */
+    moveDown: string;
+    /**
+     * The text of the `Remove` button tittle.
+     */
+    remove: string;
+    /**
+     * The text of the `Transfer To` button title.
+     */
+    transferTo: string;
+    /**
+     * The text of the `Transfer From` button title.
+     */
+    transferFrom: string;
+    /**
+     * The text of the `Transfer All To` button title.
+     */
+    transferAllTo: string;
+    /**
+     * The text of the `Transfer All From` button title.
+     */
+    transferAllFrom: string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Messages, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<Messages, never, never, { "moveUp": "moveUp"; "moveDown": "moveDown"; "remove": "remove"; "transferTo": "transferTo"; "transferFrom": "transferFrom"; "transferAllTo": "transferAllTo"; "transferAllFrom": "transferAllFrom"; }, {}, never>;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-listbox",
-  "version": "11.4.1-develop.9",
+  "version": "11.5.0-develop.2",
   "description": "Kendo UI for Angular ListBox",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -23,14 +23,14 @@
     "@angular/core": "13 - 15",
     "@angular/platform-browser": "13 - 15",
     "@progress/kendo-licensing": "^1.0.2",
-    "@progress/kendo-angular-buttons": "11.4.1-develop.9",
-    "@progress/kendo-angular-common": "11.4.1-develop.9",
-    "@progress/kendo-angular-popup": "11.4.1-develop.9",
+    "@progress/kendo-angular-buttons": "11.5.0-develop.2",
+    "@progress/kendo-angular-common": "11.5.0-develop.2",
+    "@progress/kendo-angular-popup": "11.5.0-develop.2",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "11.4.1-develop.9",
+    "@progress/kendo-angular-schematics": "11.5.0-develop.2",
     "@progress/kendo-common": "^0.2.2"
   },
   "schematics": "./schematics/collection.json",