@progress/kendo-angular-listbox 0.1.1-dev.202204131442 → 1.0.0-dev.202204141101

package/bundles/kendo-angular-listbox.umd.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@progress/kendo-licensing"),require("rxjs"),require("@progress/kendo-common"),require("@angular/common"),require("@progress/kendo-angular-buttons"),require("@progress/kendo-angular-common")):"function"==typeof define&&define.amd?define("KendoAngularListbox",["exports","@angular/core","@progress/kendo-licensing","rxjs","@progress/kendo-common","@angular/common","@progress/kendo-angular-buttons","@progress/kendo-angular-common"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoAngularListbox={},e.ng.core,e.KendoLicensing,e.rxjs,e.KendoCommon,e.ng.common,e.KendoAngularButtons,e.KendoAngularCommon)}(this,function(e,i,s,r,o,t,n,l){"use strict";function a(n){if(n&&n.__esModule)return n;var o=Object.create(null);return n&&Object.keys(n).forEach(function(e){var t;"default"!==e&&(t=Object.getOwnPropertyDescriptor(n,e),Object.defineProperty(o,e,t.get?t:{enumerable:!0,get:function(){return n[e]}}))}),o.default=n,Object.freeze(o)}var c=a(i),d=a(t),p=a(n),m={name:"@progress/kendo-angular-listbox",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1649934053,version:"",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"},u=(g.prototype.select=function(e){this.selectedIndex=e,this.onSelect.next({index:this.selectedIndex})},g.prototype.isSelected=function(e){return e===this.selectedIndex},g.prototype.clearSelection=function(){this.selectedIndex=null},g);function g(){this.onSelect=new i.EventEmitter,this.selectedIndex=null}u.ɵfac=c.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:u,deps:[],target:c.ɵɵFactoryTarget.Injectable}),u.ɵprov=c.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:u}),c.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:u,decorators:[{type:i.Injectable}]});function f(e,t){return I(e)?I(t)&&I(n=e)&&"object"==typeof n?o.getter(t)(e):e:null;var n}function b(){return!1}var h=function(e){this.templateRef=e},y=(h.ɵfac=c.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:h,deps:[{token:c.TemplateRef}],target:c.ɵɵFactoryTarget.Directive}),h.ɵdir=c.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:h,selector:"[kendoListBoxItemTemplate]",ngImport:c}),c.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:h,decorators:[{type:i.Directive,args:[{selector:"[kendoListBoxItemTemplate]"}]}],ctorParameters:function(){return[{type:c.TemplateRef}]}}),"right"),v=[{name:"moveUp",label:"Move Up",icon:"arrow-n"},{name:"moveDown",label:"Move Down",icon:"arrow-s"},{name:"transferTo",label:"Transfer From",icon:"arrow-w"},{name:"transferFrom",label:"Transfer To",icon:"arrow-e"},{name:"transferAllTo",label:"Transfer All To",icon:"arrow-double-60-right"},{name:"transferAllFrom",label:"Transfer All From",icon:"arrow-double-60-left"},{name:"remove",label:"Remove",icon:"x"}],x={small:"sm",medium:"md",large:"lg"},k={left:"k-listbox-toolbar-left",right:"k-listbox-toolbar-right",top:"k-listbox-toolbar-top",bottom:"k-listbox-toolbar-bottom"},I=function(e){return null!=e},C=(Object.defineProperty(D.prototype,"selectedClassName",{get:function(){return this.selectionService.isSelected(this.index)},enumerable:!1,configurable:!0}),D.prototype.onClick=function(e){e.stopPropagation(),this.selectionService.select(this.index)},D);function D(e){this.selectionService=e}C.ɵfac=c.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:C,deps:[{token:u}],target:c.ɵɵFactoryTarget.Directive}),C.ɵdir=c.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:C,selector:"[kendoListBoxItemSelectable]",inputs:{index:"index"},host:{listeners:{click:"onClick($event)"},properties:{"class.k-selected":"this.selectedClassName"}},ngImport:c}),c.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:C,decorators:[{type:i.Directive,args:[{selector:"[kendoListBoxItemSelectable]"}]}],ctorParameters:function(){return[{type:u}]},propDecorators:{index:[{type:i.Input}],selectedClassName:[{type:i.HostBinding,args:["class.k-selected"]}],onClick:[{type:i.HostListener,args:["click",["$event"]]}]}});Object.defineProperty(B.prototype,"toolbar",{set:function(e){var t=y;"boolean"==typeof e?this.selectedTools=e?v:[]:(this.selectedTools=e.tools?e.tools.map(function(t){return v.find(function(e){return e.name===t})}):v,e.position&&(t=e.position)),this.setToolbarClass(t)},enumerable:!1,configurable:!0}),Object.defineProperty(B.prototype,"listClasses",{get:function(){return"k-list k-list-"+x[this.size]},enumerable:!1,configurable:!0}),B.prototype.ngOnDestroy=function(){this.sub.unsubscribe()},B.prototype.performAction=function(e){this.actionClick.next(e)},B.prototype.selectItem=function(e){this.selectionService.selectedIndex=e},B.prototype.clearSelection=function(){this.selectionService.clearSelection()},Object.defineProperty(B.prototype,"selectedIndex",{get:function(){return this.selectionService.selectedIndex},enumerable:!1,configurable:!0}),B.prototype.getText=function(e){if("string"!=typeof e&&!this.textField&&i.isDevMode())throw new Error("Missing textField input. When passing an array of objects as data, please set the textField input of the ListBox accordingly.");return f(e,this.textField)},B.prototype.setToolbarClass=function(t){var n=this;Object.keys(k).forEach(function(e){t===e?n.renderer.addClass(n.hostElement.nativeElement,k[e]):n.renderer.removeClass(n.hostElement.nativeElement,k[e])})};var T=B;function B(e,t,n){var o=this;this.selectionService=e,this.renderer=t,this.hostElement=n,this.listboxClassName=!0,this.data=[],this.size="medium",this.itemDisabled=b,this.selectionChange=new i.EventEmitter,this.actionClick=new i.EventEmitter,this.selectedTools=v,this.sub=new r.Subscription,s.validatePackage(m),this.setToolbarClass(y),this.sub.add(this.selectionService.onSelect.subscribe(function(e){o.selectionChange.next(e)}))}T.ɵfac=c.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:T,deps:[{token:u},{token:c.Renderer2},{token:c.ElementRef}],target:c.ɵɵFactoryTarget.Component}),T.ɵcmp=c.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:T,selector:"kendo-listbox",inputs:{textField:"textField",data:"data",size:"size",toolbar:"toolbar",itemDisabled:"itemDisabled"},outputs:{selectionChange:"selectionChange",actionClick:"actionClick"},host:{properties:{"class.k-listbox":"this.listboxClassName"}},providers:[u],queries:[{propertyName:"itemTemplate",first:!0,predicate:h,descendants:!0}],ngImport:c,template:'\n            <div class="k-listbox-toolbar" *ngIf="selectedTools.length > 0">\n                <ul class="k-reset">\n                    <li *ngFor="let tool of selectedTools">\n                        <button kendoButton [icon]="tool.icon" (click)="performAction(tool.name)"></button>\n                    </li>\n\n                    \x3c!-- react moving items has a smoother removal of the style: https://www.telerik.com/kendo-react-ui/components/listbox/ --\x3e\n                </ul>\n            </div>\n            <div class="k-list-scroller k-selectable">\n                <div class="{{ listClasses }}">\n                    <div class="k-list-content">\n                        <ul class="k-list-ul">\n                            <li\n                                class="k-list-item"\n                                *ngFor="let item of data; let i = index;"\n                                kendoListBoxItemSelectable\n                                [index]="i"\n                                [class.k-disabled]="itemDisabled(item)"\n                            >\n                                <ng-template *ngIf="itemTemplate; else defaultItemTemplate"\n                                    [templateContext]="{\n                                        templateRef: itemTemplate.templateRef,\n                                        $implicit: item\n                                    }">\n                                </ng-template>\n                                <ng-template #defaultItemTemplate>\n                                    <span class="k-list-item-text">{{ getText(item) }}</span>\n                                </ng-template>\n                            </li>\n                        </ul>\n                    </div>\n                </div>\n            </div>\n    ',isInline:!0,directives:[{type:d.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:d.NgForOf,selector:"[ngFor][ngForOf]",inputs:["ngForOf","ngForTrackBy","ngForTemplate"]},{type:p.ButtonDirective,selector:"button[kendoButton], span[kendoButton]",inputs:["toggleable","togglable","selected","tabIndex","icon","iconClass","imageUrl","disabled","size","rounded","fillMode","themeColor","role","primary","look"],outputs:["selectedChange","click"],exportAs:["kendoButton"]},{type:C,selector:"[kendoListBoxItemSelectable]",inputs:["index"]},{type:p.TemplateContextDirective,selector:"[templateContext]",inputs:["templateContext"]}]}),c.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:T,decorators:[{type:i.Component,args:[{selector:"kendo-listbox",providers:[u],template:'\n            <div class="k-listbox-toolbar" *ngIf="selectedTools.length > 0">\n                <ul class="k-reset">\n                    <li *ngFor="let tool of selectedTools">\n                        <button kendoButton [icon]="tool.icon" (click)="performAction(tool.name)"></button>\n                    </li>\n\n                    \x3c!-- react moving items has a smoother removal of the style: https://www.telerik.com/kendo-react-ui/components/listbox/ --\x3e\n                </ul>\n            </div>\n            <div class="k-list-scroller k-selectable">\n                <div class="{{ listClasses }}">\n                    <div class="k-list-content">\n                        <ul class="k-list-ul">\n                            <li\n                                class="k-list-item"\n                                *ngFor="let item of data; let i = index;"\n                                kendoListBoxItemSelectable\n                                [index]="i"\n                                [class.k-disabled]="itemDisabled(item)"\n                            >\n                                <ng-template *ngIf="itemTemplate; else defaultItemTemplate"\n                                    [templateContext]="{\n                                        templateRef: itemTemplate.templateRef,\n                                        $implicit: item\n                                    }">\n                                </ng-template>\n                                <ng-template #defaultItemTemplate>\n                                    <span class="k-list-item-text">{{ getText(item) }}</span>\n                                </ng-template>\n                            </li>\n                        </ul>\n                    </div>\n                </div>\n            </div>\n    '}]}],ctorParameters:function(){return[{type:u},{type:c.Renderer2},{type:c.ElementRef}]},propDecorators:{listboxClassName:[{type:i.HostBinding,args:["class.k-listbox"]}],itemTemplate:[{type:i.ContentChild,args:[h,{static:!1}]}],textField:[{type:i.Input}],data:[{type:i.Input}],size:[{type:i.Input}],toolbar:[{type:i.Input}],itemDisabled:[{type:i.Input}],selectionChange:[{type:i.Output}],actionClick:[{type:i.Output}]}});Object.create;function F(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var o,i,s=n.call(e),r=[];try{for(;(void 0===t||0<t--)&&!(o=s.next()).done;)r.push(o.value)}catch(e){i={error:e}}finally{try{o&&!o.done&&(n=s.return)&&n.call(s)}finally{if(i)throw i.error}}return r}Object.create;w.prototype.ngOnChanges=function(e){var t=this;l.isChanged("connectedWith",e,!1)&&(this.sub.add(this.listbox.selectionChange.subscribe(function(){t.selectedBox=t.listbox,t.connectedWith.clearSelection()})),this.sub.add(this.connectedWith.selectionChange.subscribe(function(){t.selectedBox=t.connectedWith,t.listbox.clearSelection()}))),l.isChanged("data",e,!0)&&(this.listbox.data=e.data.currentValue)},w.prototype.ngOnDestroy=function(){this.sub.unsubscribe()},w.prototype.moveVertically=function(e){var t,n=this.selectedBox.selectedIndex;I(n)&&(t="down"===e&&n>=this.selectedBox.data.length-1,"up"===e&&n<=0||t||(e=F([this.selectedBox.data[n],this.selectedBox.data[t="up"===e?n-1:n+1]],2),this.selectedBox.data[t]=e[0],this.selectedBox.data[n]=e[1],this.selectedBox.selectionService.select(t)))},w.prototype.removeItem=function(){var e=this.selectedBox.selectedIndex;I(e)&&(this.selectedBox.data.splice(e,1),this.selectedBox.selectionService.clearSelection())},w.prototype.transferItem=function(e,t){var n=e&&e.data[e.selectedIndex];n&&t&&e&&(t.data.push(n),e.data.splice(e.selectedIndex,1),e.clearSelection(),t.selectItem(t.data.length-1),this.selectedBox=t)},w.prototype.transferAll=function(e,t){var n;t&&e&&((n=t.data).splice.apply(n,function(e,t,n){if(n||2===arguments.length)for(var o,i=0,s=t.length;i<s;i++)!o&&i in t||((o=o||Array.prototype.slice.call(t,0,i))[i]=t[i]);return e.concat(o||Array.prototype.slice.call(t))}([t.data.length,0],F(e.data.splice(0,e.data.length)))),t.selectItem(t.data.length-1),this.selectedBox=t)};d=w;function w(e){var t=this;this.listbox=e,this.data=[],this.sub=new r.Subscription,this.selectedBox=this.listbox,this.sub.add(this.listbox.actionClick.subscribe(function(e){switch(e){case"moveUp":t.moveVertically("up");break;case"moveDown":t.moveVertically("down");break;case"transferTo":t.transferItem(t.connectedWith,t.listbox);break;case"transferFrom":t.transferItem(t.listbox,t.connectedWith);break;case"transferAllTo":t.transferAll(t.listbox,t.connectedWith);break;case"transferAllFrom":t.transferAll(t.connectedWith,t.listbox);break;case"remove":t.removeItem()}}))}d.ɵfac=c.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:d,deps:[{token:T}],target:c.ɵɵFactoryTarget.Directive}),d.ɵdir=c.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:d,selector:"[kendoListBoxDataBinding]",inputs:{data:["kendoListBoxDataBinding","data"],connectedWith:"connectedWith"},usesOnChanges:!0,ngImport:c}),c.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:d,decorators:[{type:i.Directive,args:[{selector:"[kendoListBoxDataBinding]"}]}],ctorParameters:function(){return[{type:T}]},propDecorators:{data:[{type:i.Input,args:["kendoListBoxDataBinding"]}],connectedWith:[{type:i.Input}]}});p=function(){};p.ɵfac=c.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:p,deps:[],target:c.ɵɵFactoryTarget.NgModule}),p.ɵmod=c.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:p,declarations:[T,h,C,d],imports:[n.ButtonsModule,t.CommonModule],exports:[T,h,C,d]}),p.ɵinj=c.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:p,imports:[[n.ButtonsModule,t.CommonModule]]}),c.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:c,type:p,decorators:[{type:i.NgModule,args:[{imports:[n.ButtonsModule,t.CommonModule],declarations:[T,h,C,d],exports:[T,h,C,d]}]}]}),e.DataBindingDirective=d,e.ItemSelectableDirective=C,e.ItemTemplateDirective=h,e.ListBoxComponent=T,e.ListBoxModule=p,Object.defineProperty(e,"__esModule",{value:!0})});

