ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
1,372 lines (1,369 loc) • 58.5 kB
JavaScript
import { CommonModule } from '@angular/common';
import { TemplateRef, Component, ChangeDetectionStrategy, NgZone, Renderer2, ElementRef, ChangeDetectorRef, Host, Optional, ViewChild, Input, HostListener, Injectable, EventEmitter, SkipSelf, forwardRef, ContentChild, Output, NgModule } from '@angular/core';
import { warnDeprecation, treeCollapseMotion, NzTreeBaseService, NzNoAnimationDirective, InputBoolean, toBoolean, isNotNil, NzTreeHigherOrderServiceToken, NzConfigService, WithConfig, NzTreeBase, NzAddOnModule, NzNoAnimationModule, NzHighlightModule } from 'ng-zorro-antd/core';
import { NzIconModule } from 'ng-zorro-antd/icon';
import { __decorate, __metadata, __extends } from 'tslib';
import { Subject, fromEvent, ReplaySubject } from 'rxjs';
import { takeUntil, filter } from 'rxjs/operators';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NzTreeNodeComponent = /** @class */ (function () {
function NzTreeNodeComponent(nzTreeService, ngZone, renderer, elRef, cdr, noAnimation) {
this.nzTreeService = nzTreeService;
this.ngZone = ngZone;
this.renderer = renderer;
this.elRef = elRef;
this.cdr = cdr;
this.noAnimation = noAnimation;
this.nzHideUnMatched = false;
this.nzNoAnimation = false;
this.nzSelectMode = false;
this.nzShowIcon = false;
this.nzSearchValue = '';
// default var
this.prefixCls = 'ant-tree';
this.nzNodeClass = {};
this.nzNodeSwitcherClass = {};
this.nzNodeContentClass = {};
this.nzNodeCheckboxClass = {};
this.nzNodeContentIconClass = {};
this.nzNodeContentLoadingClass = {};
/**
* drag var
*/
this.destroy$ = new Subject();
this.dragPos = 2;
this.dragPosClass = {
'0': 'drag-over',
'1': 'drag-over-gap-bottom',
'-1': 'drag-over-gap-top'
};
/**
* default set
*/
this._nzDraggable = false;
this._nzExpandAll = false;
}
Object.defineProperty(NzTreeNodeComponent.prototype, "nzDraggable", {
get: /**
* @return {?}
*/
function () {
return this._nzDraggable;
},
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this._nzDraggable = value;
this.handDragEvent();
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeNodeComponent.prototype, "nzDefaultExpandAll", {
get: /**
* @return {?}
*/
function () {
return this._nzExpandAll;
},
/**
* @deprecated use `nzExpandAll` instead.
*/
set: /**
* @deprecated use `nzExpandAll` instead.
* @param {?} value
* @return {?}
*/
function (value) {
warnDeprecation("'nzDefaultExpandAll' is going to be removed in 9.0.0. Please use 'nzExpandAll' instead.");
this._nzExpandAll = value;
if (value && this.nzTreeNode && !this.nzTreeNode.isLeaf) {
this.nzTreeNode.isExpanded = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeNodeComponent.prototype, "nzExpandAll", {
get: /**
* @return {?}
*/
function () {
return this._nzExpandAll;
},
// default set
set:
// default set
/**
* @param {?} value
* @return {?}
*/
function (value) {
this._nzExpandAll = value;
if (value && this.nzTreeNode && !this.nzTreeNode.isLeaf) {
this.nzTreeNode.isExpanded = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeNodeComponent.prototype, "nzIcon", {
get: /**
* @return {?}
*/
function () {
return this.nzTreeNode.icon;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeNodeComponent.prototype, "canDraggable", {
get: /**
* @return {?}
*/
function () {
return this.nzDraggable && !this.nzTreeNode.isDisabled ? true : null;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeNodeComponent.prototype, "isShowLineIcon", {
get: /**
* @return {?}
*/
function () {
return !this.nzTreeNode.isLeaf && this.nzShowLine;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeNodeComponent.prototype, "isShowSwitchIcon", {
get: /**
* @return {?}
*/
function () {
return !this.nzTreeNode.isLeaf && !this.nzShowLine;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeNodeComponent.prototype, "isSwitcherOpen", {
get: /**
* @return {?}
*/
function () {
return this.nzTreeNode.isExpanded && !this.nzTreeNode.isLeaf;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeNodeComponent.prototype, "isSwitcherClose", {
get: /**
* @return {?}
*/
function () {
return !this.nzTreeNode.isExpanded && !this.nzTreeNode.isLeaf;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeNodeComponent.prototype, "displayStyle", {
get: /**
* @return {?}
*/
function () {
// to hide unmatched nodes
return this.nzSearchValue &&
this.nzHideUnMatched &&
!this.nzTreeNode.isMatched &&
!this.nzTreeNode.isExpanded &&
this.nzTreeNode.canHide
? 'none'
: '';
},
enumerable: true,
configurable: true
});
/**
* reset node class
*/
/**
* reset node class
* @return {?}
*/
NzTreeNodeComponent.prototype.setClassMap = /**
* reset node class
* @return {?}
*/
function () {
var _a, _b, _c, _d, _e, _f;
this.prefixCls = this.nzSelectMode ? 'ant-select-tree' : 'ant-tree';
this.nzNodeClass = (_a = {},
_a[this.prefixCls + "-treenode-disabled"] = this.nzTreeNode.isDisabled,
_a[this.prefixCls + "-treenode-switcher-open"] = this.isSwitcherOpen,
_a[this.prefixCls + "-treenode-switcher-close"] = this.isSwitcherClose,
_a[this.prefixCls + "-treenode-checkbox-checked"] = this.nzTreeNode.isChecked,
_a[this.prefixCls + "-treenode-checkbox-indeterminate"] = this.nzTreeNode.isHalfChecked,
_a[this.prefixCls + "-treenode-selected"] = this.nzTreeNode.isSelected,
_a[this.prefixCls + "-treenode-loading"] = this.nzTreeNode.isLoading,
_a);
this.nzNodeSwitcherClass = (_b = {},
_b[this.prefixCls + "-switcher"] = true,
_b[this.prefixCls + "-switcher-noop"] = this.nzTreeNode.isLeaf,
_b[this.prefixCls + "-switcher_open"] = this.isSwitcherOpen,
_b[this.prefixCls + "-switcher_close"] = this.isSwitcherClose,
_b);
this.nzNodeCheckboxClass = (_c = {},
_c[this.prefixCls + "-checkbox"] = true,
_c[this.prefixCls + "-checkbox-checked"] = this.nzTreeNode.isChecked,
_c[this.prefixCls + "-checkbox-indeterminate"] = this.nzTreeNode.isHalfChecked,
_c[this.prefixCls + "-checkbox-disabled"] = this.nzTreeNode.isDisabled || this.nzTreeNode.isDisableCheckbox,
_c);
this.nzNodeContentClass = (_d = {},
_d[this.prefixCls + "-node-content-wrapper"] = true,
_d[this.prefixCls + "-node-content-wrapper-open"] = this.isSwitcherOpen,
_d[this.prefixCls + "-node-content-wrapper-close"] = this.isSwitcherClose,
_d[this.prefixCls + "-node-selected"] = this.nzTreeNode.isSelected,
_d);
this.nzNodeContentIconClass = (_e = {},
_e[this.prefixCls + "-iconEle"] = true,
_e[this.prefixCls + "-icon__customize"] = true,
_e);
this.nzNodeContentLoadingClass = (_f = {},
_f[this.prefixCls + "-iconEle"] = true,
_f);
};
/**
* @param {?} event
* @return {?}
*/
NzTreeNodeComponent.prototype.onMousedown = /**
* @param {?} event
* @return {?}
*/
function (event) {
if (this.nzSelectMode) {
event.preventDefault();
}
};
/**
* click node to select, 200ms to dbl click
*/
/**
* click node to select, 200ms to dbl click
* @param {?} event
* @return {?}
*/
NzTreeNodeComponent.prototype.nzClick = /**
* click node to select, 200ms to dbl click
* @param {?} event
* @return {?}
*/
function (event) {
event.preventDefault();
event.stopPropagation();
if (this.nzTreeNode.isSelectable && !this.nzTreeNode.isDisabled) {
this.nzTreeNode.isSelected = !this.nzTreeNode.isSelected;
}
/** @type {?} */
var eventNext = this.nzTreeService.formatEvent('click', this.nzTreeNode, event);
(/** @type {?} */ ((/** @type {?} */ (this.nzTreeService)).triggerEventChange$)).next(eventNext);
};
/**
* @param {?} event
* @return {?}
*/
NzTreeNodeComponent.prototype.nzDblClick = /**
* @param {?} event
* @return {?}
*/
function (event) {
event.preventDefault();
event.stopPropagation();
/** @type {?} */
var eventNext = this.nzTreeService.formatEvent('dblclick', this.nzTreeNode, event);
(/** @type {?} */ ((/** @type {?} */ (this.nzTreeService)).triggerEventChange$)).next(eventNext);
};
/**
* @param event
*/
/**
* @param {?} event
* @return {?}
*/
NzTreeNodeComponent.prototype.nzContextMenu = /**
* @param {?} event
* @return {?}
*/
function (event) {
event.preventDefault();
event.stopPropagation();
/** @type {?} */
var eventNext = this.nzTreeService.formatEvent('contextmenu', this.nzTreeNode, event);
(/** @type {?} */ ((/** @type {?} */ (this.nzTreeService)).triggerEventChange$)).next(eventNext);
};
/**
* collapse node
* @param event
*/
/**
* collapse node
* @param {?} event
* @return {?}
*/
NzTreeNodeComponent.prototype._clickExpand = /**
* collapse node
* @param {?} event
* @return {?}
*/
function (event) {
event.preventDefault();
event.stopPropagation();
if (!this.nzTreeNode.isLoading && !this.nzTreeNode.isLeaf) {
// set async state
if (this.nzAsyncData && this.nzTreeNode.children.length === 0 && !this.nzTreeNode.isExpanded) {
this.nzTreeNode.isLoading = true;
}
this.nzTreeNode.isExpanded = !this.nzTreeNode.isExpanded;
if (this.nzTreeNode.isMatched) {
this.setDisplayForParentNodes(this.nzTreeNode);
}
this.setDisplayForChildNodes(this.nzTreeNode);
/** @type {?} */
var eventNext = this.nzTreeService.formatEvent('expand', this.nzTreeNode, event);
(/** @type {?} */ ((/** @type {?} */ (this.nzTreeService)).triggerEventChange$)).next(eventNext);
}
};
/**
* @private
* @param {?} parentNode
* @return {?}
*/
NzTreeNodeComponent.prototype.setDisplayForChildNodes = /**
* @private
* @param {?} parentNode
* @return {?}
*/
function (parentNode) {
var _this = this;
var children = parentNode.children;
if (children.length > 0) {
children.map((/**
* @param {?} node
* @return {?}
*/
function (node) {
/** @type {?} */
var canHide = !node.isMatched;
node.canHide = canHide;
_this.setDisplayForChildNodes(node);
}));
}
};
/**
* @private
* @param {?} targetNode
* @return {?}
*/
NzTreeNodeComponent.prototype.setDisplayForParentNodes = /**
* @private
* @param {?} targetNode
* @return {?}
*/
function (targetNode) {
/** @type {?} */
var parentNode = targetNode.getParentNode();
if (parentNode) {
parentNode.canHide = false;
this.setDisplayForParentNodes(parentNode);
}
};
/**
* check node
* @param event
*/
/**
* check node
* @param {?} event
* @return {?}
*/
NzTreeNodeComponent.prototype._clickCheckBox = /**
* check node
* @param {?} event
* @return {?}
*/
function (event) {
event.preventDefault();
event.stopPropagation();
// return if node is disabled
if (this.nzTreeNode.isDisabled || this.nzTreeNode.isDisableCheckbox) {
return;
}
this.nzTreeNode.isChecked = !this.nzTreeNode.isChecked;
this.nzTreeNode.isHalfChecked = false;
if (!this.nzTreeService.isCheckStrictly) {
this.nzTreeService.conduct(this.nzTreeNode);
}
/** @type {?} */
var eventNext = this.nzTreeService.formatEvent('check', this.nzTreeNode, event);
(/** @type {?} */ ((/** @type {?} */ (this.nzTreeService)).triggerEventChange$)).next(eventNext);
};
/**
* drag event
* @param e
*/
/**
* drag event
* @return {?}
*/
NzTreeNodeComponent.prototype.clearDragClass = /**
* drag event
* @return {?}
*/
function () {
var _this = this;
/** @type {?} */
var dragClass = ['drag-over-gap-top', 'drag-over-gap-bottom', 'drag-over'];
dragClass.forEach((/**
* @param {?} e
* @return {?}
*/
function (e) {
_this.renderer.removeClass(_this.dragElement.nativeElement, e);
}));
};
/**
* @param {?} e
* @return {?}
*/
NzTreeNodeComponent.prototype.handleDragStart = /**
* @param {?} e
* @return {?}
*/
function (e) {
e.stopPropagation();
try {
// ie throw error
// firefox-need-it
(/** @type {?} */ (e.dataTransfer)).setData('text/plain', (/** @type {?} */ (this.nzTreeNode.key)));
}
catch (error) {
// empty
}
this.nzTreeService.setSelectedNode(this.nzTreeNode);
this.nzTreeNode.isExpanded = false;
/** @type {?} */
var eventNext = this.nzTreeService.formatEvent('dragstart', this.nzTreeNode, e);
(/** @type {?} */ ((/** @type {?} */ (this.nzTreeService)).triggerEventChange$)).next(eventNext);
};
/**
* @param {?} e
* @return {?}
*/
NzTreeNodeComponent.prototype.handleDragEnter = /**
* @param {?} e
* @return {?}
*/
function (e) {
var _this = this;
e.preventDefault();
e.stopPropagation();
// reset position
this.dragPos = 2;
this.ngZone.run((/**
* @return {?}
*/
function () {
/** @type {?} */
var node = _this.nzTreeService.getSelectedNode();
if (node && node.key !== _this.nzTreeNode.key && !_this.nzTreeNode.isExpanded && !_this.nzTreeNode.isLeaf) {
_this.nzTreeNode.isExpanded = true;
}
/** @type {?} */
var eventNext = _this.nzTreeService.formatEvent('dragenter', _this.nzTreeNode, e);
(/** @type {?} */ ((/** @type {?} */ (_this.nzTreeService)).triggerEventChange$)).next(eventNext);
}));
};
/**
* @param {?} e
* @return {?}
*/
NzTreeNodeComponent.prototype.handleDragOver = /**
* @param {?} e
* @return {?}
*/
function (e) {
e.preventDefault();
e.stopPropagation();
/** @type {?} */
var dropPosition = this.nzTreeService.calcDropPosition(e);
if (this.dragPos !== dropPosition) {
this.clearDragClass();
this.dragPos = dropPosition;
// leaf node will pass
if (!(this.dragPos === 0 && this.nzTreeNode.isLeaf)) {
this.renderer.addClass(this.dragElement.nativeElement, this.dragPosClass[this.dragPos]);
}
}
/** @type {?} */
var eventNext = this.nzTreeService.formatEvent('dragover', this.nzTreeNode, e);
(/** @type {?} */ ((/** @type {?} */ (this.nzTreeService)).triggerEventChange$)).next(eventNext);
};
/**
* @param {?} e
* @return {?}
*/
NzTreeNodeComponent.prototype.handleDragLeave = /**
* @param {?} e
* @return {?}
*/
function (e) {
var _this = this;
e.stopPropagation();
this.ngZone.run((/**
* @return {?}
*/
function () {
_this.clearDragClass();
}));
/** @type {?} */
var eventNext = this.nzTreeService.formatEvent('dragleave', this.nzTreeNode, e);
(/** @type {?} */ ((/** @type {?} */ (this.nzTreeService)).triggerEventChange$)).next(eventNext);
};
/**
* @param {?} e
* @return {?}
*/
NzTreeNodeComponent.prototype.handleDragDrop = /**
* @param {?} e
* @return {?}
*/
function (e) {
var _this = this;
e.preventDefault();
e.stopPropagation();
this.ngZone.run((/**
* @return {?}
*/
function () {
_this.clearDragClass();
/** @type {?} */
var node = _this.nzTreeService.getSelectedNode();
if (!node || (node && node.key === _this.nzTreeNode.key) || (_this.dragPos === 0 && _this.nzTreeNode.isLeaf)) {
return;
}
// pass if node is leafNo
/** @type {?} */
var dropEvent = _this.nzTreeService.formatEvent('drop', _this.nzTreeNode, e);
/** @type {?} */
var dragEndEvent = _this.nzTreeService.formatEvent('dragend', _this.nzTreeNode, e);
if (_this.nzBeforeDrop) {
_this.nzBeforeDrop({
dragNode: (/** @type {?} */ (_this.nzTreeService.getSelectedNode())),
node: _this.nzTreeNode,
pos: _this.dragPos
}).subscribe((/**
* @param {?} canDrop
* @return {?}
*/
function (canDrop) {
if (canDrop) {
_this.nzTreeService.dropAndApply(_this.nzTreeNode, _this.dragPos);
}
(/** @type {?} */ ((/** @type {?} */ (_this.nzTreeService)).triggerEventChange$)).next(dropEvent);
(/** @type {?} */ ((/** @type {?} */ (_this.nzTreeService)).triggerEventChange$)).next(dragEndEvent);
}));
}
else if (_this.nzTreeNode) {
_this.nzTreeService.dropAndApply(_this.nzTreeNode, _this.dragPos);
(/** @type {?} */ ((/** @type {?} */ (_this.nzTreeService)).triggerEventChange$)).next(dropEvent);
}
}));
};
/**
* @param {?} e
* @return {?}
*/
NzTreeNodeComponent.prototype.handleDragEnd = /**
* @param {?} e
* @return {?}
*/
function (e) {
var _this = this;
e.stopPropagation();
this.ngZone.run((/**
* @return {?}
*/
function () {
// if user do not custom beforeDrop
if (!_this.nzBeforeDrop) {
/** @type {?} */
var eventNext = _this.nzTreeService.formatEvent('dragend', _this.nzTreeNode, e);
(/** @type {?} */ ((/** @type {?} */ (_this.nzTreeService)).triggerEventChange$)).next(eventNext);
}
}));
};
/**
* Listening to dragging events.
*/
/**
* Listening to dragging events.
* @return {?}
*/
NzTreeNodeComponent.prototype.handDragEvent = /**
* Listening to dragging events.
* @return {?}
*/
function () {
var _this = this;
this.ngZone.runOutsideAngular((/**
* @return {?}
*/
function () {
if (_this.nzDraggable) {
_this.destroy$ = new Subject();
fromEvent(_this.elRef.nativeElement, 'dragstart')
.pipe(takeUntil(_this.destroy$))
.subscribe((/**
* @param {?} e
* @return {?}
*/
function (e) { return _this.handleDragStart(e); }));
fromEvent(_this.elRef.nativeElement, 'dragenter')
.pipe(takeUntil(_this.destroy$))
.subscribe((/**
* @param {?} e
* @return {?}
*/
function (e) { return _this.handleDragEnter(e); }));
fromEvent(_this.elRef.nativeElement, 'dragover')
.pipe(takeUntil(_this.destroy$))
.subscribe((/**
* @param {?} e
* @return {?}
*/
function (e) { return _this.handleDragOver(e); }));
fromEvent(_this.elRef.nativeElement, 'dragleave')
.pipe(takeUntil(_this.destroy$))
.subscribe((/**
* @param {?} e
* @return {?}
*/
function (e) { return _this.handleDragLeave(e); }));
fromEvent(_this.elRef.nativeElement, 'drop')
.pipe(takeUntil(_this.destroy$))
.subscribe((/**
* @param {?} e
* @return {?}
*/
function (e) { return _this.handleDragDrop(e); }));
fromEvent(_this.elRef.nativeElement, 'dragend')
.pipe(takeUntil(_this.destroy$))
.subscribe((/**
* @param {?} e
* @return {?}
*/
function (e) { return _this.handleDragEnd(e); }));
}
else {
_this.destroy$.next();
_this.destroy$.complete();
}
}));
};
/**
* @param {?} value
* @return {?}
*/
NzTreeNodeComponent.prototype.isTemplateRef = /**
* @param {?} value
* @return {?}
*/
function (value) {
return value instanceof TemplateRef;
};
/**
* @return {?}
*/
NzTreeNodeComponent.prototype.markForCheck = /**
* @return {?}
*/
function () {
this.cdr.markForCheck();
};
/**
* @return {?}
*/
NzTreeNodeComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var _this = this;
// init expanded / selected / checked list
if (this.nzTreeNode.isSelected) {
this.nzTreeService.setNodeActive(this.nzTreeNode);
}
if (this.nzTreeNode.isExpanded) {
this.nzTreeService.setExpandedNodeList(this.nzTreeNode);
}
if (this.nzTreeNode.isChecked) {
this.nzTreeService.setCheckedNodeList(this.nzTreeNode);
}
// TODO
this.nzTreeNode.component = this;
this.nzTreeService
.eventTriggerChanged()
.pipe(filter((/**
* @param {?} data
* @return {?}
*/
function (data) { return (/** @type {?} */ (data.node)).key === _this.nzTreeNode.key; })), takeUntil(this.destroy$))
.subscribe((/**
* @return {?}
*/
function () {
_this.setClassMap();
_this.markForCheck();
}));
this.setClassMap();
};
/**
* @return {?}
*/
NzTreeNodeComponent.prototype.ngOnChanges = /**
* @return {?}
*/
function () {
this.setClassMap();
};
/**
* @return {?}
*/
NzTreeNodeComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.destroy$.next();
this.destroy$.complete();
};
NzTreeNodeComponent.decorators = [
{ type: Component, args: [{
selector: 'nz-tree-node',
exportAs: 'nzTreeNode',
template: "<li\n #dragElement\n role=\"treeitem\"\n [style.display]=\"displayStyle\"\n [ngClass]=\"nzNodeClass\">\n <ng-container *ngIf=\"nzShowExpand\">\n <span\n [ngClass]=\"nzNodeSwitcherClass\"\n (click)=\"_clickExpand($event)\">\n <ng-container *ngIf=\"isShowSwitchIcon\">\n <ng-container *ngIf=\"!nzTreeNode.isLoading\">\n <ng-template\n *ngIf=\"isTemplateRef(nzExpandedIcon)\"\n [ngTemplateOutlet]=\"nzExpandedIcon\"\n [ngTemplateOutletContext]=\"{ $implicit: nzTreeNode }\">\n </ng-template>\n <i\n *ngIf=\"!isTemplateRef(nzExpandedIcon)\"\n nz-icon\n nzType=\"caret-down\"\n [class.ant-select-switcher-icon]=\"nzSelectMode\"\n [class.ant-tree-switcher-icon]=\"!nzSelectMode\">\n </i>\n </ng-container>\n <i *ngIf=\"nzTreeNode.isLoading\" nz-icon nzType=\"loading\" [nzSpin]=\"true\" class=\"ant-tree-switcher-loading-icon\"></i>\n </ng-container>\n <ng-container *ngIf=\"nzShowLine\">\n <ng-template\n *ngIf=\"isTemplateRef(nzExpandedIcon)\"\n [ngTemplateOutlet]=\"nzExpandedIcon\"\n [ngTemplateOutletContext]=\"{ $implicit: nzTreeNode }\">\n </ng-template>\n <ng-container *ngIf=\"!isTemplateRef(nzExpandedIcon)\">\n <i *ngIf=\"isShowLineIcon\" nz-icon [nzType]=\"isSwitcherOpen ? 'minus-square' : 'plus-square'\" class=\"ant-tree-switcher-line-icon\"></i>\n <i *ngIf=\"!isShowLineIcon\" nz-icon nzType=\"file\" class=\"ant-tree-switcher-line-icon\"></i>\n </ng-container>\n </ng-container>\n </span>\n </ng-container>\n <ng-container *ngIf=\"nzCheckable\">\n <span\n [ngClass]=\"nzNodeCheckboxClass\"\n (click)=\"_clickCheckBox($event)\">\n <span [class.ant-tree-checkbox-inner]=\"!nzSelectMode\"\n [class.ant-select-tree-checkbox-inner]=\"nzSelectMode\"></span>\n </span>\n </ng-container>\n <ng-container *ngIf=\"!nzTreeTemplate\">\n <span\n title=\"{{nzTreeNode.title}}\"\n [attr.draggable]=\"canDraggable\"\n [attr.aria-grabbed]=\"canDraggable\"\n [ngClass]=\"nzNodeContentClass\"\n [class.draggable]=\"canDraggable\">\n <span\n *ngIf=\"nzTreeNode.icon && nzShowIcon\"\n [class.ant-tree-icon__open]=\"isSwitcherOpen\"\n [class.ant-tree-icon__close]=\"isSwitcherClose\"\n [class.ant-tree-icon_loading]=\"nzTreeNode.isLoading\"\n [ngClass]=\"nzNodeContentLoadingClass\">\n <span\n [ngClass]=\"nzNodeContentIconClass\">\n <i nz-icon *ngIf=\"nzIcon\" [nzType]=\"nzIcon\"></i>\n </span>\n </span>\n <span class=\"ant-tree-title\" [innerHTML]=\"nzTreeNode.title | nzHighlight: nzSearchValue: '' : 'font-highlight'\">\n </span>\n </span>\n </ng-container>\n <ng-template\n [ngTemplateOutlet]=\"nzTreeTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: nzTreeNode }\">\n </ng-template>\n\n <ul\n *ngIf=\"nzTreeNode.isExpanded\"\n role=\"group\"\n class=\"ant-tree-child-tree\"\n [class.ant-tree-child-tree-open]=\"!nzSelectMode || nzTreeNode.isExpanded\"\n data-expanded=\"true\"\n [@.disabled]=\"noAnimation?.nzNoAnimation\"\n @treeCollapseMotion>\n <nz-tree-node\n *ngFor=\"let node of nzTreeNode.getChildren()\"\n [nzTreeNode]=\"node\"\n [nzShowExpand]=\"nzShowExpand\"\n [@.disabled]=\"noAnimation?.nzNoAnimation\"\n [nzNoAnimation]=\"noAnimation?.nzNoAnimation\"\n [nzSelectMode]=\"nzSelectMode\"\n [nzShowLine]=\"nzShowLine\"\n [nzExpandedIcon]=\"nzExpandedIcon\"\n [nzDraggable]=\"nzDraggable\"\n [nzCheckable]=\"nzCheckable\"\n [nzAsyncData]=\"nzAsyncData\"\n [nzExpandAll]=\"nzExpandAll\"\n [nzShowIcon]=\"nzShowIcon\"\n [nzSearchValue]=\"nzSearchValue\"\n [nzHideUnMatched]=\"nzHideUnMatched\"\n [nzBeforeDrop]=\"nzBeforeDrop\"\n [nzTreeTemplate]=\"nzTreeTemplate\">\n </nz-tree-node>\n </ul>\n</li>\n",
changeDetection: ChangeDetectionStrategy.OnPush,
preserveWhitespaces: false,
animations: [treeCollapseMotion]
}] }
];
/** @nocollapse */
NzTreeNodeComponent.ctorParameters = function () { return [
{ type: NzTreeBaseService },
{ type: NgZone },
{ type: Renderer2 },
{ type: ElementRef },
{ type: ChangeDetectorRef },
{ type: NzNoAnimationDirective, decorators: [{ type: Host }, { type: Optional }] }
]; };
NzTreeNodeComponent.propDecorators = {
dragElement: [{ type: ViewChild, args: ['dragElement', { static: false },] }],
nzTreeNode: [{ type: Input }],
nzShowLine: [{ type: Input }],
nzShowExpand: [{ type: Input }],
nzCheckable: [{ type: Input }],
nzAsyncData: [{ type: Input }],
nzHideUnMatched: [{ type: Input }],
nzNoAnimation: [{ type: Input }],
nzSelectMode: [{ type: Input }],
nzShowIcon: [{ type: Input }],
nzExpandedIcon: [{ type: Input }],
nzTreeTemplate: [{ type: Input }],
nzBeforeDrop: [{ type: Input }],
nzSearchValue: [{ type: Input }],
nzDraggable: [{ type: Input }],
nzDefaultExpandAll: [{ type: Input }],
nzExpandAll: [{ type: Input }],
onMousedown: [{ type: HostListener, args: ['mousedown', ['$event'],] }],
nzClick: [{ type: HostListener, args: ['click', ['$event'],] }],
nzDblClick: [{ type: HostListener, args: ['dblclick', ['$event'],] }],
nzContextMenu: [{ type: HostListener, args: ['contextmenu', ['$event'],] }]
};
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], NzTreeNodeComponent.prototype, "nzShowLine", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], NzTreeNodeComponent.prototype, "nzShowExpand", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], NzTreeNodeComponent.prototype, "nzCheckable", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], NzTreeNodeComponent.prototype, "nzAsyncData", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Object)
], NzTreeNodeComponent.prototype, "nzHideUnMatched", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Object)
], NzTreeNodeComponent.prototype, "nzNoAnimation", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Object)
], NzTreeNodeComponent.prototype, "nzSelectMode", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Object)
], NzTreeNodeComponent.prototype, "nzShowIcon", void 0);
return NzTreeNodeComponent;
}());
if (false) {
/** @type {?} */
NzTreeNodeComponent.prototype.dragElement;
/**
* for global property
* @type {?}
*/
NzTreeNodeComponent.prototype.nzTreeNode;
/** @type {?} */
NzTreeNodeComponent.prototype.nzShowLine;
/** @type {?} */
NzTreeNodeComponent.prototype.nzShowExpand;
/** @type {?} */
NzTreeNodeComponent.prototype.nzCheckable;
/** @type {?} */
NzTreeNodeComponent.prototype.nzAsyncData;
/** @type {?} */
NzTreeNodeComponent.prototype.nzHideUnMatched;
/** @type {?} */
NzTreeNodeComponent.prototype.nzNoAnimation;
/** @type {?} */
NzTreeNodeComponent.prototype.nzSelectMode;
/** @type {?} */
NzTreeNodeComponent.prototype.nzShowIcon;
/** @type {?} */
NzTreeNodeComponent.prototype.nzExpandedIcon;
/** @type {?} */
NzTreeNodeComponent.prototype.nzTreeTemplate;
/** @type {?} */
NzTreeNodeComponent.prototype.nzBeforeDrop;
/** @type {?} */
NzTreeNodeComponent.prototype.nzSearchValue;
/** @type {?} */
NzTreeNodeComponent.prototype.prefixCls;
/** @type {?} */
NzTreeNodeComponent.prototype.nzNodeClass;
/** @type {?} */
NzTreeNodeComponent.prototype.nzNodeSwitcherClass;
/** @type {?} */
NzTreeNodeComponent.prototype.nzNodeContentClass;
/** @type {?} */
NzTreeNodeComponent.prototype.nzNodeCheckboxClass;
/** @type {?} */
NzTreeNodeComponent.prototype.nzNodeContentIconClass;
/** @type {?} */
NzTreeNodeComponent.prototype.nzNodeContentLoadingClass;
/**
* drag var
* @type {?}
*/
NzTreeNodeComponent.prototype.destroy$;
/** @type {?} */
NzTreeNodeComponent.prototype.dragPos;
/** @type {?} */
NzTreeNodeComponent.prototype.dragPosClass;
/**
* default set
* @type {?}
*/
NzTreeNodeComponent.prototype._nzDraggable;
/** @type {?} */
NzTreeNodeComponent.prototype._nzExpandAll;
/** @type {?} */
NzTreeNodeComponent.prototype.nzTreeService;
/**
* @type {?}
* @private
*/
NzTreeNodeComponent.prototype.ngZone;
/**
* @type {?}
* @private
*/
NzTreeNodeComponent.prototype.renderer;
/**
* @type {?}
* @private
*/
NzTreeNodeComponent.prototype.elRef;
/**
* @type {?}
* @private
*/
NzTreeNodeComponent.prototype.cdr;
/** @type {?} */
NzTreeNodeComponent.prototype.noAnimation;
}
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NzTreeService = /** @class */ (function (_super) {
__extends(NzTreeService, _super);
function NzTreeService() {
return _super !== null && _super.apply(this, arguments) || this;
}
NzTreeService.decorators = [
{ type: Injectable }
];
return NzTreeService;
}(NzTreeBaseService));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @param {?} higherOrderService
* @param {?} treeService
* @return {?}
*/
function NzTreeServiceFactory(higherOrderService, treeService) {
return higherOrderService ? higherOrderService : treeService;
}
var NzTreeComponent = /** @class */ (function (_super) {
__extends(NzTreeComponent, _super);
function NzTreeComponent(nzTreeService, nzConfigService, cdr, noAnimation) {
var _this = _super.call(this, nzTreeService) || this;
_this.nzConfigService = nzConfigService;
_this.cdr = cdr;
_this.noAnimation = noAnimation;
_this.nzShowExpand = true;
_this.nzShowLine = false;
_this.nzCheckable = false;
_this.nzAsyncData = false;
_this.nzDraggable = false;
_this.nzSelectMode = false;
_this.nzCheckStrictly = false;
_this.nzExpandAll = false;
_this._nzDefaultExpandAll = false;
_this.nzExpandedKeysChange = new EventEmitter();
_this.nzSelectedKeysChange = new EventEmitter();
_this.nzCheckedKeysChange = new EventEmitter();
_this.nzSearchValueChange = new EventEmitter();
/**
* @deprecated use `nzSearchValueChange` instead.
*/
_this.nzOnSearchNode = new EventEmitter();
_this.nzClick = new EventEmitter();
_this.nzDblClick = new EventEmitter();
_this.nzContextMenu = new EventEmitter();
_this.nzCheckBoxChange = new EventEmitter();
_this.nzExpandChange = new EventEmitter();
_this.nzOnDragStart = new EventEmitter();
_this.nzOnDragEnter = new EventEmitter();
_this.nzOnDragOver = new EventEmitter();
_this.nzOnDragLeave = new EventEmitter();
_this.nzOnDrop = new EventEmitter();
_this.nzOnDragEnd = new EventEmitter();
_this._nzMultiple = false;
_this.nzDefaultSubject = new ReplaySubject(6);
_this.destroy$ = new Subject();
_this.prefixCls = 'ant-tree';
_this.classMap = {};
_this.onChange = (/**
* @return {?}
*/
function () { return null; });
_this.onTouched = (/**
* @return {?}
*/
function () { return null; });
return _this;
}
Object.defineProperty(NzTreeComponent.prototype, "treeTemplate", {
get: /**
* @return {?}
*/
function () {
return this.nzTreeTemplate || this.nzTreeTemplateChild;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzDefaultExpandAll", {
get: /**
* @return {?}
*/
function () {
return this._nzDefaultExpandAll;
},
/**
* @deprecated 9.0.0 use `nzExpandAll` instead.
*/
set: /**
* @deprecated 9.0.0 use `nzExpandAll` instead.
* @param {?} value
* @return {?}
*/
function (value) {
warnDeprecation("'nzDefaultExpandAll' would be removed in 9.0.0. Please use 'nzExpandAll' instead.");
this.nzExpandAll = value;
this._nzDefaultExpandAll = value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzMultiple", {
get: /**
* @return {?}
*/
function () {
return this._nzMultiple;
},
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this._nzMultiple = toBoolean(value);
this.nzTreeService.isMultiple = toBoolean(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzData", {
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this.initNzData(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzDefaultExpandedKeys", {
/**
* @deprecated 9.0.0 - use `nzExpandedKeys` instead.
*/
set: /**
* @deprecated 9.0.0 - use `nzExpandedKeys` instead.
* @param {?} value
* @return {?}
*/
function (value) {
warnDeprecation("'nzDefaultExpandedKeys' would be removed in 9.0.0. Please use 'nzExpandedKeys' instead.");
this.nzDefaultSubject.next({ type: 'nzExpandedKeys', keys: value });
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzDefaultSelectedKeys", {
/**
* @deprecated 9.0.0 - use `nzSelectedKeys` instead.
*/
set: /**
* @deprecated 9.0.0 - use `nzSelectedKeys` instead.
* @param {?} value
* @return {?}
*/
function (value) {
warnDeprecation("'nzDefaultSelectedKeys' would be removed in 9.0.0. Please use 'nzSelectedKeys' instead.");
this.nzDefaultSubject.next({ type: 'nzSelectedKeys', keys: value });
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzDefaultCheckedKeys", {
/**
* @deprecated 9.0.0 - use `nzCheckedKeys` instead.
*/
set: /**
* @deprecated 9.0.0 - use `nzCheckedKeys` instead.
* @param {?} value
* @return {?}
*/
function (value) {
warnDeprecation("'nzDefaultCheckedKeys' would be removed in 9.0.0. Please use 'nzCheckedKeys' instead.");
this.nzDefaultSubject.next({ type: 'nzCheckedKeys', keys: value });
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzExpandedKeys", {
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this.nzDefaultSubject.next({ type: 'nzExpandedKeys', keys: value });
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzSelectedKeys", {
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this.nzDefaultSubject.next({ type: 'nzSelectedKeys', keys: value });
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzCheckedKeys", {
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this.nzDefaultSubject.next({ type: 'nzCheckedKeys', keys: value });
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzSearchValue", {
get: /**
* @return {?}
*/
function () {
return this._searchValue;
},
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this._searchValue = value;
this.nzTreeService.searchExpand(value);
if (isNotNil(value)) {
this.nzSearchValueChange.emit(this.nzTreeService.formatEvent('search', null, null));
/**
* @deprecated 9.0.0 - use `nzOnSearchNode` instead.
* Hide warning, need remove next version
*/
this.nzOnSearchNode.emit(this.nzTreeService.formatEvent('search', null, null));
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(NzTreeComponent.prototype, "nzNodes", {
/**
* To render nodes if root is changed.
*/
get: /**
* To render nodes if root is changed.
* @return {?}
*/
function () {
return this.nzTreeService.rootNodes;
},
enumerable: true,
configurable: true
});
/**
* @return {?}
*/
NzTreeComponent.prototype.setClassMap = /**
* @return {?}
*/
function () {
var _a;
this.classMap = (_a = {},
_a[this.prefixCls] = true,
_a[this.prefixCls + '-show-line'] = this.nzShowLine,
_a[this.prefixCls + "-icon-hide"] = !this.nzShowIcon,
_a[this.prefixCls + "-block-node"] = this.nzBlockNode,
_a['draggable-tree'] = this.nzDraggable,
_a['ant-select-tree'] = this.nzSelectMode,
_a);
};
/**
* @param {?} value
* @return {?}
*/
NzTreeComponent.prototype.writeValue = /**
* @param {?} value
* @return {?}
*/
function (value) {
this.initNzData(value);
};
/**
* @param {?} fn
* @return {?}
*/
NzTreeComponent.prototype.registerOnChange = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onChange = fn;
};
/**
* @param {?} fn
* @return {?}
*/
NzTreeComponent.prototype.registerOnTouched = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onTouched = fn;
};
// tslint:disable-next-line:no-any
// tslint:disable-next-line:no-any
/**
* @param {?} value
* @return {?}
*/
NzTreeComponent.prototype.initNzData =
// tslint:disable-next-line:no-any
/**
* @param {?} value
* @return {?}
*/
function (value) {
if (Array.isArray(value)) {
this.nzTreeService.isCheckStrictly = this.nzCheckStrictly;
this.nzTreeService.isMultiple = this.nzMultiple;
this.nzTreeService.initTree(this.coerceTreeNodes(value));
}
};
/**
* @return {?}
*/
NzTreeComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var _this = this;
this.setClassMap();
this.nzDefaultSubject.pipe(takeUntil(this.destroy$)).subscribe((/**
* @param {?} data
* @return {?}
*/
function (data) {
if (!data || !data.keys) {
return;
}
switch (data.type) {
case 'nzExpandedKeys':
_this.nzTreeService.calcExpandedKeys(data.keys, _this.nzNodes);
_this.nzExpandedKeysChange.emit(data.keys);
break;
case 'nzSelectedKeys':
_this.nzTreeService.calcSelectedKeys(data.keys, _this.nzNodes, _this.nzMultiple);
_this.nzSelectedKeysChange.emit(data.keys);
break;
case 'nzCheckedKeys':
_this.nzTreeService.calcCheckedKeys(data.keys, _this.nzNodes, _this.nzCheckStrictly);
_this.nzCheckedKeysChange.emit(data.keys);
break;
}
_this.cdr.markForCheck();
}));
this.nzTreeService
.eventTriggerChanged()
.pipe(takeUntil(this.destroy$))
.subscribe((/**
* @param {?} data
* @return {?}
*/
function (data) {
switch (data.eventName) {
case 'expand':
_this.nzExpandChange.emit(data);
break;
case 'click':
_this.nzClick.emit(data);
break;
case 'check':
_this.nzCheckBoxChange.emit(data);
break;
case 'dblclick':
_this.nzDblClick.emit(data);
break;
case 'contextmenu':
_this.nzContextMenu.emit(data);
break;
// drag drop
case 'dragstart':
_this.nzOnDragStart.emit(data);
break;
case 'dragenter':
_this.nzOnDragEnter.emit(data);
break;
case 'dragover':
_this.nzOnDragOver.emit(data);
break;
case 'dragleave':
_this.nzOnDragLeave.emit(data);
break;
case 'drop':
_this.nzOnDrop.emit(data);
break;
case 'dragend':
_this.nzOnDragEnd.emit(data);
break;
}
}));
};
/**
* @param {?} changes
* @return {?}
*/
NzTreeComponent.prototype.ngOnChanges = /**
* @param {?} changes
* @return {?}
*/
function (changes) {
if (changes.nzCheckStrictly) {
this.nzTreeService.isCheckStrictly = toBoolean(changes.nzCheckStrictly.currentValue);
}
if (changes.nzMultiple) {
this.nzTreeService.isMultiple = toBoolean(changes.nzMultiple.currentValue);
}
};
/**
* @return {?}
*/
NzTreeComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.destroy$.next();
this.destroy$.complete();
};
NzTreeComponent.decorators = [
{ type: Component, args: [{
selector: 'nz-tree',
exportAs: 'nzTree',
template: "<ul\n role=\"tree\"\n unselectable=\"on\"\n [ngClass]=\"classMap\">\n <ng-container *ngFor=\"let node of nzNodes\">\n <nz-tree-node\n [nzTreeNode]=\"node\"\n [nzSelectMode]=\"nzSelectMode\"\n [nzShowLine]=\"nzShowLine\"\n [nzExpandedIcon]=\"nzExpandedIcon\"\n [nzDraggable]=\"nzDraggable\"\n [nzCheckable]=\"nzCheckable\"\n [nzShowExpand]=\"nzShowExpand\"\n [nzAsyncData]=\"nzAsyncData\"\n [nzSearchValue]=\"nzSearchValue\"\n [nzHideUnMatched]=\"nzHideUnMatched\"\n [nzBeforeDrop]=\"nzBeforeDrop\"\n [nzExpandAll]=\"nzExpandAll\"\n [nzShowIcon]=\"nzShowIcon\"\n [nzTreeTemplate]=\"treeTemplate\"\n [@.disabled]=\"noAnimation?.nzNoAnimation\"\n [nzNoAnimation]=\"noAnimation?.nzNoAnimation\">\n </nz-tree-node>\n </ng-container>\n</ul>",
changeDetection: ChangeDetectionStrategy.OnPush,
providers: [
NzTreeService,
{
provide: NzTreeBaseService,
useFactory: NzTreeServiceFactory,
deps: [[new SkipSelf(), new Optional(), NzTreeHigherOrderServiceToken], NzTreeService]
},
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef((/**
* @return {?}
*/
function () { ret