@progress/kendo-angular-sortable 21.4.1 → 22.0.0-develop.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,7 +3,7 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  import * as i0 from '@angular/core';
6
- import { Injectable, Directive, Input, HostBinding, QueryList, EventEmitter, forwardRef, TemplateRef, Component, ContentChildren, ViewChildren, ViewChild, Output, NgModule } from '@angular/core';
6
+ import { Injectable, HostBinding, Input, Directive, QueryList, EventEmitter, TemplateRef, forwardRef, Output, ViewChild, ViewChildren, ContentChildren, Component, NgModule } from '@angular/core';
7
7
  import { Subject, merge } from 'rxjs';
8
8
  import { isDocumentAvailable, focusableSelector, isChanged, Keys, normalizeKeys, EventsOutsideAngularDirective } from '@progress/kendo-angular-common';
9
9
  import { filter, tap, take, switchMap } from 'rxjs/operators';
@@ -193,8 +193,8 @@ const packageMetadata = {
193
193
  productName: 'Kendo UI for Angular',
194
194
  productCode: 'KENDOUIANGULAR',
195
195
  productCodes: ['KENDOUIANGULAR'],
196
- publishDate: 1768393321,
197
- version: '21.4.1',
196
+ publishDate: 1768396034,
197
+ version: '22.0.0-develop.1',
198
198
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
199
199
  };
200
200
 
@@ -417,10 +417,10 @@ class SortableService {
417
417
  this.source.markForCheck();
418
418
  });
419
419
  }
420
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
421
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableService, providedIn: 'root' });
420
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
421
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableService, providedIn: 'root' });
422
422
  }