package/{dist/es2015/data-binding.directive.d.ts → data-binding.directive.d.ts}

@@ -4,6 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import { OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
 import { ListBoxComponent } from './listbox.component';
+import * as i0 from "@angular/core";
 /**
  * A directive which manages the functoinality of the ListBox tools out of the box, and modifies the provided data accordingly.
  */
@@ -33,4 +34,6 @@ export declare class DataBindingDirective implements OnChanges, OnDestroy {
     private removeItem;
     private transferItem;
     private transferAll;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DataBindingDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DataBindingDirective, "[kendoListBoxDataBinding]", never, { "data": "kendoListBoxDataBinding"; "connectedWith": "connectedWith"; }, {}, never>;
 }

package/{dist/es2015 → esm2015}/data-binding.directive.js

@@ -2,16 +2,16 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
 import { Directive, Input } from '@angular/core';
 import { isChanged } from '@progress/kendo-angular-common';
 import { Subscription } from 'rxjs';
-import { ListBoxComponent } from './listbox.component';
 import { isPresent } from './util';
+import * as i0 from "@angular/core";
+import * as i1 from "./listbox.component";
 /**
  * A directive which manages the functoinality of the ListBox tools out of the box, and modifies the provided data accordingly.
  */
-let DataBindingDirective = class DataBindingDirective {
+export class DataBindingDirective {
     constructor(listbox) {
         this.listbox = listbox;
         /**
@@ -122,19 +122,17 @@ let DataBindingDirective = class DataBindingDirective {
         target.selectItem(target.data.length - 1);
         this.selectedBox = target;
     }
-};
-tslib_1.__decorate([
-    Input('kendoListBoxDataBinding'),
-    tslib_1.__metadata("design:type", Array)
-], DataBindingDirective.prototype, "data", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", ListBoxComponent)
-], DataBindingDirective.prototype, "connectedWith", void 0);
-DataBindingDirective = tslib_1.__decorate([
-    Directive({
-        selector: '[kendoListBoxDataBinding]'
-    }),
-    tslib_1.__metadata("design:paramtypes", [ListBoxComponent])
-], DataBindingDirective);
-export { DataBindingDirective };
+}
+DataBindingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DataBindingDirective, deps: [{ token: i1.ListBoxComponent }], target: i0.ɵɵFactoryTarget.Directive });
+DataBindingDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: DataBindingDirective, selector: "[kendoListBoxDataBinding]", inputs: { data: ["kendoListBoxDataBinding", "data"], connectedWith: "connectedWith" }, usesOnChanges: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DataBindingDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kendoListBoxDataBinding]'
+                }]
+        }], ctorParameters: function () { return [{ type: i1.ListBoxComponent }]; }, propDecorators: { data: [{
+                type: Input,
+                args: ['kendoListBoxDataBinding']
+            }], connectedWith: [{
+                type: Input
+            }] } });

package/esm2015/item-selectable.directive.js

@@ -0,0 +1,38 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Directive, Input, HostBinding, HostListener } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "./selection.service";
+/**
+ * @hidden
+ */
+export class ItemSelectableDirective {
+    constructor(selectionService) {
+        this.selectionService = selectionService;
+    }
+    get selectedClassName() {
+        return this.selectionService.isSelected(this.index);
+    }
+    onClick(event) {
+        event.stopPropagation();
+        this.selectionService.select(this.index);
+    }
+}
+ItemSelectableDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ItemSelectableDirective, deps: [{ token: i1.ListBoxSelectionService }], target: i0.ɵɵFactoryTarget.Directive });
+ItemSelectableDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: ItemSelectableDirective, selector: "[kendoListBoxItemSelectable]", inputs: { index: "index" }, host: { listeners: { "click": "onClick($event)" }, properties: { "class.k-selected": "this.selectedClassName" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ItemSelectableDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kendoListBoxItemSelectable]'
+                }]
+        }], ctorParameters: function () { return [{ type: i1.ListBoxSelectionService }]; }, propDecorators: { index: [{
+                type: Input
+            }], selectedClassName: [{
+                type: HostBinding,
+                args: ['class.k-selected']
+            }], onClick: [{
+                type: HostListener,
+                args: ['click', ['$event']]
+            }] } });

