@progress/kendo-angular-treeview 5.4.2-dev.202111011443 → 6.0.0-dev.202112021059
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.
- package/dist/cdn/js/kendo-angular-treeview.js +2 -2
- package/dist/cdn/main.js +1 -1
- package/dist/es/check.directive.js +30 -39
- package/dist/es/expand.directive.js +40 -41
- package/dist/es/package-metadata.js +1 -1
- package/dist/es/selection/select.directive.js +22 -28
- package/dist/es/treeview.component.js +23 -10
- package/dist/es/utils.js +4 -6
- package/dist/es2015/check.directive.d.ts +8 -1
- package/dist/es2015/check.directive.js +30 -35
- package/dist/es2015/expand.directive.d.ts +12 -3
- package/dist/es2015/expand.directive.js +39 -36
- package/dist/es2015/index.metadata.json +1 -1
- package/dist/es2015/main.d.ts +1 -0
- package/dist/es2015/package-metadata.js +1 -1
- package/dist/es2015/selection/select.directive.d.ts +11 -3
- package/dist/es2015/selection/select.directive.js +22 -24
- package/dist/es2015/treeview-filter-settings.d.ts +2 -0
- package/dist/es2015/treeview.component.d.ts +20 -5
- package/dist/es2015/treeview.component.js +24 -11
- package/dist/es2015/utils.d.ts +2 -3
- package/dist/es2015/utils.js +4 -6
- package/dist/fesm2015/index.js +117 -113
- package/dist/fesm5/index.js +117 -125
- package/dist/npm/check.directive.js +30 -39
- package/dist/npm/expand.directive.js +40 -41
- package/dist/npm/package-metadata.js +1 -1
- package/dist/npm/selection/select.directive.js +22 -28
- package/dist/npm/treeview.component.js +23 -10
- package/dist/npm/utils.js +4 -6
- package/dist/systemjs/kendo-angular-treeview.js +1 -1
- package/package.json +1 -1
package/dist/fesm5/index.js
CHANGED
|
@@ -22,7 +22,7 @@ var packageMetadata = {
|
|
|
22
22
|
name: '@progress/kendo-angular-treeview',
|
|
23
23
|
productName: 'Kendo UI for Angular',
|
|
24
24
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
25
|
-
publishDate:
|
|
25
|
+
publishDate: 1638442548,
|
|
26
26
|
version: '',
|
|
27
27
|
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'
|
|
28
28
|
};
|
|
@@ -407,17 +407,15 @@ var fetchLoadedDescendants = function (lookup, filterExpression) {
|
|
|
407
407
|
/**
|
|
408
408
|
* @hidden
|
|
409
409
|
*
|
|
410
|
-
* Compares two
|
|
410
|
+
* Compares two Seets to determine whether all unique elements in one, are present in the other.
|
|
411
411
|
* Important:
|
|
412
412
|
* - it disregards the element order
|
|
413
|
-
* - it disregards element repetitions - sameValues([1, 1, 2], [1, 2, 2]) will return true
|
|
414
413
|
*/
|
|
415
|
-
var sameValues = function (
|
|
416
|
-
if (
|
|
414
|
+
var sameValues = function (as, bs) {
|
|
415
|
+
if (as.size !== bs.size) {
|
|
417
416
|
return false;
|
|
418
417
|
}
|
|
419
|
-
|
|
420
|
-
return a.every(function (v) { return values.has(v); });
|
|
418
|
+
return Array.from(as).every(function (v) { return bs.has(v); });
|
|
421
419
|
};
|
|
422
420
|
|
|
423
421
|
var safe = function (node) { return (node || {}); };
|
|
@@ -1081,9 +1079,10 @@ var providers = [
|
|
|
1081
1079
|
* Represents the [Kendo UI TreeView component for Angular]({% slug overview_treeview %}).
|
|
1082
1080
|
*
|
|
1083
1081
|
* @example
|
|
1084
|
-
* {% meta height:
|
|
1085
|
-
* {% embed_file
|
|
1086
|
-
* {% embed_file
|
|
1082
|
+
* {% meta height:450 %}
|
|
1083
|
+
* {% embed_file get-started/app.component.ts preview %}
|
|
1084
|
+
* {% embed_file get-started/app.module.ts %}
|
|
1085
|
+
* {% embed_file shared/main.ts %}
|
|
1087
1086
|
* {% endmeta %}
|
|
1088
1087
|
*/
|
|
1089
1088
|
var TreeViewComponent = /** @class */ (function () {
|
|
@@ -1284,21 +1283,33 @@ var TreeViewComponent = /** @class */ (function () {
|
|
|
1284
1283
|
configurable: true
|
|
1285
1284
|
});
|
|
1286
1285
|
Object.defineProperty(TreeViewComponent.prototype, "nodeTemplateRef", {
|
|
1286
|
+
get: function () {
|
|
1287
|
+
return this._nodeTemplateRef || this.nodeTemplateQuery;
|
|
1288
|
+
},
|
|
1287
1289
|
/**
|
|
1288
1290
|
* @hidden
|
|
1291
|
+
*
|
|
1292
|
+
* Defines the template for each node.
|
|
1293
|
+
* Takes precedence over nested templates in the TreeView tag.
|
|
1289
1294
|
*/
|
|
1290
1295
|
set: function (template) {
|
|
1291
|
-
this.
|
|
1296
|
+
this._nodeTemplateRef = template;
|
|
1292
1297
|
},
|
|
1293
1298
|
enumerable: true,
|
|
1294
1299
|
configurable: true
|
|
1295
1300
|
});
|
|
1296
1301
|
Object.defineProperty(TreeViewComponent.prototype, "loadMoreButtonTemplateRef", {
|
|
1302
|
+
get: function () {
|
|
1303
|
+
return this._loadMoreButtonTemplateRef || this.loadMoreButtonTemplateQuery;
|
|
1304
|
+
},
|
|
1297
1305
|
/**
|
|
1298
1306
|
* @hidden
|
|
1307
|
+
*
|
|
1308
|
+
* Defines the template for each load-more button.
|
|
1309
|
+
* Takes precedence over nested templates in the TreeView tag.
|
|
1299
1310
|
*/
|
|
1300
1311
|
set: function (template) {
|
|
1301
|
-
this.
|
|
1312
|
+
this._loadMoreButtonTemplateRef = template;
|
|
1302
1313
|
},
|
|
1303
1314
|
enumerable: true,
|
|
1304
1315
|
configurable: true
|
|
@@ -1734,18 +1745,18 @@ var TreeViewComponent = /** @class */ (function () {
|
|
|
1734
1745
|
__metadata("design:type", EventEmitter)
|
|
1735
1746
|
], TreeViewComponent.prototype, "nodeDblClick", void 0);
|
|
1736
1747
|
__decorate([
|
|
1737
|
-
ContentChild(NodeTemplateDirective, { static:
|
|
1748
|
+
ContentChild(NodeTemplateDirective, { static: false }),
|
|
1738
1749
|
__metadata("design:type", NodeTemplateDirective)
|
|
1739
|
-
], TreeViewComponent.prototype, "
|
|
1750
|
+
], TreeViewComponent.prototype, "nodeTemplateQuery", void 0);
|
|
1740
1751
|
__decorate([
|
|
1741
1752
|
Input('nodeTemplate'),
|
|
1742
1753
|
__metadata("design:type", NodeTemplateDirective),
|
|
1743
1754
|
__metadata("design:paramtypes", [NodeTemplateDirective])
|
|
1744
1755
|
], TreeViewComponent.prototype, "nodeTemplateRef", null);
|
|
1745
1756
|
__decorate([
|
|
1746
|
-
ContentChild(LoadMoreButtonTemplateDirective, { static:
|
|
1757
|
+
ContentChild(LoadMoreButtonTemplateDirective, { static: false }),
|
|
1747
1758
|
__metadata("design:type", LoadMoreButtonTemplateDirective)
|
|
1748
|
-
], TreeViewComponent.prototype, "
|
|
1759
|
+
], TreeViewComponent.prototype, "loadMoreButtonTemplateQuery", void 0);
|
|
1749
1760
|
__decorate([
|
|
1750
1761
|
Input('loadMoreButtonTemplate'),
|
|
1751
1762
|
__metadata("design:type", LoadMoreButtonTemplateDirective),
|
|
@@ -1818,7 +1829,7 @@ var TreeViewComponent = /** @class */ (function () {
|
|
|
1818
1829
|
exportAs: 'kendoTreeView',
|
|
1819
1830
|
providers: providers,
|
|
1820
1831
|
selector: 'kendo-treeview',
|
|
1821
|
-
template: "\n <kendo-textbox\n #filterInput\n *ngIf=\"filterable\"\n [value]=\"filter\"\n [clearButton]=\"true\"\n (valueChange)=\"filterChange.emit($event)\"\n [placeholder]=\"filterInputPlaceholder\"\n >\n <ng-template kendoTextBoxPrefixTemplate>\n <span class=\"k-icon k-i-search\"></span>\n </ng-template>\n </kendo-textbox>\n <ul class=\"k-treeview-lines\"\n kendoTreeViewGroup\n role=\"group\"\n [loadOnDemand]=\"loadOnDemand\"\n [checkboxes]=\"checkboxes\"\n [expandIcons]=\"expandIcons\"\n [selectable]=\"selectable\"\n [touchActions]=\"touchActions\"\n [children]=\"children\"\n [hasChildren]=\"hasChildren\"\n [isChecked]=\"isChecked\"\n [isDisabled]=\"isDisabled\"\n [isExpanded]=\"isExpanded\"\n [isSelected]=\"isSelected\"\n [isVisible]=\"isVisible\"\n [nodeTemplateRef]=\"
|
|
1832
|
+
template: "\n <kendo-textbox\n #filterInput\n *ngIf=\"filterable\"\n [value]=\"filter\"\n [clearButton]=\"true\"\n (valueChange)=\"filterChange.emit($event)\"\n [placeholder]=\"filterInputPlaceholder\"\n >\n <ng-template kendoTextBoxPrefixTemplate>\n <span class=\"k-icon k-i-search\"></span>\n </ng-template>\n </kendo-textbox>\n <ul class=\"k-treeview-lines\"\n kendoTreeViewGroup\n role=\"group\"\n [loadOnDemand]=\"loadOnDemand\"\n [checkboxes]=\"checkboxes\"\n [expandIcons]=\"expandIcons\"\n [selectable]=\"selectable\"\n [touchActions]=\"touchActions\"\n [children]=\"children\"\n [hasChildren]=\"hasChildren\"\n [isChecked]=\"isChecked\"\n [isDisabled]=\"isDisabled\"\n [isExpanded]=\"isExpanded\"\n [isSelected]=\"isSelected\"\n [isVisible]=\"isVisible\"\n [nodeTemplateRef]=\"nodeTemplateRef?.templateRef\"\n [loadMoreButtonTemplateRef]=\"loadMoreButtonTemplateRef?.templateRef\"\n [textField]=\"textField\"\n [nodes]=\"fetchNodes\"\n [loadMoreService]=\"loadMoreService\"\n [trackBy]=\"trackBy\"\n >\n </ul>\n <ng-container #assetsContainer></ng-container>\n "
|
|
1822
1833
|
}),
|
|
1823
1834
|
__metadata("design:paramtypes", [ElementRef,
|
|
1824
1835
|
ChangeDetectorRef,
|
|
@@ -2241,7 +2252,10 @@ var CheckDirective = /** @class */ (function () {
|
|
|
2241
2252
|
'multiple': function (e) { return _this.checkMultiple(e); },
|
|
2242
2253
|
'single': function (e) { return _this.checkSingle(e); }
|
|
2243
2254
|
};
|
|
2244
|
-
|
|
2255
|
+
/**
|
|
2256
|
+
* Reflectes the internal `checkedKeys` state.
|
|
2257
|
+
*/
|
|
2258
|
+
this.state = new Set();
|
|
2245
2259
|
this.subscriptions.add(this.treeView.checkedChange
|
|
2246
2260
|
.subscribe(function (e) { return _this.check(e); }));
|
|
2247
2261
|
var expandedItems = [];
|
|
@@ -2260,20 +2274,6 @@ var CheckDirective = /** @class */ (function () {
|
|
|
2260
2274
|
enumerable: true,
|
|
2261
2275
|
configurable: true
|
|
2262
2276
|
});
|
|
2263
|
-
Object.defineProperty(CheckDirective.prototype, "checkedKeys", {
|
|
2264
|
-
/**
|
|
2265
|
-
* Defines the collection that will store the checked keys
|
|
2266
|
-
* ([see example]({% slug checkboxes_treeview %})).
|
|
2267
|
-
*/
|
|
2268
|
-
get: function () {
|
|
2269
|
-
return this._checkedKeys;
|
|
2270
|
-
},
|
|
2271
|
-
set: function (keys) {
|
|
2272
|
-
this._checkedKeys = keys;
|
|
2273
|
-
},
|
|
2274
|
-
enumerable: true,
|
|
2275
|
-
configurable: true
|
|
2276
|
-
});
|
|
2277
2277
|
Object.defineProperty(CheckDirective.prototype, "options", {
|
|
2278
2278
|
get: function () {
|
|
2279
2279
|
var defaultOptions = {
|
|
@@ -2298,6 +2298,9 @@ var CheckDirective = /** @class */ (function () {
|
|
|
2298
2298
|
this.treeView.checkboxes = this.options.enabled;
|
|
2299
2299
|
this.toggleCheckOnClick();
|
|
2300
2300
|
}
|
|
2301
|
+
if (isChanged('checkedKeys', changes, false) && changes.checkedKeys.currentValue !== this.lastChange) {
|
|
2302
|
+
this.state = new Set(changes.checkedKeys.currentValue);
|
|
2303
|
+
}
|
|
2301
2304
|
};
|
|
2302
2305
|
CheckDirective.prototype.ngOnDestroy = function () {
|
|
2303
2306
|
this.subscriptions.unsubscribe();
|
|
@@ -2307,11 +2310,11 @@ var CheckDirective = /** @class */ (function () {
|
|
|
2307
2310
|
if (!this.checkKey) {
|
|
2308
2311
|
return this.isIndexChecked(index);
|
|
2309
2312
|
}
|
|
2310
|
-
var
|
|
2311
|
-
return
|
|
2313
|
+
var hasKey = this.state.has(this.itemKey({ dataItem: dataItem, index: index }));
|
|
2314
|
+
return hasKey ? 'checked' : 'none';
|
|
2312
2315
|
};
|
|
2313
2316
|
CheckDirective.prototype.isIndexChecked = function (index) {
|
|
2314
|
-
var checkedKeys = this.
|
|
2317
|
+
var checkedKeys = Array.from(this.state).filter(matchKey(index));
|
|
2315
2318
|
if (indexChecked(checkedKeys, index)) {
|
|
2316
2319
|
return 'checked';
|
|
2317
2320
|
}
|
|
@@ -2342,7 +2345,11 @@ var CheckDirective = /** @class */ (function () {
|
|
|
2342
2345
|
};
|
|
2343
2346
|
CheckDirective.prototype.checkSingle = function (node) {
|
|
2344
2347
|
var key = this.itemKey(node.item);
|
|
2345
|
-
|
|
2348
|
+
var hasKey = this.state.has(key);
|
|
2349
|
+
this.state.clear();
|
|
2350
|
+
if (!hasKey) {
|
|
2351
|
+
this.state.add(key);
|
|
2352
|
+
}
|
|
2346
2353
|
this.notify();
|
|
2347
2354
|
};
|
|
2348
2355
|
CheckDirective.prototype.checkMultiple = function (node) {
|
|
@@ -2379,7 +2386,6 @@ var CheckDirective = /** @class */ (function () {
|
|
|
2379
2386
|
if (!isPresent(currentKey)) {
|
|
2380
2387
|
return;
|
|
2381
2388
|
}
|
|
2382
|
-
var checkedKeys = new Set(this.checkedKeys);
|
|
2383
2389
|
var pendingCheck = [currentKey];
|
|
2384
2390
|
if (this.options.checkChildren) {
|
|
2385
2391
|
var descendants = fetchLoadedDescendants(node, function (_a) {
|
|
@@ -2393,63 +2399,59 @@ var CheckDirective = /** @class */ (function () {
|
|
|
2393
2399
|
});
|
|
2394
2400
|
pendingCheck.push.apply(pendingCheck, descendants);
|
|
2395
2401
|
}
|
|
2396
|
-
var shouldCheck = !
|
|
2402
|
+
var shouldCheck = !this.state.has(currentKey);
|
|
2397
2403
|
pendingCheck.forEach(function (key) {
|
|
2398
2404
|
if (shouldCheck) {
|
|
2399
|
-
|
|
2405
|
+
_this.state.add(key);
|
|
2400
2406
|
}
|
|
2401
2407
|
else {
|
|
2402
|
-
|
|
2408
|
+
_this.state.delete(key);
|
|
2403
2409
|
}
|
|
2404
2410
|
});
|
|
2405
|
-
this.checkedKeys = Array.from(checkedKeys);
|
|
2406
2411
|
};
|
|
2407
2412
|
CheckDirective.prototype.checkParents = function (parent) {
|
|
2408
2413
|
var _this = this;
|
|
2409
2414
|
if (!isPresent(parent)) {
|
|
2410
2415
|
return;
|
|
2411
2416
|
}
|
|
2412
|
-
var checkedKeys = new Set(this.checkedKeys);
|
|
2413
2417
|
var currentParent = parent;
|
|
2414
2418
|
while (currentParent) {
|
|
2415
2419
|
var parentKey = this.itemKey(currentParent.item);
|
|
2416
|
-
var allChildrenSelected = currentParent.children.every(function (item) { return
|
|
2420
|
+
var allChildrenSelected = currentParent.children.every(function (item) { return _this.state.has(_this.itemKey(item)); });
|
|
2417
2421
|
if (allChildrenSelected) {
|
|
2418
|
-
|
|
2422
|
+
this.state.add(parentKey);
|
|
2419
2423
|
}
|
|
2420
2424
|
else {
|
|
2421
|
-
|
|
2425
|
+
this.state.delete(parentKey);
|
|
2422
2426
|
}
|
|
2423
2427
|
currentParent = currentParent.parent;
|
|
2424
2428
|
}
|
|
2425
|
-
this.checkedKeys = Array.from(checkedKeys);
|
|
2426
2429
|
};
|
|
2427
2430
|
CheckDirective.prototype.notify = function () {
|
|
2428
|
-
this.
|
|
2431
|
+
this.lastChange = Array.from(this.state);
|
|
2432
|
+
this.checkedKeysChange.emit(this.lastChange);
|
|
2429
2433
|
};
|
|
2430
2434
|
CheckDirective.prototype.addCheckedItemsChildren = function (lookups) {
|
|
2431
2435
|
var _this = this;
|
|
2432
2436
|
if (!isPresent(lookups) || lookups.length === 0) {
|
|
2433
2437
|
return;
|
|
2434
2438
|
}
|
|
2435
|
-
var initiallyCheckedItemsCount = this.
|
|
2436
|
-
var checkedKeys = new Set(this.checkedKeys);
|
|
2439
|
+
var initiallyCheckedItemsCount = this.state.size;
|
|
2437
2440
|
lookups.forEach(function (lookup) {
|
|
2438
2441
|
var itemKey = _this.itemKey(lookup.item);
|
|
2439
|
-
if (!
|
|
2442
|
+
if (!_this.state.has(itemKey)) {
|
|
2440
2443
|
return;
|
|
2441
2444
|
}
|
|
2442
2445
|
lookup.children.forEach(function (item) {
|
|
2443
2446
|
// ensure both the parent item and each child node is enabled
|
|
2444
2447
|
if (!_this.treeView.isDisabled(lookup.item.dataItem, lookup.item.index) &&
|
|
2445
2448
|
!_this.treeView.isDisabled(item.dataItem, item.index)) {
|
|
2446
|
-
|
|
2449
|
+
_this.state.add(_this.itemKey(item));
|
|
2447
2450
|
}
|
|
2448
2451
|
});
|
|
2449
2452
|
});
|
|
2450
|
-
var hasNewlyCheckedItems = initiallyCheckedItemsCount !==
|
|
2453
|
+
var hasNewlyCheckedItems = initiallyCheckedItemsCount !== this.state.size;
|
|
2451
2454
|
if (hasNewlyCheckedItems) {
|
|
2452
|
-
this.checkedKeys = Array.from(checkedKeys);
|
|
2453
2455
|
this.zone.run(function () { return _this.notify(); });
|
|
2454
2456
|
}
|
|
2455
2457
|
};
|
|
@@ -2464,9 +2466,8 @@ var CheckDirective = /** @class */ (function () {
|
|
|
2464
2466
|
], CheckDirective.prototype, "checkKey", void 0);
|
|
2465
2467
|
__decorate([
|
|
2466
2468
|
Input(),
|
|
2467
|
-
__metadata("design:type", Array)
|
|
2468
|
-
|
|
2469
|
-
], CheckDirective.prototype, "checkedKeys", null);
|
|
2469
|
+
__metadata("design:type", Array)
|
|
2470
|
+
], CheckDirective.prototype, "checkedKeys", void 0);
|
|
2470
2471
|
__decorate([
|
|
2471
2472
|
Input('kendoTreeViewCheckable'),
|
|
2472
2473
|
__metadata("design:type", Object)
|
|
@@ -2571,8 +2572,11 @@ var ExpandDirective = /** @class */ (function () {
|
|
|
2571
2572
|
*/
|
|
2572
2573
|
this.expandedKeysChange = new EventEmitter();
|
|
2573
2574
|
this.subscriptions = new Subscription();
|
|
2574
|
-
|
|
2575
|
-
|
|
2575
|
+
/**
|
|
2576
|
+
* Reflectes the internal `expandedKeys` state.
|
|
2577
|
+
*/
|
|
2578
|
+
this.state = new Set();
|
|
2579
|
+
this.originalExpandedKeys = new Set();
|
|
2576
2580
|
this.isFiltered = false;
|
|
2577
2581
|
/**
|
|
2578
2582
|
* Fills array with the correct expand keys according to wrapper metadata.
|
|
@@ -2605,7 +2609,7 @@ var ExpandDirective = /** @class */ (function () {
|
|
|
2605
2609
|
this.subscriptions.add(this.component.filterStateChange.subscribe(this.handleAutoExpand.bind(this)));
|
|
2606
2610
|
}
|
|
2607
2611
|
this.component.isExpanded = function (dataItem, index) {
|
|
2608
|
-
return _this.
|
|
2612
|
+
return _this.state.has(_this.itemKey({ dataItem: dataItem, index: index }));
|
|
2609
2613
|
};
|
|
2610
2614
|
}
|
|
2611
2615
|
Object.defineProperty(ExpandDirective.prototype, "isExpanded", {
|
|
@@ -2626,19 +2630,11 @@ var ExpandDirective = /** @class */ (function () {
|
|
|
2626
2630
|
enumerable: true,
|
|
2627
2631
|
configurable: true
|
|
2628
2632
|
});
|
|
2629
|
-
|
|
2630
|
-
|
|
2631
|
-
|
|
2632
|
-
|
|
2633
|
-
|
|
2634
|
-
return this._expandedKeys;
|
|
2635
|
-
},
|
|
2636
|
-
set: function (keys) {
|
|
2637
|
-
this._expandedKeys = keys;
|
|
2638
|
-
},
|
|
2639
|
-
enumerable: true,
|
|
2640
|
-
configurable: true
|
|
2641
|
-
});
|
|
2633
|
+
ExpandDirective.prototype.ngOnChanges = function (changes) {
|
|
2634
|
+
if (isChanged('expandedKeys', changes, false) && changes.expandedKeys.currentValue !== this.lastChange) {
|
|
2635
|
+
this.state = new Set(changes.expandedKeys.currentValue);
|
|
2636
|
+
}
|
|
2637
|
+
};
|
|
2642
2638
|
ExpandDirective.prototype.ngOnDestroy = function () {
|
|
2643
2639
|
this.subscriptions.unsubscribe();
|
|
2644
2640
|
};
|
|
@@ -2658,19 +2654,19 @@ var ExpandDirective = /** @class */ (function () {
|
|
|
2658
2654
|
};
|
|
2659
2655
|
ExpandDirective.prototype.toggleExpand = function (_a) {
|
|
2660
2656
|
var index = _a.index, dataItem = _a.dataItem, expand = _a.expand;
|
|
2661
|
-
var
|
|
2662
|
-
var
|
|
2657
|
+
var key = this.itemKey({ index: index, dataItem: dataItem });
|
|
2658
|
+
var isExpanded = this.state.has(key);
|
|
2663
2659
|
var notify = false;
|
|
2664
|
-
if (
|
|
2665
|
-
this.
|
|
2660
|
+
if (isExpanded && !expand) {
|
|
2661
|
+
this.state.delete(key);
|
|
2666
2662
|
notify = true;
|
|
2667
2663
|
}
|
|
2668
|
-
else if (
|
|
2669
|
-
this.
|
|
2664
|
+
else if (!isExpanded && expand) {
|
|
2665
|
+
this.state.add(key);
|
|
2670
2666
|
notify = true;
|
|
2671
2667
|
}
|
|
2672
2668
|
if (notify) {
|
|
2673
|
-
this.
|
|
2669
|
+
this.notify();
|
|
2674
2670
|
}
|
|
2675
2671
|
};
|
|
2676
2672
|
ExpandDirective.prototype.handleAutoExpand = function (_a) {
|
|
@@ -2681,7 +2677,7 @@ var ExpandDirective = /** @class */ (function () {
|
|
|
2681
2677
|
}
|
|
2682
2678
|
var _b = this.filterExpandSettings, maxAutoExpandResults = _b.maxAutoExpandResults, autoExpandMatches = _b.expandMatches, expandedOnClear = _b.expandedOnClear;
|
|
2683
2679
|
if (!this.isFiltered) {
|
|
2684
|
-
this.originalExpandedKeys = this.
|
|
2680
|
+
this.originalExpandedKeys = new Set(this.state);
|
|
2685
2681
|
}
|
|
2686
2682
|
var exitingFilteredState = this.isFiltered && !term;
|
|
2687
2683
|
var maxExceeded = maxAutoExpandResults !== -1 && matchCount > maxAutoExpandResults;
|
|
@@ -2689,18 +2685,18 @@ var ExpandDirective = /** @class */ (function () {
|
|
|
2689
2685
|
if (exitAutoExpandedState) {
|
|
2690
2686
|
switch (expandedOnClear) {
|
|
2691
2687
|
case "initial": {
|
|
2692
|
-
if (!sameValues(this.
|
|
2693
|
-
this.
|
|
2694
|
-
this.
|
|
2688
|
+
if (!sameValues(this.state, this.originalExpandedKeys)) {
|
|
2689
|
+
this.state = this.originalExpandedKeys;
|
|
2690
|
+
this.notify();
|
|
2695
2691
|
}
|
|
2696
2692
|
break;
|
|
2697
2693
|
}
|
|
2698
2694
|
case "all": {
|
|
2699
|
-
this.
|
|
2695
|
+
this.state = new Set(nodes.reduce(function (acc, rootNode) {
|
|
2700
2696
|
_this.getEveryExpandKey(acc, rootNode);
|
|
2701
2697
|
return acc;
|
|
2702
|
-
}, []);
|
|
2703
|
-
this.
|
|
2698
|
+
}, []));
|
|
2699
|
+
this.notify();
|
|
2704
2700
|
break;
|
|
2705
2701
|
}
|
|
2706
2702
|
case "unchanged": {
|
|
@@ -2708,9 +2704,9 @@ var ExpandDirective = /** @class */ (function () {
|
|
|
2708
2704
|
}
|
|
2709
2705
|
case "none":
|
|
2710
2706
|
default: {
|
|
2711
|
-
if (this.
|
|
2712
|
-
this.
|
|
2713
|
-
this.
|
|
2707
|
+
if (this.state.size !== 0) {
|
|
2708
|
+
this.state.clear();
|
|
2709
|
+
this.notify();
|
|
2714
2710
|
}
|
|
2715
2711
|
break;
|
|
2716
2712
|
}
|
|
@@ -2718,16 +2714,20 @@ var ExpandDirective = /** @class */ (function () {
|
|
|
2718
2714
|
this.isFiltered = false;
|
|
2719
2715
|
return;
|
|
2720
2716
|
}
|
|
2721
|
-
var indicesToExpand = nodes.reduce(function (acc, rootNode) {
|
|
2717
|
+
var indicesToExpand = new Set(nodes.reduce(function (acc, rootNode) {
|
|
2722
2718
|
_this.updateExpandedNodes(acc, rootNode, autoExpandMatches);
|
|
2723
2719
|
return acc;
|
|
2724
|
-
}, []);
|
|
2725
|
-
if (!sameValues(this.
|
|
2726
|
-
this.
|
|
2727
|
-
this.
|
|
2720
|
+
}, []));
|
|
2721
|
+
if (!sameValues(this.state, indicesToExpand)) {
|
|
2722
|
+
this.state = indicesToExpand;
|
|
2723
|
+
this.notify();
|
|
2728
2724
|
}
|
|
2729
2725
|
this.isFiltered = true;
|
|
2730
2726
|
};
|
|
2727
|
+
ExpandDirective.prototype.notify = function () {
|
|
2728
|
+
this.lastChange = Array.from(this.state);
|
|
2729
|
+
this.expandedKeysChange.emit(this.lastChange);
|
|
2730
|
+
};
|
|
2731
2731
|
__decorate([
|
|
2732
2732
|
Input(),
|
|
2733
2733
|
__metadata("design:type", Function),
|
|
@@ -2747,9 +2747,8 @@ var ExpandDirective = /** @class */ (function () {
|
|
|
2747
2747
|
], ExpandDirective.prototype, "expandedKeysChange", void 0);
|
|
2748
2748
|
__decorate([
|
|
2749
2749
|
Input(),
|
|
2750
|
-
__metadata("design:type", Array)
|
|
2751
|
-
|
|
2752
|
-
], ExpandDirective.prototype, "expandedKeys", null);
|
|
2750
|
+
__metadata("design:type", Array)
|
|
2751
|
+
], ExpandDirective.prototype, "expandedKeys", void 0);
|
|
2753
2752
|
ExpandDirective = __decorate([
|
|
2754
2753
|
Directive({ selector: '[kendoTreeViewExpandable]' }),
|
|
2755
2754
|
__metadata("design:paramtypes", [ExpandableComponent])
|
|
@@ -2774,9 +2773,12 @@ var SelectDirective = /** @class */ (function () {
|
|
|
2774
2773
|
'multiple': function (e) { return _this.selectMultiple(e); },
|
|
2775
2774
|
'single': function (e) { return _this.selectSingle(e); }
|
|
2776
2775
|
};
|
|
2777
|
-
|
|
2776
|
+
/**
|
|
2777
|
+
* Reflectes the internal `selectedKeys` state.
|
|
2778
|
+
*/
|
|
2779
|
+
this.state = new Set();
|
|
2778
2780
|
this.subscriptions.add(this.treeView.selectionChange.subscribe(this.select.bind(this)));
|
|
2779
|
-
this.treeView.isSelected = function (dataItem, index) { return (_this.
|
|
2781
|
+
this.treeView.isSelected = function (dataItem, index) { return (_this.state.has(_this.itemKey({ dataItem: dataItem, index: index }))); };
|
|
2780
2782
|
}
|
|
2781
2783
|
Object.defineProperty(SelectDirective.prototype, "isSelected", {
|
|
2782
2784
|
/**
|
|
@@ -2788,20 +2790,6 @@ var SelectDirective = /** @class */ (function () {
|
|
|
2788
2790
|
enumerable: true,
|
|
2789
2791
|
configurable: true
|
|
2790
2792
|
});
|
|
2791
|
-
Object.defineProperty(SelectDirective.prototype, "selectedKeys", {
|
|
2792
|
-
/**
|
|
2793
|
-
* Defines the collection that will store the selected keys
|
|
2794
|
-
* ([see example]({% slug selection_treeview %}#toc-selection-modes)).
|
|
2795
|
-
*/
|
|
2796
|
-
get: function () {
|
|
2797
|
-
return this._selectedKeys;
|
|
2798
|
-
},
|
|
2799
|
-
set: function (keys) {
|
|
2800
|
-
this._selectedKeys = keys;
|
|
2801
|
-
},
|
|
2802
|
-
enumerable: true,
|
|
2803
|
-
configurable: true
|
|
2804
|
-
});
|
|
2805
2793
|
Object.defineProperty(SelectDirective.prototype, "getAriaMultiselectable", {
|
|
2806
2794
|
get: function () {
|
|
2807
2795
|
return this.options.mode === 'multiple';
|
|
@@ -2824,6 +2812,11 @@ var SelectDirective = /** @class */ (function () {
|
|
|
2824
2812
|
enumerable: true,
|
|
2825
2813
|
configurable: true
|
|
2826
2814
|
});
|
|
2815
|
+
SelectDirective.prototype.ngOnChanges = function (changes) {
|
|
2816
|
+
if (isChanged('selectedKeys', changes, false) && changes.selectedKeys.currentValue !== this.lastChange) {
|
|
2817
|
+
this.state = new Set(changes.selectedKeys.currentValue);
|
|
2818
|
+
}
|
|
2819
|
+
};
|
|
2827
2820
|
SelectDirective.prototype.ngOnDestroy = function () {
|
|
2828
2821
|
this.subscriptions.unsubscribe();
|
|
2829
2822
|
};
|
|
@@ -2848,29 +2841,29 @@ var SelectDirective = /** @class */ (function () {
|
|
|
2848
2841
|
};
|
|
2849
2842
|
SelectDirective.prototype.selectSingle = function (node) {
|
|
2850
2843
|
var key = this.itemKey(node);
|
|
2851
|
-
if (this.
|
|
2852
|
-
|
|
2844
|
+
if (!this.state.has(key)) {
|
|
2845
|
+
this.state.clear();
|
|
2846
|
+
this.state.add(key);
|
|
2847
|
+
this.notify();
|
|
2853
2848
|
}
|
|
2854
|
-
this.selectedKeys = [key];
|
|
2855
|
-
this.notify();
|
|
2856
2849
|
};
|
|
2857
2850
|
SelectDirective.prototype.selectMultiple = function (node) {
|
|
2858
2851
|
var key = this.itemKey(node);
|
|
2859
|
-
var
|
|
2860
|
-
var isSelected = idx > -1;
|
|
2852
|
+
var isSelected = this.state.has(key);
|
|
2861
2853
|
if (!isPresent(key)) {
|
|
2862
2854
|
return;
|
|
2863
2855
|
}
|
|
2864
2856
|
if (isSelected) {
|
|
2865
|
-
this.
|
|
2857
|
+
this.state.delete(key);
|
|
2866
2858
|
}
|
|
2867
2859
|
else {
|
|
2868
|
-
this.
|
|
2860
|
+
this.state.add(key);
|
|
2869
2861
|
}
|
|
2870
2862
|
this.notify();
|
|
2871
2863
|
};
|
|
2872
2864
|
SelectDirective.prototype.notify = function () {
|
|
2873
|
-
this.
|
|
2865
|
+
this.lastChange = Array.from(this.state);
|
|
2866
|
+
this.selectedKeysChange.emit(this.lastChange);
|
|
2874
2867
|
};
|
|
2875
2868
|
__decorate([
|
|
2876
2869
|
Input(),
|
|
@@ -2887,9 +2880,8 @@ var SelectDirective = /** @class */ (function () {
|
|
|
2887
2880
|
], SelectDirective.prototype, "selection", void 0);
|
|
2888
2881
|
__decorate([
|
|
2889
2882
|
Input(),
|
|
2890
|
-
__metadata("design:type", Array)
|
|
2891
|
-
|
|
2892
|
-
], SelectDirective.prototype, "selectedKeys", null);
|
|
2883
|
+
__metadata("design:type", Array)
|
|
2884
|
+
], SelectDirective.prototype, "selectedKeys", void 0);
|
|
2893
2885
|
__decorate([
|
|
2894
2886
|
Output(),
|
|
2895
2887
|
__metadata("design:type", EventEmitter)
|