@progress/kendo-angular-sortable 17.0.0-develop.4 → 17.0.0-develop.40

package/{fesm2015 → fesm2022}/progress-kendo-angular-sortable.mjs

@@ -188,19 +188,244 @@ const packageMetadata = {
     name: '@progress/kendo-angular-sortable',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1728985416,
-    version: '17.0.0-develop.4',
+    publishDate: 1730799112,
+    version: '17.0.0-develop.40',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
+const allowDrag = (e) => {
+    const target = e.originalEvent.target;
+    return target.hasAttribute('data-sortable-item') || !(isFocusable(target) || widgetTarget(target));
+};
+/**
+ * The service that provides the drag-and-drop functionality for
+ * transferring items between Sortable components within the same page.
+ *
+ */
+class SortableService {
+    ngZone;
+    /**
+     * Specifies the Draggable item that is currently being moved.
+     */
+    activeDraggable = null;
+    /**
+     * Specifies the Draggable item from which the dragging started.
+     */
+    originDraggable = null;
+    /**
+     * @hidden
+     */
+    originIndex;
+    /**
+     * @hidden
+     */
+    targetSortable = null;
+    /**
+     * Specifies the Draggable item that last emitted an event.
+     */
+    lastDraggable = null;
+    /**
+     * @hidden
+     */
+    onPressSubject = new Subject();
+    /**
+     * @hidden
+     */
+    onDragSubject = new Subject();
+    /**
+     * @hidden
+     */
+    onReleaseSubject = new Subject();
+    subscriptions;
+    source = null;
+    _target = null;
+    sortableCounter = 0;
+    sortableRegister = {};
+    pressArgs;
+    /**
+     * Specifies the `SortableComponent` instance under the currently dragged item.
+     */
+    set target(target) {
+        this._target = target;
+    }
+    get target() {
+        return this._target;
+    }
+    constructor(ngZone) {
+        this.ngZone = ngZone;
+        if (!isDocumentAvailable()) {
+            return;
+        }
+        this.subscriptions = this.onPressSubject.pipe(filter(allowDrag), tap(press => {
+            this.targetSortable = this.getSortableComponentFromTouch(press);
+        }), filter(_ => Boolean(this.targetSortable)), tap(press => {
+            this.onReleaseSubject.pipe(take(1)).subscribe(event => this.release(event));
+            this.pressArgs = press;
+            if (press.isTouch) {
+                press.originalEvent.preventDefault();
+            }
+        }), switchMap(_drag => this.onDragSubject.pipe(filter(_ => Boolean(this.targetSortable)), //stop further events if dragStart is prevented
+        tap((e) => this.drag(e))))).subscribe();
+    }
+    /**
+     * @hidden
+     */
+    onPress(e) {
+        this.onPressSubject.next(e);
+    }
+    /**
+     * @hidden
+     */
+    onDrag(e) {
+        this.onDragSubject.next(e);
+    }
+    /**
+     * @hidden
+     */
+    onRelease(e) {
+        this.onReleaseSubject.next(e);
+    }
+    /**
+     * @hidden
+     */
+    ngOnDestroy() {
+        if (this.subscriptions) {
+            this.subscriptions.unsubscribe();
+        }
+    }
+    /**
+     * Registers a `SortableComponent` with which the service operates.
+     *
+     * @param sortableComponent - The `SortableComponent`.
+     * @return - The unique key that the current `SortableComponent` gets when registered.
+     */
+    registerComponent(sortableComponent) {
+        const id = this.sortableCounter.toString();
+        this.sortableRegister[id] = sortableComponent;
+        this.sortableCounter++;
+        return id;
+    }
+    /**
+     * Removes a `SortableComponent` from the registered `SortableComponents` with which the service operates.
+     *
+     * @param key - The key of the `SortableComponent` which will be removed from the register.
+     * Obtained when `registerComponent` is called.
+     */
+    unregisterComponent(key) {
+        this.sortableRegister[key] = null;
+    }
+    /**
+     * Sets the `SortableComponent` as a source component. When dragging an item from one Sortable to another,
+     * the source component is the one from which the item originates.
+     *
+     * @param sortable - The `SortableComponent`.
+     */
+    setSource(sortable) {
+        this.source = sortable;
+    }
+    /**
+     * Returns the source `SortableComponent` from which
+     * an item is dragged to other Sortable components.
+     *
+     * @return - The `SourceComponent`.
+     */
+    getSource() {
+        return this.source;
+    }
+    /**
+     * The method that finds the `SortableComponent` which is registered to
+     * the `SortableService` by using the arguments of the `touch` event.
+     *
+     * @param touch - A Touch-Object of the `Touch` type interface.
+     * Represents a single contact point (finger or stylus)
+     * on a touch-sensitive device (touchscreen or trackpad).
+     *
+     * @return { component: SortableComponent, index: number } - An object
+     * where the component is the `SortableComponent` that owns the item
+     * and the index is the index of the touched item.
+     */
+    getSortableComponentFromTouch(touch) {
+        if (!isDocumentAvailable()) {
+            return { component: undefined, index: undefined };
+        }
+        let realTarget = document.elementFromPoint(touch.clientX, touch.clientY);
+        while (realTarget) {
+            const id = realTarget.getAttribute('data-sortable-id');
+            const index = realTarget.getAttribute('data-sortable-index');
+            if (id) {
+                const targetSortable = this.sortableRegister[id];
+                if (targetSortable) {
+                    return { component: targetSortable, index: parseInt(index, 10) };
+                }
+            }
+            realTarget = realTarget.parentElement;
+        }
+    }
+    start() {
+        const pressArgs = this.pressArgs;
+        if (pressArgs) {
+            this.pressArgs = null;
+            const startTarget = draggableFromEvent(pressArgs, this.targetSortable.component);
+            if (this.targetSortable.component.startDrag({ target: startTarget, originalEvent: pressArgs })) {
+                this.targetSortable = null;
+                return true;
+            }
+        }
+    }
+    release(event) {
+        if (this.source) {
+            this.ngZone.run(() => {
+                if (this.targetSortable) {
+                    const dropTarget = draggableFromEvent(event, this.targetSortable.component);
+                    this.source.endDrag({ target: dropTarget, originalEvent: event });
+                }
+                this.source.positionHintFromEvent(null);
+                this.source.markForCheck();
+            });
+        }
+        this.targetSortable = null;
+        this.pressArgs = null;
+    }
+    drag(event) {
+        this.ngZone.run(() => {
+            if (this.start()) {
+                return;
+            }
+            this.source.positionHintFromEvent(event);
+            const sortable = this.getSortableComponentFromTouch(event);
+            if (!sortable || sortable && sortable.component !== this.target) {
+                if (this.target) {
+                    this.target.leave({ target: undefined, originalEvent: event });
+                }
+                else if (this.source !== this.target) {
+                    this.source.leave({ target: undefined, originalEvent: event });
+                }
+            }
+            if (sortable && sortable.component) {
+                const draggable = draggableFromEvent(event, sortable.component);
+                sortable.component.drag({ target: draggable, originalEvent: event });
+            }
+            this.source.markForCheck();
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.NgZone }]; } });
+
 /**
  * @hidden
  */
 class SortableContainer {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableContainer, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableContainer });
 }
-SortableContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableContainer, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-SortableContainer.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableContainer });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableContainer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableContainer, decorators: [{
             type: Injectable
         }] });
 
@@ -208,11 +433,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * @hidden
  */
 class DraggableDirective {
-    constructor(parent, el, renderer) {
-        this.parent = parent;
-        this.el = el;
-        this.renderer = renderer;
-    }
+    parent;
+    el;
+    renderer;
+    index;
+    disabled;
     set hidden(value) {
         this._hidden = value;
         this.updateDisplayStyle();
@@ -220,6 +445,7 @@ class DraggableDirective {
     get hidden() {
         return this._hidden;
     }
+    _hidden;
     get _focused() {
         return this.disabled ? false : (this.index === this.parent.activeIndex);
     }
@@ -233,6 +459,12 @@ class DraggableDirective {
         this._display = display;
         this.updateDisplayStyle();
     }
+    _display;
+    constructor(parent, el, renderer) {
+        this.parent = parent;
+        this.el = el;
+        this.renderer = renderer;
+    }
     ngOnInit() {
         const nativeElement = this.el.nativeElement;
         this.display = nativeElement.style.display;
@@ -246,10 +478,10 @@ class DraggableDirective {
     updateDisplayStyle() {
         this.renderer.setStyle(this.el.nativeElement, 'display', this.display);
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DraggableDirective, deps: [{ token: SortableContainer }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: DraggableDirective, isStandalone: true, selector: "[kendoDraggable]", inputs: { index: "index", disabled: "disabled", hidden: "hidden" }, host: { properties: { "class.k-focus": "this._focused", "attr.aria-disabled": "this._disabled" } }, ngImport: i0 });
 }
-DraggableDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableDirective, deps: [{ token: SortableContainer }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
-DraggableDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: DraggableDirective, isStandalone: true, selector: "[kendoDraggable]", inputs: { index: "index", disabled: "disabled", hidden: "hidden" }, host: { properties: { "class.k-focus": "this._focused", "attr.aria-disabled": "this._disabled" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DraggableDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoDraggable]',
@@ -274,13 +506,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * @hidden
  */
 class ItemTemplateDirective {
+    templateRef;
     constructor(templateRef) {
         this.templateRef = templateRef;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ItemTemplateDirective, isStandalone: true, selector: "[kendoSortableItemTemplate]", ngImport: i0 });
 }
-ItemTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-ItemTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: ItemTemplateDirective, isStandalone: true, selector: "[kendoSortableItemTemplate]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ItemTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ItemTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoSortableItemTemplate]',
@@ -291,13 +524,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * @hidden
  */
 class PlaceholderTemplateDirective {
+    templateRef;
     constructor(templateRef) {
         this.templateRef = templateRef;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: PlaceholderTemplateDirective, isStandalone: true, selector: "[kendoSortablePlaceholderTemplate]", ngImport: i0 });
 }
-PlaceholderTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-PlaceholderTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: PlaceholderTemplateDirective, isStandalone: true, selector: "[kendoSortablePlaceholderTemplate]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PlaceholderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PlaceholderTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoSortablePlaceholderTemplate]',
@@ -312,9 +546,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * @hidden
  */
 class PreventableEvent {
-    constructor() {
-        this.prevented = false;
-    }
+    prevented = false;
     /**
      * Prevents the default action for a specified event.
      * In this way, the source component suppresses
@@ -339,282 +571,78 @@ class PreventableEvent {
  */
 class NavigateEvent extends PreventableEvent {
     /**
-     * @hidden
-     */
-    constructor(options) {
-        super();
-        Object.assign(this, options);
-    }
-}
-
-/**
- * The arguments for the `DraggableDirective` events.
- * @hidden
- */
-class DraggableEvent extends PreventableEvent {
-    /**
-     * @hidden
+     * The index of the draggable item.
      */
-    constructor(options) {
-        super();
-        Object.assign(this, options);
-    }
-}
-
-/**
- * Arguments for the `dragStart` event.
- */
-class DragStartEvent extends PreventableEvent {
+    index;
     /**
-     * @hidden
+     * The old index of the draggable item.
      */
-    constructor(options) {
-        super();
-        Object.assign(this, options);
-    }
-}
-/**
- * Arguments for the `dragOver` event.
- */
-class DragOverEvent extends DragStartEvent {
+    oldIndex;
     /**
-     * @hidden
+     * Indicates whether the ctrl or meta keys are pressed.
      */
-    constructor(options) {
-        super(options);
-        Object.assign(this, options);
-    }
-}
-/**
- * Arguments for the `dragEnd` event.
- */
-class DragEndEvent extends DragOverEvent {
+    ctrlKey;
     /**
      * @hidden
      */
     constructor(options) {
-        super(options);
+        super();
         Object.assign(this, options);
     }
 }
 
-const allowDrag = (e) => {
-    const target = e.originalEvent.target;
-    return target.hasAttribute('data-sortable-item') || !(isFocusable(target) || widgetTarget(target));
-};
 /**
- * The service that provides the drag-and-drop functionality for
- * transferring items between Sortable components within the same page.
- *
+ * The arguments for the `DraggableDirective` events.
+ * @hidden
  */
-class SortableService {
-    constructor(ngZone) {
-        this.ngZone = ngZone;
-        /**
-         * Specifies the Draggable item that is currently being moved.
-         */
-        this.activeDraggable = null;
-        /**
-         * Specifies the Draggable item from which the dragging started.
-         */
-        this.originDraggable = null;
-        /**
-         * @hidden
-         */
-        this.targetSortable = null;
-        /**
-         * Specifies the Draggable item that last emitted an event.
-         */
-        this.lastDraggable = null;
-        /**
-         * @hidden
-         */
-        this.onPressSubject = new Subject();
-        /**
-         * @hidden
-         */
-        this.onDragSubject = new Subject();
-        /**
-         * @hidden
-         */
-        this.onReleaseSubject = new Subject();
-        this.source = null;
-        this._target = null;
-        this.sortableCounter = 0;
-        this.sortableRegister = {};
-        if (!isDocumentAvailable()) {
-            return;
-        }
-        this.subscriptions = this.onPressSubject.pipe(filter(allowDrag), tap(press => {
-            this.targetSortable = this.getSortableComponentFromTouch(press);
-        }), filter(_ => Boolean(this.targetSortable)), tap(press => {
-            this.onReleaseSubject.pipe(take(1)).subscribe(event => this.release(event));
-            this.pressArgs = press;
-            if (press.isTouch) {
-                press.originalEvent.preventDefault();
-            }
-        }), switchMap(_drag => this.onDragSubject.pipe(filter(_ => Boolean(this.targetSortable)), //stop further events if dragStart is prevented
-        tap((e) => this.drag(e))))).subscribe();
-    }
-    /**
-     * Specifies the `SortableComponent` instance under the currently dragged item.
-     */
-    set target(target) {
-        this._target = target;
-    }
-    get target() {
-        return this._target;
-    }
-    /**
-     * @hidden
-     */
-    onPress(e) {
-        this.onPressSubject.next(e);
-    }
-    /**
-     * @hidden
-     */
-    onDrag(e) {
-        this.onDragSubject.next(e);
-    }
-    /**
-     * @hidden
-     */
-    onRelease(e) {
-        this.onReleaseSubject.next(e);
-    }
+class DraggableEvent extends PreventableEvent {
     /**
-     * @hidden
+     * The target DraggableDirective instance.
      */
-    ngOnDestroy() {
-        if (this.subscriptions) {
-            this.subscriptions.unsubscribe();
-        }
-    }
+    target;
     /**
-     * Registers a `SortableComponent` with which the service operates.
-     *
-     * @param sortableComponent - The `SortableComponent`.
-     * @return - The unique key that the current `SortableComponent` gets when registered.
+     * The browser event emitted by the target's native element.
      */
-    registerComponent(sortableComponent) {
-        const id = this.sortableCounter.toString();
-        this.sortableRegister[id] = sortableComponent;
-        this.sortableCounter++;
-        return id;
-    }
+    originalEvent; //DragEvent | TouchEvent;
     /**
-     * Removes a `SortableComponent` from the registered `SortableComponents` with which the service operates.
-     *
-     * @param key - The key of the `SortableComponent` which will be removed from the register.
-     * Obtained when `registerComponent` is called.
+     * @hidden
      */
-    unregisterComponent(key) {
-        this.sortableRegister[key] = null;
+    constructor(options) {
+        super();
+        Object.assign(this, options);
     }
+}
+
+/**
+ * Arguments for the `dragStart` event.
+ */
+class DragStartEvent extends PreventableEvent {
     /**
-     * Sets the `SortableComponent` as a source component. When dragging an item from one Sortable to another,
-     * the source component is the one from which the item originates.
-     *
-     * @param sortable - The `SortableComponent`.
+     * The index of the draggable item.
      */
-    setSource(sortable) {
-        this.source = sortable;
-    }
+    index;
     /**
-     * Returns the source `SortableComponent` from which
-     * an item is dragged to other Sortable components.
-     *
-     * @return - The `SourceComponent`.
+     * The old index of the draggable item.
      */
-    getSource() {
-        return this.source;
-    }
+    oldIndex;
     /**
-     * The method that finds the `SortableComponent` which is registered to
-     * the `SortableService` by using the arguments of the `touch` event.
-     *
-     * @param touch - A Touch-Object of the `Touch` type interface.
-     * Represents a single contact point (finger or stylus)
-     * on a touch-sensitive device (touchscreen or trackpad).
-     *
-     * @return { component: SortableComponent, index: number } - An object
-     * where the component is the `SortableComponent` that owns the item
-     * and the index is the index of the touched item.
+     * @hidden
      */
-    getSortableComponentFromTouch(touch) {
-        if (!isDocumentAvailable()) {
-            return { component: undefined, index: undefined };
-        }
-        let realTarget = document.elementFromPoint(touch.clientX, touch.clientY);
-        while (realTarget) {
-            const id = realTarget.getAttribute('data-sortable-id');
-            const index = realTarget.getAttribute('data-sortable-index');
-            if (id) {
-                const targetSortable = this.sortableRegister[id];
-                if (targetSortable) {
-                    return { component: targetSortable, index: parseInt(index, 10) };
-                }
-            }
-            realTarget = realTarget.parentElement;
-        }
-    }
-    start() {
-        const pressArgs = this.pressArgs;
-        if (pressArgs) {
-            this.pressArgs = null;
-            const startTarget = draggableFromEvent(pressArgs, this.targetSortable.component);
-            if (this.targetSortable.component.startDrag({ target: startTarget, originalEvent: pressArgs })) {
-                this.targetSortable = null;
-                return true;
-            }
-        }
-    }
-    release(event) {
-        if (this.source) {
-            this.ngZone.run(() => {
-                if (this.targetSortable) {
-                    const dropTarget = draggableFromEvent(event, this.targetSortable.component);
-                    this.source.endDrag({ target: dropTarget, originalEvent: event });
-                }
-                this.source.positionHintFromEvent(null);
-                this.source.markForCheck();
-            });
-        }
-        this.targetSortable = null;
-        this.pressArgs = null;
-    }
-    drag(event) {
-        this.ngZone.run(() => {
-            if (this.start()) {
-                return;
-            }
-            this.source.positionHintFromEvent(event);
-            const sortable = this.getSortableComponentFromTouch(event);
-            if (!sortable || sortable && sortable.component !== this.target) {
-                if (this.target) {
-                    this.target.leave({ target: undefined, originalEvent: event });
-                }
-                else if (this.source !== this.target) {
-                    this.source.leave({ target: undefined, originalEvent: event });
-                }
-            }
-            if (sortable && sortable.component) {
-                const draggable = draggableFromEvent(event, sortable.component);
-                sortable.component.drag({ target: draggable, originalEvent: event });
-            }
-            this.source.markForCheck();
-        });
+    constructor(options) {
+        super();
+        Object.assign(this, options);
     }
 }
-SortableService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
-SortableService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: function () { return [{ type: i0.NgZone }]; } });
+/**
+ * Arguments for the `dragOver` event.
+ */
+class DragOverEvent extends DragStartEvent {
+}
+/**
+ * Arguments for the `dragEnd` event.
+ */
+class DragEndEvent extends DragOverEvent {
+}
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
 const KEY_SHORTCUTS = 'Control+ArrowLeft Control+ArrowRight Meta+ArrowLeft Meta+ArrowRight';
@@ -631,213 +659,14 @@ const KEY_SHORTCUTS = 'Control+ArrowLeft Control+ArrowRight Meta+ArrowLeft Meta+
  * Represents the Kendo UI Sortable component for Angular.
  */
 class SortableComponent {
-    constructor(ngZone, renderer, changeDetector, localization, wrapper, sortableService) {
-        this.ngZone = ngZone;
-        this.renderer = renderer;
-        this.changeDetector = changeDetector;
-        this.localization = localization;
-        /**
-         * Specifies the tab index of the Sortable component.
-         */
-        this.tabIndex = null;
-        /**
-         * Enables or disables the [keyboard navigation]({% slug keyboard_navigation_sortable %}).
-         * @default false
-         */
-        this.navigable = false;
-        /**
-         * Enables or disables the built-in animations.
-         * @default false
-         */
-        this.animation = false;
-        /**
-         * Sets an array of integers, which represent the indexes of the disabled items from the data array
-         * ([see example](slug:items_sortable#toc-disabling-items)).
-         */
-        this.disabledIndexes = [];
-        /**
-         * Sets a string that represents the name of the zone to which the Sortable belongs
-         * ([see example](slug:items_sortable#toc-transferring-of-items)). Items can be transferred
-         * between Sortables which belong to the same zone.
-         */
-        this.zone = undefined;
-        /**
-         * Defines the zones from which items can be transferred onto the current Sortable component
-         * ([see example](slug:items_sortable#toc-transferring-of-items)). If the `acceptZones` property
-         * of the target Sortable is set, allows you to transfer items between Sortables which belong
-         * to different zones.
-         */
-        this.acceptZones = undefined;
-        /**
-         * Represents the CSS styles which are applied to each Sortable item.
-         *
-         * @example
-         * ```ts
-         * import { Component } from '@angular/core';
-         * import { SortableModule } from '@progress/kendo-angular-sortable';
-         *
-         * _@Component({
-         *  selector: 'my-app',
-         *  template: `
-         *   <kendo-sortable
-         *      [data]="['1','2','3','4','5','6','7']"
-         *      [itemStyle] ="{
-         *          'display': 'inline-block',
-         *          'background-color': '#51A0ED',
-         *          'height':'50px',
-         *          'width':'50px',
-         *          'margin':'3px',
-         *          'cursor':'move'
-         *          }"
-         *      >
-         *   </kendo-sortable>
-         *    `
-         * })
-         * export class AppComponent {
-         * }
-         * ```
-         */
-        this.itemStyle = {};
-        /**
-         * Defines the CSS styles applied to an empty item ([see example]({% slug templates_sortable %})).
-         */
-        this.emptyItemStyle = undefined;
-        /**
-         * Defines the CSS styles which are applied to the currently dragged item ([see example]({% slug templates_sortable %})).
-         */
-        this.activeItemStyle = undefined;
-        /**
-         * Defines the CSS styles which are applied to all disabled items.
-         */
-        this.disabledItemStyle = undefined;
-        /**
-         * Defines the class which is applied to each Sortable item.
-         */
-        this.itemClass = "";
-        /**
-         * Defines the class which is applied to the active Sortable item.
-         */
-        this.activeItemClass = null;
-        /**
-         * Defines the class which is applied to the empty item when the Sortable has empty data.
-         */
-        this.emptyItemClass = null;
-        /**
-         * Defines the class which is applied to each disabled Sortable item.
-         */
-        this.disabledItemClass = null;
-        /**
-         * Sets the text message that will be displayed when the Sortable has no items.
-         *
-         * @example
-         * ```ts
-         * import { Component } from '@angular/core';
-         * import { SortableModule } from '@progress/kendo-angular-sortable';
-         *
-         * _@Component({
-         *  selector: 'my-app',
-         *  template: `
-         *    <kendo-sortable [data]="[]"
-         *      [emptyText]="'No items - custom message and styles'"
-         *      [emptyItemStyle] = "{'height': '40px', 'width':'400px', 'border': '2px dashed black'}" >
-         *    </kendo-sortable>
-         *    `
-         * })
-         * export class AppComponent { }
-         * ```
-         */
-        this.emptyText = "Empty";
-        /**
-         * @hidden
-         */
-        this.defaultTemplateRef = null;
-        /**
-         * Defines the template that will be used for rendering the items.
-         * @hidden
-         */
-        this.itemTemplateDirectiveRef = null;
-        /**
-         * Defines the template that will be used for rendering the placeholder.
-         * @hidden
-         */
-        this.placeholderTemplateDirectiveRef = null;
-        this.itemWrappers = new QueryList();
-        /**
-         * Fires when the dragging of an item is started.
-         */
-        this.dragStart = new EventEmitter();
-        /**
-         * Fires when the dragging of an item is completed.
-         */
-        this.dragEnd = new EventEmitter();
-        /**
-         * Fires while the dragging of an item is in progress.
-         */
-        this.dragOver = new EventEmitter();
-        /**
-         * Fires when dragging an item outside of the component.
-         */
-        this.dragLeave = new EventEmitter();
-        /**
-         * Fires while the moving an item from one position to another.
-         */
-        this.dataMove = new EventEmitter();
-        /**
-         * Fires when a new item is added to the Sortable.
-         */
-        this.dataAdd = new EventEmitter();
-        /**
-         * Fires when an item is removed from the Sortable.
-         */
-        this.dataRemove = new EventEmitter();
-        /**
-         * Fires when navigating using the keyboard.
-         */
-        this.navigate = new EventEmitter();
-        /**
-         * The index of the currently focused item.
-         * If no item is focused, set to `-1`.
-         */
-        this.activeIndex = -1;
-        this.hostRole = 'list';
-        /**
-         * Flag indicating if the component is currently playing animations.
-         * @hidden
-         */
-        this.animating = false;
-        /**
-         * The index of the currently dragged item.
-         */
-        this.dragIndex = -1;
-        /**
-         * The index of the item above which the dragged item is.
-         */
-        this.dragOverIndex = -1;
-        this.onDragStartSubject = new Subject();
-        this.onDragOverSubject = new Subject();
-        this.onDragLeaveSubject = new Subject();
-        this.onDragEndSubject = new Subject();
-        /**
-         * The location of the hint indicator when dragging on mobile devices.
-         */
-        this.hintLocation = null;
-        this._localData = [];
-        /**
-         * @hidden
-         */
-        this.ariaKeyShortcuts = KEY_SHORTCUTS;
-        this.focusableItems = [];
-        this.animationDuration = 300;
-        this.afterKeyPress = false;
-        this.sortableService = null;
-        this._hideActiveItem = false;
-        this.prevActiveIndex = 0;
-        validatePackage(packageMetadata);
-        this.wrapper = wrapper.nativeElement;
-        this.direction = localization.rtl ? 'rtl' : 'ltr';
-        this.sortableService = sortableService;
-        this.subscribeEvents();
-    }
+    ngZone;
+    renderer;
+    changeDetector;
+    localization;
+    /**
+     * Specifies the tab index of the Sortable component.
+     */
+    tabIndex = null;
     /**
      * Sets an array of any data that is used as a data source for the Sortable.
      * {% meta height:430 %}
@@ -856,6 +685,11 @@ class SortableComponent {
     get data() {
         return this._data;
     }
+    /**
+     * Enables or disables the [keyboard navigation]({% slug keyboard_navigation_sortable %}).
+     * @default false
+     */
+    navigable = false;
     /**
      * @hidden
      *
@@ -864,12 +698,220 @@ class SortableComponent {
     set navigatable(value) {
         this.navigable = value;
     }
+    /**
+     * Enables or disables the built-in animations.
+     * @default false
+     */
+    animation = false;
+    /**
+     * Sets an array of integers, which represent the indexes of the disabled items from the data array
+     * ([see example](slug:items_sortable#toc-disabling-items)).
+     */
+    disabledIndexes = [];
+    /**
+     * Sets a string that represents the name of the zone to which the Sortable belongs
+     * ([see example](slug:items_sortable#toc-transferring-of-items)). Items can be transferred
+     * between Sortables which belong to the same zone.
+     */
+    zone = undefined;
+    /**
+     * Defines the zones from which items can be transferred onto the current Sortable component
+     * ([see example](slug:items_sortable#toc-transferring-of-items)). If the `acceptZones` property
+     * of the target Sortable is set, allows you to transfer items between Sortables which belong
+     * to different zones.
+     */
+    acceptZones = undefined;
+    /**
+     * Represents the CSS styles which are applied to each Sortable item.
+     *
+     * @example
+     * ```ts
+     * import { Component } from '@angular/core';
+     * import { SortableModule } from '@progress/kendo-angular-sortable';
+     *
+     * _@Component({
+     *  selector: 'my-app',
+     *  template: `
+     *   <kendo-sortable
+     *      [data]="['1','2','3','4','5','6','7']"
+     *      [itemStyle] ="{
+     *          'display': 'inline-block',
+     *          'background-color': '#51A0ED',
+     *          'height':'50px',
+     *          'width':'50px',
+     *          'margin':'3px',
+     *          'cursor':'move'
+     *          }"
+     *      >
+     *   </kendo-sortable>
+     *    `
+     * })
+     * export class AppComponent {
+     * }
+     * ```
+     */
+    itemStyle = {};
+    /**
+     * Defines the CSS styles applied to an empty item ([see example]({% slug templates_sortable %})).
+     */
+    emptyItemStyle = undefined;
+    /**
+     * Defines the CSS styles which are applied to the currently dragged item ([see example]({% slug templates_sortable %})).
+     */
+    activeItemStyle = undefined;
+    /**
+     * Defines the CSS styles which are applied to all disabled items.
+     */
+    disabledItemStyle = undefined;
+    /**
+     * Defines the class which is applied to each Sortable item.
+     */
+    itemClass = "";
+    /**
+     * Defines the class which is applied to the active Sortable item.
+     */
+    activeItemClass = null;
+    /**
+     * Defines the class which is applied to the empty item when the Sortable has empty data.
+     */
+    emptyItemClass = null;
+    /**
+     * Defines the class which is applied to each disabled Sortable item.
+     */
+    disabledItemClass = null;
+    /**
+     * Sets the text message that will be displayed when the Sortable has no items.
+     *
+     * @example
+     * ```ts
+     * import { Component } from '@angular/core';
+     * import { SortableModule } from '@progress/kendo-angular-sortable';
+     *
+     * _@Component({
+     *  selector: 'my-app',
+     *  template: `
+     *    <kendo-sortable [data]="[]"
+     *      [emptyText]="'No items - custom message and styles'"
+     *      [emptyItemStyle] = "{'height': '40px', 'width':'400px', 'border': '2px dashed black'}" >
+     *    </kendo-sortable>
+     *    `
+     * })
+     * export class AppComponent { }
+     * ```
+     */
+    emptyText = "Empty";
+    /**
+     * @hidden
+     */
+    defaultTemplateRef = null;
+    /**
+     * Defines the template that will be used for rendering the items.
+     * @hidden
+     */
+    itemTemplateDirectiveRef = null;
+    /**
+     * Defines the template that will be used for rendering the placeholder.
+     * @hidden
+     */
+    placeholderTemplateDirectiveRef = null;
+    itemWrappers = new QueryList();
+    draggables;
+    noDataContainer;
+    hint;
+    /**
+     * Fires when the dragging of an item is started.
+     */
+    dragStart = new EventEmitter();
+    /**
+     * Fires when the dragging of an item is completed.
+     */
+    dragEnd = new EventEmitter();
+    /**
+     * Fires while the dragging of an item is in progress.
+     */
+    dragOver = new EventEmitter();
+    /**
+     * Fires when dragging an item outside of the component.
+     */
+    dragLeave = new EventEmitter();
+    /**
+     * Fires while the moving an item from one position to another.
+     */
+    dataMove = new EventEmitter();
+    /**
+     * Fires when a new item is added to the Sortable.
+     */
+    dataAdd = new EventEmitter();
+    /**
+     * Fires when an item is removed from the Sortable.
+     */
+    dataRemove = new EventEmitter();
+    /**
+     * Fires when navigating using the keyboard.
+     */
+    navigate = new EventEmitter();
+    /**
+     * The index of the currently focused item.
+     * If no item is focused, set to `-1`.
+     */
+    activeIndex = -1;
     get touchAction() {
         return "none";
     }
     get dir() {
         return this.direction;
     }
+    hostRole = 'list';
+    /**
+     * Flag indicating if the component is currently playing animations.
+     * @hidden
+     */
+    animating = false;
+    /**
+     * The index of the currently dragged item.
+     */
+    dragIndex = -1;
+    /**
+     * The index of the item above which the dragged item is.
+     */
+    dragOverIndex = -1;
+    onDragStartSubject = new Subject();
+    onDragOverSubject = new Subject();
+    onDragLeaveSubject = new Subject();
+    onDragEndSubject = new Subject();
+    /**
+     * The SortableComponent's HTMLElement.
+     */
+    wrapper;
+    /**
+     * The location of the hint indicator when dragging on mobile devices.
+     */
+    hintLocation = null;
+    id;
+    itemTemplateRef;
+    placeholderTemplateRef;
+    _data;
+    _localData = [];
+    /**
+     * @hidden
+     */
+    ariaKeyShortcuts = KEY_SHORTCUTS;
+    localizationChangeSubscription;
+    dragStartSubscription;
+    dragOverSubscription;
+    dragLeaveSubscription;
+    dragEndSubscription;
+    childrenTabindexSubscription;
+    focusableItems = [];
+    animationDuration = 300;
+    afterKeyPress = false;
+    sortableService = null;
+    _hideActiveItem = false;
+    prevActiveIndex = 0;
+    direction;
+    _animating;
+    draggable;
+    offsetParent;
     setItemData(data, i) {
         this._localData[i].item = data.item;
         this._localData[i].index = data.index;
@@ -888,6 +930,17 @@ class SortableComponent {
         }
         return template;
     }
+    constructor(ngZone, renderer, changeDetector, localization, wrapper, sortableService) {
+        this.ngZone = ngZone;
+        this.renderer = renderer;
+        this.changeDetector = changeDetector;
+        this.localization = localization;
+        validatePackage(packageMetadata);
+        this.wrapper = wrapper.nativeElement;
+        this.direction = localization.rtl ? 'rtl' : 'ltr';
+        this.sortableService = sortableService;
+        this.subscribeEvents();
+    }
     ngOnInit() {
         if (!this.data) {
             this.data = [];
@@ -1572,19 +1625,18 @@ class SortableComponent {
             }
         }
     }
-}
-SortableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableComponent, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i1.LocalizationService }, { token: i0.ElementRef }, { token: SortableService }], target: i0.ɵɵFactoryTarget.Component });
-SortableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SortableComponent, isStandalone: true, selector: "kendo-sortable", inputs: { tabIndex: "tabIndex", data: "data", navigable: "navigable", navigatable: "navigatable", animation: "animation", disabledIndexes: "disabledIndexes", zone: "zone", acceptZones: "acceptZones", itemStyle: "itemStyle", emptyItemStyle: "emptyItemStyle", activeItemStyle: "activeItemStyle", disabledItemStyle: "disabledItemStyle", itemClass: "itemClass", activeItemClass: "activeItemClass", emptyItemClass: "emptyItemClass", disabledItemClass: "disabledItemClass", emptyText: "emptyText", activeIndex: "activeIndex" }, outputs: { dragStart: "dragStart", dragEnd: "dragEnd", dragOver: "dragOver", dragLeave: "dragLeave", dataMove: "dataMove", dataAdd: "dataAdd", dataRemove: "dataRemove", navigate: "navigate" }, host: { properties: { "style.touch-action": "this.touchAction", "attr.dir": "this.dir", "attr.role": "this.hostRole" } }, providers: [
-        LocalizationService,
-        {
-            provide: L10N_PREFIX,
-            useValue: 'kendo.sortable'
-        },
-        {
-            provide: SortableContainer,
-            useExisting: forwardRef(() => SortableComponent)
-        }
-    ], queries: [{ propertyName: "defaultTemplateRef", predicate: TemplateRef }, { propertyName: "itemTemplateDirectiveRef", predicate: ItemTemplateDirective, read: TemplateRef }, { propertyName: "placeholderTemplateDirectiveRef", predicate: PlaceholderTemplateDirective, read: TemplateRef }], viewQueries: [{ propertyName: "noDataContainer", first: true, predicate: ["noDataRef"], descendants: true }, { propertyName: "hint", first: true, predicate: ["hint"], descendants: true }, { propertyName: "itemWrappers", predicate: ["itemWrapper"], descendants: true }, { propertyName: "draggables", predicate: DraggableDirective, descendants: true }], exportAs: ["kendoSortable"], usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableComponent, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i1.LocalizationService }, { token: i0.ElementRef }, { token: SortableService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SortableComponent, isStandalone: true, selector: "kendo-sortable", inputs: { tabIndex: "tabIndex", data: "data", navigable: "navigable", navigatable: "navigatable", animation: "animation", disabledIndexes: "disabledIndexes", zone: "zone", acceptZones: "acceptZones", itemStyle: "itemStyle", emptyItemStyle: "emptyItemStyle", activeItemStyle: "activeItemStyle", disabledItemStyle: "disabledItemStyle", itemClass: "itemClass", activeItemClass: "activeItemClass", emptyItemClass: "emptyItemClass", disabledItemClass: "disabledItemClass", emptyText: "emptyText", activeIndex: "activeIndex" }, outputs: { dragStart: "dragStart", dragEnd: "dragEnd", dragOver: "dragOver", dragLeave: "dragLeave", dataMove: "dataMove", dataAdd: "dataAdd", dataRemove: "dataRemove", navigate: "navigate" }, host: { properties: { "style.touch-action": "this.touchAction", "attr.dir": "this.dir", "attr.role": "this.hostRole" } }, providers: [
+            LocalizationService,
+            {
+                provide: L10N_PREFIX,
+                useValue: 'kendo.sortable'
+            },
+            {
+                provide: SortableContainer,
+                useExisting: forwardRef(() => SortableComponent)
+            }
+        ], queries: [{ propertyName: "defaultTemplateRef", predicate: TemplateRef }, { propertyName: "itemTemplateDirectiveRef", predicate: ItemTemplateDirective, read: TemplateRef }, { propertyName: "placeholderTemplateDirectiveRef", predicate: PlaceholderTemplateDirective, read: TemplateRef }], viewQueries: [{ propertyName: "noDataContainer", first: true, predicate: ["noDataRef"], descendants: true }, { propertyName: "hint", first: true, predicate: ["hint"], descendants: true }, { propertyName: "itemWrappers", predicate: ["itemWrapper"], descendants: true }, { propertyName: "draggables", predicate: DraggableDirective, descendants: true }], exportAs: ["kendoSortable"], usesOnChanges: true, ngImport: i0, template: `
     <div #itemWrapper *ngFor="let item of _localData;let i=index"
         kendoDraggable
         role="listitem"
@@ -1631,7 +1683,8 @@ SortableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", vers
         <ng-container *ngIf="!itemTemplateRef">{{_localData[dragIndex].item}}</ng-container>
     </div>
   `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["index", "disabled", "hidden"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableComponent, decorators: [{
             type: Component,
             args: [{
                     exportAs: 'kendoSortable',
@@ -1785,6 +1838,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * The arguments for the `SortableComponent` `dataAdd` event.
  */
 class DataAddEvent extends PreventableEvent {
+    /**
+     * The index of the data item.
+     */
+    index;
+    /**
+     * The data item that will be added.
+     */
+    dataItem;
     /**
      * @hidden
      */
@@ -1797,6 +1858,14 @@ class DataAddEvent extends PreventableEvent {
  * The arguments for the `SortableComponent` `dataRemove` event.
  */
 class DataRemoveEvent extends PreventableEvent {
+    /**
+     * The index of the data item.
+     */
+    index;
+    /**
+     * The data item that will be removed.
+     */
+    dataItem;
     /**
      * @hidden
      */
@@ -1809,6 +1878,18 @@ class DataRemoveEvent extends PreventableEvent {
  * The arguments for the `SortableComponent` `dataMove` event.
  */
 class DataMoveEvent extends PreventableEvent {
+    /**
+     * The index of the data item.
+     */
+    index;
+    /**
+     * The old index of the data item.
+     */
+    oldIndex;
+    /**
+     * The data item that will be removed.
+     */
+    dataItem;
     /**
      * @hidden
      */
@@ -1823,11 +1904,12 @@ class DataMoveEvent extends PreventableEvent {
  * This is achieved by subscribing to the Sortable's events and handling them using the API methods it provides.
  */
 class SortableBindingDirective {
-    constructor(sortable, sortableService) {
-        this.sortable = sortable;
-        this.sortableService = sortableService;
-        this.sortableService = sortableService;
-    }
+    sortable;
+    sortableService;
+    removeHiddenSubscription;
+    dragOverSubscription;
+    navigateSubscription;
+    lastTarget;
     /**
      * Sets a data-bound array that is used as a data source for the Sortable.
      *
@@ -1841,6 +1923,11 @@ class SortableBindingDirective {
     set data(data) {
         this.sortable.data = data;
     }
+    constructor(sortable, sortableService) {
+        this.sortable = sortable;
+        this.sortableService = sortableService;
+        this.sortableService = sortableService;
+    }
     nextEnabledIndex(index, sortable) {
         for (let i = index; i <= sortable.data.length; i++) {
             if (sortable.itemEnabled(i)) {
@@ -1968,10 +2055,10 @@ class SortableBindingDirective {
             this.removeHiddenSubscription.unsubscribe();
         }
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableBindingDirective, deps: [{ token: SortableComponent }, { token: SortableService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SortableBindingDirective, isStandalone: true, selector: "[kendoSortableBinding]", inputs: { data: ["kendoSortableBinding", "data"] }, ngImport: i0 });
 }
-SortableBindingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableBindingDirective, deps: [{ token: SortableComponent }, { token: SortableService }], target: i0.ɵɵFactoryTarget.Directive });
-SortableBindingDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SortableBindingDirective, isStandalone: true, selector: "[kendoSortableBinding]", inputs: { data: ["kendoSortableBinding", "data"] }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableBindingDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableBindingDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoSortableBinding]',
@@ -2025,11 +2112,11 @@ const KENDO_SORTABLE = [
  * ```
  */
 class SortableModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: SortableModule, imports: [SortableComponent, DraggableDirective, PlaceholderTemplateDirective, ItemTemplateDirective, SortableBindingDirective], exports: [SortableComponent, DraggableDirective, PlaceholderTemplateDirective, ItemTemplateDirective, SortableBindingDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableModule, providers: [SortableService] });
 }
-SortableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SortableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: SortableModule, imports: [SortableComponent, DraggableDirective, PlaceholderTemplateDirective, ItemTemplateDirective, SortableBindingDirective], exports: [SortableComponent, DraggableDirective, PlaceholderTemplateDirective, ItemTemplateDirective, SortableBindingDirective] });
-SortableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableModule, providers: [SortableService], imports: [SortableComponent] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SortableModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...KENDO_SORTABLE],