package/{dist/es2015 → esm2015}/item-template.directive.js

@@ -2,8 +2,8 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
-import { Directive, TemplateRef } from '@angular/core';
+import { Directive } from '@angular/core';
+import * as i0 from "@angular/core";
 /**
  * Renders the ListBox item content. To define the item template, nest an `<ng-template>` tag
  * with the `kendoListBoxItemTemplate` directive inside the `<kendo-listbox>` tag. The template context is
@@ -23,15 +23,16 @@ import { Directive, TemplateRef } from '@angular/core';
  * })
  * ```
  */
-let ItemTemplateDirective = class ItemTemplateDirective {
+export class ItemTemplateDirective {
     constructor(templateRef) {
         this.templateRef = templateRef;
     }
-};
-ItemTemplateDirective = tslib_1.__decorate([
-    Directive({
-        selector: '[kendoListBoxItemTemplate]'
-    }),
-    tslib_1.__metadata("design:paramtypes", [TemplateRef])
-], ItemTemplateDirective);
-export { ItemTemplateDirective };
+}
+ItemTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+ItemTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: ItemTemplateDirective, selector: "[kendoListBoxItemTemplate]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ItemTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kendoListBoxItemTemplate]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });

package/{dist/es/size.js → esm2015/kendo-angular-listbox.js}