423
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableService, decorators: [{
423
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableService, decorators: [{
424
424
  type: Injectable,
425
425
  args: [{
426
426
  providedIn: 'root'
@@ -431,10 +431,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
431
431
  * @hidden
432
432
  */
433
433
  class SortableContainer {
434
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableContainer, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
435
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableContainer });
434
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableContainer, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
435
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableContainer });
436
436
  }
437
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableContainer, decorators: [{
437
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableContainer, decorators: [{
438
438
  type: Injectable
439
439
  }] });
440
440
 
@@ -487,10 +487,10 @@ class DraggableDirective {
487
487
  updateDisplayStyle() {
488
488
  this.renderer.setStyle(this.el.nativeElement, 'display', this.display);
489
489
  }
490
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DraggableDirective, deps: [{ token: SortableContainer }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
491
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", 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 });
490
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DraggableDirective, deps: [{ token: SortableContainer }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
491
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.18", 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 });
492
492
  }
493
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DraggableDirective, decorators: [{
493
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DraggableDirective, decorators: [{
494
494
  type: Directive,
495
495
  args: [{
496
496
  selector: '[kendoDraggable]',
@@ -519,10 +519,10 @@ class ItemTemplateDirective {
519
519
  constructor(templateRef) {
520
520
  this.templateRef = templateRef;
521
521
  }
522
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
523
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: ItemTemplateDirective, isStandalone: true, selector: "[kendoSortableItemTemplate]", ngImport: i0 });
522
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: ItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
523
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.18", type: ItemTemplateDirective, isStandalone: true, selector: "[kendoSortableItemTemplate]", ngImport: i0 });
524
524
  }
525
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ItemTemplateDirective, decorators: [{
525
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: ItemTemplateDirective, decorators: [{
526
526
  type: Directive,
527
527
  args: [{
528
528
  selector: '[kendoSortableItemTemplate]',
@@ -537,10 +537,10 @@ class PlaceholderTemplateDirective {
537
537
  constructor(templateRef) {
538
538
  this.templateRef = templateRef;
539
539
  }
540
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
541
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: PlaceholderTemplateDirective, isStandalone: true, selector: "[kendoSortablePlaceholderTemplate]", ngImport: i0 });
540
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: PlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
541
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.18", type: PlaceholderTemplateDirective, isStandalone: true, selector: "[kendoSortablePlaceholderTemplate]", ngImport: i0 });
542
542
  }
543
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PlaceholderTemplateDirective, decorators: [{
543
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: PlaceholderTemplateDirective, decorators: [{
544
544
  type: Directive,
545
545
  args: [{
546
546
  selector: '[kendoSortablePlaceholderTemplate]',
@@ -1597,8 +1597,8 @@ class SortableComponent {
1597
1597
  }
1598
1598
  }
1599
1599
  }
1600
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableComponent, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i1.LocalizationService }, { token: i0.ElementRef }, { token: SortableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1601
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SortableComponent, isStandalone: true, selector: "kendo-sortable", inputs: { tabIndex: "tabIndex", trackBy: "trackBy", data: "data", navigable: "navigable", 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: [
1600
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableComponent, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i1.LocalizationService }, { token: i0.ElementRef }, { token: SortableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1601
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.18", type: SortableComponent, isStandalone: true, selector: "kendo-sortable", inputs: { tabIndex: "tabIndex", trackBy: "trackBy", data: "data", navigable: "navigable", 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: [
1602
1602
  LocalizationService,
1603
1603
  {
1604
1604
  provide: L10N_PREFIX,
@@ -1671,7 +1671,7 @@ class SortableComponent {
1671
1671
  }
1672
1672
  `, isInline: true, dependencies: [{ 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: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
1673
1673
  }
1674
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableComponent, decorators: [{
1674
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableComponent, decorators: [{
1675
1675
  type: Component,
1676
1676
  args: [{
1677
1677
  exportAs: 'kendoSortable',
@@ -2065,10 +2065,10 @@ class SortableBindingDirective {
2065
2065
  this.removeHiddenSubscription.unsubscribe();
2066
2066
  }
2067
2067
  }
2068
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableBindingDirective, deps: [{ token: SortableComponent }, { token: SortableService }], target: i0.ɵɵFactoryTarget.Directive });
2069
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: SortableBindingDirective, isStandalone: true, selector: "[kendoSortableBinding]", inputs: { data: ["kendoSortableBinding", "data"] }, ngImport: i0 });
2068
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableBindingDirective, deps: [{ token: SortableComponent }, { token: SortableService }], target: i0.ɵɵFactoryTarget.Directive });
2069
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.18", type: SortableBindingDirective, isStandalone: true, selector: "[kendoSortableBinding]", inputs: { data: ["kendoSortableBinding", "data"] }, ngImport: i0 });
2070
2070
  }
2071
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableBindingDirective, decorators: [{
2071
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableBindingDirective, decorators: [{
2072
2072
  type: Directive,
2073
2073
  args: [{
2074
2074
  selector: '[kendoSortableBinding]',
@@ -2130,11 +2130,11 @@ const KENDO_SORTABLE = [
2130
2130
  * ```
2131
2131
  */
2132
2132
  class SortableModule {
2133
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2134
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SortableModule, imports: [SortableComponent, DraggableDirective, PlaceholderTemplateDirective, ItemTemplateDirective, SortableBindingDirective], exports: [SortableComponent, DraggableDirective, PlaceholderTemplateDirective, ItemTemplateDirective, SortableBindingDirective] });
2135
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableModule, providers: [SortableService] });
2133
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2134
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.18", ngImport: i0, type: SortableModule, imports: [SortableComponent, DraggableDirective, PlaceholderTemplateDirective, ItemTemplateDirective, SortableBindingDirective], exports: [SortableComponent, DraggableDirective, PlaceholderTemplateDirective, ItemTemplateDirective, SortableBindingDirective] });
2135
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableModule, providers: [SortableService] });
2136
2136
  }
2137
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableModule, decorators: [{
2137
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SortableModule, decorators: [{
2138
2138
  type: NgModule,
2139
2139
  args: [{
2140
2140
  imports: [...KENDO_SORTABLE],
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-sortable",
3
- "version": "21.4.1",
3
+ "version": "22.0.0-develop.1",
4
4
  "description": "A Sortable Component for Angular",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "author": "Progress",
@@ -15,27 +15,21 @@
15
15
  "Sortable"
16
16
  ],
17
17
  "@progress": {
18
- "friendlyName": "Sortable",
19
- "package": {
20
- "productName": "Kendo UI for Angular",
21
- "productCode": "KENDOUIANGULAR",
22
- "publishDate": 1768393321,
23
- "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
24
- }
18
+ "friendlyName": "Sortable"
25
19
  },
26
20
  "peerDependencies": {
27
- "@angular/animations": "18 - 21",
28
- "@angular/common": "18 - 21",
29
- "@angular/core": "18 - 21",
30
- "@angular/platform-browser": "18 - 21",
21
+ "@angular/animations": "19 - 21",
22
+ "@angular/common": "19 - 21",
23
+ "@angular/core": "19 - 21",
24
+ "@angular/platform-browser": "19 - 21",
31
25
  "@progress/kendo-licensing": "^1.7.0",
32
- "@progress/kendo-angular-common": "21.4.1",
33
- "@progress/kendo-angular-l10n": "21.4.1",
26
+ "@progress/kendo-angular-common": "22.0.0-develop.1",
27
+ "@progress/kendo-angular-l10n": "22.0.0-develop.1",
34
28
  "rxjs": "^6.5.3 || ^7.0.0"
35
29
  },
36
30
  "dependencies": {
37
31
  "tslib": "^2.3.1",
38
- "@progress/kendo-angular-schematics": "21.4.1",
32
+ "@progress/kendo-angular-schematics": "22.0.0-develop.1",
39
33
  "@progress/kendo-draggable": "^3.0.2"
40
34
  },
41
35
  "schematics": "./schematics/collection.json",
@@ -47,8 +41,6 @@
47
41
  },
48
42
  ".": {
49
43
  "types": "./index.d.ts",
50
- "esm2022": "./esm2022/progress-kendo-angular-sortable.mjs",
51
- "esm": "./esm2022/progress-kendo-angular-sortable.mjs",
52
44
  "default": "./fesm2022/progress-kendo-angular-sortable.mjs"
53
45
  }
54
46
  },
@@ -1,189 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- import { Directive, Input } from '@angular/core';
6
- import { SortableComponent } from './sortable.component';
7
- import { SortableService } from './sortable.service';
8
- import { DataAddEvent, DataMoveEvent, DataRemoveEvent } from './data-events';
9
- import { filter, take } from 'rxjs/operators';
10
- import * as i0 from "@angular/core";
11
- import * as i1 from "./sortable.component";
12
- import * as i2 from "./sortable.service";
13
- /**
14
- * Represents a directive that handles common scenarios such as reordering and moving items between Sortables, reducing boilerplate code.
15
- *
16
- * This directive subscribes to the Sortable's events and handles them using the provided API methods.
17
- *
18
- * @example
19
- * ```html
20
- * <kendo-sortable
21
- * [kendoSortableBinding]="items"
22
- * [navigable]="true"
23
- * [animation]="true"
24
- * itemClass="item col-xs-6 col-sm-3"
25
- * activeItemClass="item col-xs-6 col-sm-3 active">
26
- * </kendo-sortable>
27
- * ```
28
- *
29
- * @remarks
30
- * Applied to: {@link SortableComponent}
31
- */
32
- export class SortableBindingDirective {
33
- sortable;
34
- sortableService;
35
- removeHiddenSubscription;
36
- dragOverSubscription;
37
- navigateSubscription;
38
- lastTarget;
39
- /**
40
- * Sets a data-bound array that is used as a data source for the Sortable ([see example](slug:overview_sortable)).
41
- */
42
- set data(data) {
43
- this.sortable.data = data;
44
- }
45
- constructor(sortable, sortableService) {
46
- this.sortable = sortable;
47
- this.sortableService = sortableService;
48
- this.sortableService = sortableService;
49
- }
50
- nextEnabledIndex(index, sortable) {
51
- for (let i = index; i <= sortable.data.length; i++) {
52
- if (sortable.itemEnabled(i)) {
53
- return i;
54
- }
55
- }
56
- }
57
- addItem(event, sortable) {
58
- let index = event.index;
59
- const dataItem = this.sortableService.getSource().data[event.oldIndex];
60
- const addEvent = new DataAddEvent({ index: index, dataItem: dataItem });
61
- sortable.dataAdd.emit(addEvent);
62
- if (!addEvent.isDefaultPrevented()) {
63
- if (index === sortable.itemWrappers.length - 1 && !sortable.noDataContainer) {
64
- index++;
65
- }
66
- sortable.addDataItem(dataItem, index);
67
- }
68
- return !addEvent.isDefaultPrevented();
69
- }
70
- removeItem(event, sortable) {
71
- const originDraggable = this.sortableService.originDraggable;
72
- const removeEvent = new DataRemoveEvent({ index: event.oldIndex, dataItem: sortable.data[event.oldIndex] });
73
- sortable.dataRemove.emit(removeEvent);
74
- if (!removeEvent.isDefaultPrevented()) {
75
- if (originDraggable && originDraggable.parent === sortable) {
76
- sortable.hideItem(event.oldIndex, true);
77
- }
78
- else {
79
- sortable.removeDataItem(event.oldIndex);
80
- }
81
- }
82
- return !removeEvent.isDefaultPrevented();
83
- }
84
- moveItem(event, sortable) {
85
- if (event.index === event.oldIndex) {
86
- return false;
87
- }
88
- const moveEvent = new DataMoveEvent({
89
- dataItem: sortable.data[event.oldIndex],
90
- index: event.index,
91
- oldIndex: event.oldIndex
92
- });
93
- sortable.dataMove.emit(moveEvent);
94
- if (!moveEvent.isDefaultPrevented()) {
95
- sortable.moveItem(event.oldIndex, event.index);
96
- }
97
- return !moveEvent.isDefaultPrevented();
98
- }
99
- /**
100
- * Removes the Draggable item from which the drag started.
101
- * @hidden
102
- */
103
- removeOriginDraggable() {
104
- if (this.removeHiddenSubscription) {
105
- this.removeHiddenSubscription.unsubscribe();
106
- }
107
- this.removeHiddenSubscription = this.sortableService.onReleaseSubject.pipe(take(1), filter(_ => this.sortableService.originDraggable !== null && this.sortableService.originDraggable.hidden)).subscribe((e) => {
108
- const originDraggable = this.sortableService.originDraggable;
109
- const newSource = this.sortableService.getSource();
110
- if (originDraggable.parent !== this.sortableService.target) {
111
- const isTargetDraggable = e.target ? (e.target.isDraggable || e.target.isDraggableChild) : false;
112
- if (isTargetDraggable || originDraggable.parent !== newSource) {
113
- if (originDraggable.parent !== this.sortableService.target) {
114
- originDraggable.parent.removeDataItem(originDraggable.index);
115
- }
116
- }
117
- this.sortableService.originDraggable = null;
118
- }
119
- });
120
- }
121
- onDragOver(event) {
122
- const source = this.sortableService.getSource();
123
- const target = this.sortableService.target;
124
- const targetDraggables = target.draggables.toArray();
125
- if (event.isDefaultPrevented()) {
126
- return;
127
- }
128
- event.preventDefault();
129
- if (target === source) {
130
- // Skip moveItem if target is the draggable after which item was just added
131
- // Ensures item added to the end stays there until further user action
132
- if (targetDraggables[event.index] !== this.lastTarget) {
133
- this.moveItem(event, target);
134
- }
135
- this.lastTarget = undefined;
136
- }
137
- else {
138
- if (!target.itemEnabled(event.index)) {
139
- event.index = this.nextEnabledIndex(event.index, target);
140
- }
141
- //Add to target and remove from source
142
- if (this.addItem(event, target) && this.removeItem(event, source)) {
143
- this.lastTarget = target.draggables.toArray()[event.index];
144
- this.removeOriginDraggable();
145
- target.activeIndex = event.index;
146
- source.activeIndex = -1;
147
- }
148
- }
149
- }
150
- onNavigate(event) {
151
- if (event.ctrlKey) {
152
- const moveEvent = new DataMoveEvent({
153
- dataItem: this.sortable.data[event.oldIndex],
154
- index: event.index,
155
- oldIndex: event.oldIndex
156
- });
157
- this.sortable.dataMove.emit(moveEvent);
158
- if (!moveEvent.isDefaultPrevented()) {
159
- this.sortable.moveItem(event.oldIndex, event.index);
160
- }
161
- }
162
- else {
163
- this.sortable.activeIndex = event.index;
164
- }
165
- }
166
- ngOnInit() {
167
- this.dragOverSubscription = this.sortable.dragOver.subscribe(this.onDragOver.bind(this));
168
- this.navigateSubscription = this.sortable.navigate.subscribe(this.onNavigate.bind(this));
169
- }
170
- ngOnDestroy() {
171
- this.dragOverSubscription.unsubscribe();
172
- this.navigateSubscription.unsubscribe();
173
- if (this.removeHiddenSubscription) {
174
- this.removeHiddenSubscription.unsubscribe();
175
- }
176
- }
177
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableBindingDirective, deps: [{ token: i1.SortableComponent }, { token: i2.SortableService }], target: i0.ɵɵFactoryTarget.Directive });
178
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: SortableBindingDirective, isStandalone: true, selector: "[kendoSortableBinding]", inputs: { data: ["kendoSortableBinding", "data"] }, ngImport: i0 });
179
- }
180
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SortableBindingDirective, decorators: [{
181
- type: Directive,
182
- args: [{
183
- selector: '[kendoSortableBinding]',
184
- standalone: true
185
- }]
186
- }], ctorParameters: () => [{ type: i1.SortableComponent }, { type: i2.SortableService }], propDecorators: { data: [{
187
- type: Input,
188
- args: ["kendoSortableBinding"]
189
- }] } });
@@ -1,5 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- export {};
@@ -1,69 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- import { PreventableEvent } from './preventable-event';
6
- /**
7
- * Represents the arguments for the `SortableComponent` `dataAdd` event.
8
- */
9
- export class DataAddEvent extends PreventableEvent {
10
- /**
11
- * Specifies the index of the data item.
12
- */
13
- index;
14
- /**
15
- * Specifies the data item to add.
16
- */
17
- dataItem;
18
- /**
19
- * @hidden
20
- */
21
- constructor(options) {
22
- super();
23
- Object.assign(this, options);
24
- }
25
- }
26
- /**
27
- * Represents the arguments for the `SortableComponent` `dataRemove` event.
28
- */
29
- export class DataRemoveEvent extends PreventableEvent {
30
- /**
31
- * Specifies the index of the data item.
32
- */
33
- index;
34
- /**
35
- * Specifies the data item to remove.
36
- */
37
- dataItem;
38
- /**
39
- * @hidden
40
- */
41
- constructor(options) {
42
- super();
43
- Object.assign(this, options);
44
- }
45
- }
46
- /**
47
- * Represents the arguments for the `SortableComponent` `dataMove` event.
48
- */
49
- export class DataMoveEvent extends PreventableEvent {
50
- /**
51
- * Specifies the index of the data item.
52
- */
53
- index;
54
- /**
55
- * Specifies the old index of the data item.
56
- */
57
- oldIndex;
58
- /**
59
- * Specifies the data item to move.
60
- */
61
- dataItem;
62
- /**
63
- * @hidden
64
- */
65
- constructor(options) {
66
- super();
67
- Object.assign(this, options);
68
- }
69
- }
@@ -1,38 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- import { SortableBindingDirective } from "./binding.directive";
6
- import { DraggableDirective } from "./draggable.directive";
7
- import { ItemTemplateDirective, PlaceholderTemplateDirective } from "./item-template.directive";
8
- import { SortableComponent } from "./sortable.component";
9
- /**
10
- * Use this utility array to access all `@progress/kendo-angular-sortable`-related components and directives in a standalone Angular component.
11
- *
12
- * @example
13
- * ```typescript
14
- * import { Component } from '@angular/core';
15
- * import { KENDO_SORTABLE } from '@progress/kendo-angular-sortable';
16
- *
17
- * @Component({
18
- * selector: 'my-app',
19
- * standalone: true,
20
- * imports: [KENDO_SORTABLE],
21
- * template: `
22
- * <kendo-sortable [kendoSortableBinding]="items">
23
- * </kendo-sortable>
24
- * `
25
- * })
26
- *
27
- * export class AppComponent {
28
- * public items = ['Item 1', 'Item 2', 'Item 3'];
29
- * }
30
- * ```
31
- */
32
- export const KENDO_SORTABLE = [
33
- SortableComponent,
34
- DraggableDirective,
35
- PlaceholderTemplateDirective,
36
- ItemTemplateDirective,
37
- SortableBindingDirective
38
- ];
@@ -1,26 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- import { PreventableEvent } from './preventable-event';
6
- /**
7
- * Represents the arguments for the `DraggableDirective` events.
8
- * @hidden
9
- */
10
- export class DraggableEvent extends PreventableEvent {
11
- /**
12
- * Specifies the target `DraggableDirective` instance.
13
- */
14
- target;
15
- /**
16
- * Specifies the browser event emitted by the target's native element.
17
- */
18
- originalEvent; //DragEvent | TouchEvent;
19
- /**
20
- * @hidden
21
- */
22
- constructor(options) {
23
- super();
24
- Object.assign(this, options);
25
- }
26
- }
@@ -1,79 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- import { Directive, HostBinding, Input, ElementRef, Renderer2 } from '@angular/core';
6
- import { SortableContainer } from './sortable-container';
7
- import * as i0 from "@angular/core";
8
- import * as i1 from "./sortable-container";
9
- /**
10
- * @hidden
11
- */
12
- export class DraggableDirective {
13
- parent;
14
- el;
15
- renderer;
16
- index;
17
- disabled;
18
- set hidden(value) {
19
- this._hidden = value;
20
- this.updateDisplayStyle();
21
- }
22
- get hidden() {
23
- return this._hidden;
24
- }
25
- _hidden;
26
- get _focused() {
27
- return this.disabled ? false : (this.index === this.parent.activeIndex);
28
- }
29
- get _disabled() {
30
- return this.disabled;
31
- }
32
- get display() {
33
- return this.hidden ? "none" : this._display;
34
- }
35
- set display(display) {
36
- this._display = display;
37
- this.updateDisplayStyle();
38
- }
39
- _display;
40
- constructor(parent, el, renderer) {
41
- this.parent = parent;
42
- this.el = el;
43
- this.renderer = renderer;
44
- }
45
- ngOnInit() {
46
- const nativeElement = this.el.nativeElement;
47
- this.display = nativeElement.style.display;
48
- if (nativeElement) { // Remove the inline styles after a few releases of the themes with the style.
49
- this.renderer.setStyle(nativeElement, 'user-select', 'none');
50
- this.renderer.setStyle(nativeElement, '-ms-user-select', 'none');
51
- this.renderer.setStyle(nativeElement, '-moz-user-select', 'none');
52
- this.renderer.setStyle(nativeElement, '-webkit-user-select', 'none');
53
- }
54
- }
55
- updateDisplayStyle() {
56
- this.renderer.setStyle(this.el.nativeElement, 'display', this.display);
57
- }
58
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DraggableDirective, deps: [{ token: i1.SortableContainer }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
59
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", 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 });
60
- }
61
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DraggableDirective, decorators: [{
62
- type: Directive,
63
- args: [{
64
- selector: '[kendoDraggable]',
65
- standalone: true
66
- }]
67
- }], ctorParameters: () => [{ type: i1.SortableContainer }, { type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { index: [{
68
- type: Input
69
- }], disabled: [{
70
- type: Input
71
- }], hidden: [{
72
- type: Input
73
- }], _focused: [{
74
- type: HostBinding,
75
- args: ['class.k-focus']
76
- }], _disabled: [{
77
- type: HostBinding,
78
- args: ['attr.aria-disabled']
79
- }] } });
package/esm2022/index.mjs DELETED
@@ -1,18 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- export { SortableComponent } from './sortable.component';
6
- export { SortableModule } from './sortable.module';
7
- export { PreventableEvent } from './preventable-event';
8
- export { DraggableEvent } from './draggable-event';
9
- export { DragStartEvent, DragEndEvent, DragOverEvent } from './sortable-events';
10
- export { NavigateEvent } from './navigate-event';
11
- export { DataMoveEvent, DataAddEvent, DataRemoveEvent } from './data-events';
12
- export { DraggableDirective } from "./draggable.directive";
13
- export { SortableBindingDirective } from "./binding.directive";
14
- export { PlaceholderTemplateDirective } from './item-template.directive';
15
- export { ItemTemplateDirective } from './item-template.directive';
16
- export { SortableService } from './sortable.service';
17
- export { SortableContainer } from './sortable-container';
18
- export * from './directives';