@@ -2,3 +2,7 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './main';

package/{dist/es2015 → esm2015}/listbox.component.js

@@ -2,8 +2,7 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
-import { Component, ContentChild, ElementRef, EventEmitter, HostBinding, Input, isDevMode, Output, Renderer2 } from '@angular/core';
+import { Component, ContentChild, EventEmitter, HostBinding, Input, isDevMode, Output } from '@angular/core';
 import { validatePackage } from '@progress/kendo-licensing';
 import { Subscription } from 'rxjs';
 import { packageMetadata } from './package-metadata';
@@ -11,10 +10,15 @@ import { ListBoxSelectionService } from './selection.service';
 import { ItemTemplateDirective } from './item-template.directive';
 import { defaultItemDisabled, fieldAccessor, getTools } from './util';
 import { allTools, DEFAULT_TOOLBAR_POSITION, sizeClassMap, toolbarClasses } from './constants';
+import * as i0 from "@angular/core";
+import * as i1 from "./selection.service";
+import * as i2 from "@angular/common";
+import * as i3 from "@progress/kendo-angular-buttons";
+import * as i4 from "./item-selectable.directive";
 /**
  * Represents the [Kendo UI ListBox component for Angular]({% slug overview_listbox %}).
  */
-let ListBoxComponent = class ListBoxComponent {
+export class ListBoxComponent {
     constructor(selectionService, renderer, hostElement) {
         this.selectionService = selectionService;
         this.renderer = renderer;
@@ -130,49 +134,50 @@ let ListBoxComponent = class ListBoxComponent {
             }
         });
     }
-};
-tslib_1.__decorate([
-    HostBinding('class.k-listbox'),
-    tslib_1.__metadata("design:type", Boolean)
-], ListBoxComponent.prototype, "listboxClassName", void 0);
-tslib_1.__decorate([
-    ContentChild(ItemTemplateDirective, { static: false }),
-    tslib_1.__metadata("design:type", ItemTemplateDirective)
-], ListBoxComponent.prototype, "itemTemplate", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String)
-], ListBoxComponent.prototype, "textField", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Array)
-], ListBoxComponent.prototype, "data", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String)
-], ListBoxComponent.prototype, "size", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Object),
-    tslib_1.__metadata("design:paramtypes", [Object])
-], ListBoxComponent.prototype, "toolbar", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Function)
-], ListBoxComponent.prototype, "itemDisabled", void 0);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], ListBoxComponent.prototype, "selectionChange", void 0);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], ListBoxComponent.prototype, "actionClick", void 0);
-ListBoxComponent = tslib_1.__decorate([
-    Component({
-        selector: 'kendo-listbox',
-        providers: [ListBoxSelectionService],
-        template: `
+}
+ListBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ListBoxComponent, deps: [{ token: i1.ListBoxSelectionService }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+ListBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ListBoxComponent, selector: "kendo-listbox", inputs: { textField: "textField", data: "data", size: "size", toolbar: "toolbar", itemDisabled: "itemDisabled" }, outputs: { selectionChange: "selectionChange", actionClick: "actionClick" }, host: { properties: { "class.k-listbox": "this.listboxClassName" } }, providers: [ListBoxSelectionService], queries: [{ propertyName: "itemTemplate", first: true, predicate: ItemTemplateDirective, descendants: true }], ngImport: i0, template: `
+            <div class="k-listbox-toolbar" *ngIf="selectedTools.length > 0">
+                <ul class="k-reset">
+                    <li *ngFor="let tool of selectedTools">
+                        <button kendoButton [icon]="tool.icon" (click)="performAction(tool.name)"></button>
+                    </li>
+
+                    <!-- react moving items has a smoother removal of the style: https://www.telerik.com/kendo-react-ui/components/listbox/ -->
+                </ul>
+            </div>
+            <div class="k-list-scroller k-selectable">
+                <div class="{{ listClasses }}">
+                    <div class="k-list-content">
+                        <ul class="k-list-ul">
+                            <li
+                                class="k-list-item"
+                                *ngFor="let item of data; let i = index;"
+                                kendoListBoxItemSelectable
+                                [index]="i"
+                                [class.k-disabled]="itemDisabled(item)"
+                            >
+                                <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>
+                                </ng-template>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+    `, isInline: true, directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { type: i4.ItemSelectableDirective, selector: "[kendoListBoxItemSelectable]", inputs: ["index"] }, { type: i3.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ListBoxComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kendo-listbox',
+                    providers: [ListBoxSelectionService],
+                    template: `
             <div class="k-listbox-toolbar" *ngIf="selectedTools.length > 0">
                 <ul class="k-reset">
                     <li *ngFor="let tool of selectedTools">
@@ -208,9 +213,25 @@ ListBoxComponent = tslib_1.__decorate([
                 </div>
             </div>
     `
-    }),
-    tslib_1.__metadata("design:paramtypes", [ListBoxSelectionService,
-        Renderer2,
-        ElementRef])
-], ListBoxComponent);
-export { ListBoxComponent };
+                }]
+        }], ctorParameters: function () { return [{ type: i1.ListBoxSelectionService }, { type: i0.Renderer2 }, { type: i0.ElementRef }]; }, propDecorators: { listboxClassName: [{
+                type: HostBinding,
+                args: ['class.k-listbox']
+            }], itemTemplate: [{
+                type: ContentChild,
+                args: [ItemTemplateDirective, { static: false }]
+            }], textField: [{
+                type: Input
+            }], data: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], toolbar: [{
+                type: Input
+            }], itemDisabled: [{
+                type: Input
+            }], selectionChange: [{
+                type: Output
+            }], actionClick: [{
+                type: Output
+            }] } });

package/esm2015/listbox.module.js

@@ -0,0 +1,28 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { NgModule } from '@angular/core';
+import { ListBoxComponent } from './listbox.component';
+import { ButtonsModule } from '@progress/kendo-angular-buttons';
+import { CommonModule } from '@angular/common';
+import { ItemTemplateDirective } from './item-template.directive';
+import { ItemSelectableDirective } from './item-selectable.directive';
+import { DataBindingDirective } from './data-binding.directive';
+import * as i0 from "@angular/core";
+/**
+ * Represents the [NgModule](https://angular.io/api/core/NgModule) definition for the ListBox component.
+ */
+export class ListBoxModule {
+}
+ListBoxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ListBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ListBoxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ListBoxModule, declarations: [ListBoxComponent, ItemTemplateDirective, ItemSelectableDirective, DataBindingDirective], imports: [ButtonsModule, CommonModule], exports: [ListBoxComponent, ItemTemplateDirective, ItemSelectableDirective, DataBindingDirective] });
+ListBoxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ListBoxModule, imports: [[ButtonsModule, CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ListBoxModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [ButtonsModule, CommonModule],
+                    declarations: [ListBoxComponent, ItemTemplateDirective, ItemSelectableDirective, DataBindingDirective],
+                    exports: [ListBoxComponent, ItemTemplateDirective, ItemSelectableDirective, DataBindingDirective]
+                }]
+        }] });

package/{dist/es2015 → esm2015}/main.js

@@ -3,5 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 export { ListBoxComponent } from './listbox.component';
-export { DataBindingDirective } from './data-binding.directive';
 export { ListBoxModule } from './listbox.module';
+export { DataBindingDirective } from './data-binding.directive';
+export { ItemTemplateDirective } from './item-template.directive';
+export { ItemSelectableDirective } from './item-selectable.directive';

package/{dist/es2015 → esm2015}/package-metadata.js

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-listbox',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1649860877,
+    publishDate: 1649934053,
     version: '',
     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'
 };

package/{dist/es2015 → esm2015}/selection.service.js

@@ -2,15 +2,12 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
 import { EventEmitter, Injectable } from "@angular/core";
+import * as i0 from "@angular/core";
 /**
  * @hidden
  */
-let ListBoxSelectionService = class ListBoxSelectionService {
-    /**
-     * @hidden
-     */
+export class ListBoxSelectionService {
     constructor() {
         this.onSelect = new EventEmitter();
         this.selectedIndex = null;
@@ -25,8 +22,9 @@ let ListBoxSelectionService = class ListBoxSelectionService {
     clearSelection() {
         this.selectedIndex = null;
     }
-};
-ListBoxSelectionService = tslib_1.__decorate([
-    Injectable()
-], ListBoxSelectionService);
-export { ListBoxSelectionService };
+}
+ListBoxSelectionService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ListBoxSelectionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ListBoxSelectionService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ListBoxSelectionService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ListBoxSelectionService, decorators: [{
+            type: Injectable
+        }] });

package/{dist/es2015 → esm2015}/size.js

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

package/{dist/es2015 → esm2015}/toolbar.js

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