ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
853 lines (832 loc) • 39.1 kB
JavaScript
import { __decorate } from 'tslib';
import { TAB, ESCAPE, BACKSPACE } from '@angular/cdk/keycodes';
import * as i9 from '@angular/cdk/overlay';
import { CdkOverlayOrigin, CdkConnectedOverlay, OverlayModule } from '@angular/cdk/overlay';
import * as i0 from '@angular/core';
import { Injectable, EventEmitter, Self, Injector, forwardRef, Component, Optional, Host, Input, Output, ViewChild, ContentChild, NgModule } from '@angular/core';
import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
import { Subject, merge, of } from 'rxjs';
import { takeUntil, tap, filter } from 'rxjs/operators';
import { slideMotion } from 'ng-zorro-antd/core/animation';
import * as i2 from 'ng-zorro-antd/core/config';
import { WithConfig } from 'ng-zorro-antd/core/config';
import { reqAnimFrame } from 'ng-zorro-antd/core/polyfill';
import { NzTreeBaseService, NzTreeBase, NzTreeHigherOrderServiceToken } from 'ng-zorro-antd/core/tree';
import { isNotNil, InputBoolean } from 'ng-zorro-antd/core/util';
import * as i8 from 'ng-zorro-antd/select';
import { NzSelectSearchComponent, NzSelectModule } from 'ng-zorro-antd/select';
import * as i3 from '@angular/cdk/bidi';
import { BidiModule } from '@angular/cdk/bidi';
import * as i4 from '@angular/cdk/a11y';
import * as i5 from 'ng-zorro-antd/core/no-animation';
import { NzNoAnimationModule } from 'ng-zorro-antd/core/no-animation';
import * as i6 from 'ng-zorro-antd/tree';
import { NzTreeModule } from 'ng-zorro-antd/tree';
import * as i7 from 'ng-zorro-antd/empty';
import { NzEmptyModule } from 'ng-zorro-antd/empty';
import * as i10 from 'ng-zorro-antd/core/overlay';
import { NzOverlayModule } from 'ng-zorro-antd/core/overlay';
import * as i11 from '@angular/common';
import { CommonModule } from '@angular/common';
import { NzIconModule } from 'ng-zorro-antd/icon';
/**
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
*/
class NzTreeSelectService extends NzTreeBaseService {
}
NzTreeSelectService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: NzTreeSelectService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
NzTreeSelectService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: NzTreeSelectService });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: NzTreeSelectService, decorators: [{
type: Injectable
}] });
function higherOrderServiceFactory(injector) {
return injector.get(NzTreeSelectService);
}
const NZ_CONFIG_MODULE_NAME = 'treeSelect';
const TREE_SELECT_DEFAULT_CLASS = 'ant-select-dropdown ant-select-tree-dropdown';
class NzTreeSelectComponent extends NzTreeBase {
constructor(nzTreeService, nzConfigService, renderer, cdr, elementRef, directionality, focusMonitor, noAnimation) {
super(nzTreeService);
this.nzConfigService = nzConfigService;
this.renderer = renderer;
this.cdr = cdr;
this.elementRef = elementRef;
this.directionality = directionality;
this.focusMonitor = focusMonitor;
this.noAnimation = noAnimation;
this._nzModuleName = NZ_CONFIG_MODULE_NAME;
this.nzId = null;
this.nzAllowClear = true;
this.nzShowExpand = true;
this.nzShowLine = false;
this.nzDropdownMatchSelectWidth = true;
this.nzCheckable = false;
this.nzHideUnMatched = false;
this.nzShowIcon = false;
this.nzShowSearch = false;
this.nzDisabled = false;
this.nzAsyncData = false;
this.nzMultiple = false;
this.nzDefaultExpandAll = false;
this.nzCheckStrictly = false;
this.nzVirtualItemSize = 28;
this.nzVirtualMaxBufferPx = 500;
this.nzVirtualMinBufferPx = 28;
this.nzVirtualHeight = null;
this.nzNodes = [];
this.nzOpen = false;
this.nzSize = 'default';
this.nzPlaceHolder = '';
this.nzDropdownStyle = null;
this.nzBackdrop = false;
this.nzDisplayWith = (node) => node.title;
this.nzMaxTagPlaceholder = null;
this.nzOpenChange = new EventEmitter();
this.nzCleared = new EventEmitter();
this.nzRemoved = new EventEmitter();
this.nzExpandChange = new EventEmitter();
this.nzTreeClick = new EventEmitter();
this.nzTreeCheckBoxChange = new EventEmitter();
this.dropdownClassName = TREE_SELECT_DEFAULT_CLASS;
this.isComposing = false;
this.isDestroy = true;
this.isNotFound = false;
this.focused = false;
this.inputValue = '';
this.dropDownPosition = 'bottom';
this.selectedNodes = [];
this.expandedKeys = [];
this.value = [];
this.dir = 'ltr';
this.destroy$ = new Subject();
this.onChange = _value => { };
this.onTouched = () => { };
this.renderer.addClass(this.elementRef.nativeElement, 'ant-select');
this.renderer.addClass(this.elementRef.nativeElement, 'ant-tree-select');
}
set nzExpandedKeys(value) {
this.expandedKeys = value;
}
get nzExpandedKeys() {
return this.expandedKeys;
}
get treeTemplate() {
return this.nzTreeTemplate || this.nzTreeTemplateChild;
}
get placeHolderDisplay() {
return this.inputValue || this.isComposing || this.selectedNodes.length ? 'none' : 'block';
}
get isMultiple() {
return this.nzMultiple || this.nzCheckable;
}
ngOnInit() {
this.isDestroy = false;
this.subscribeSelectionChange();
this.directionality.change?.pipe(takeUntil(this.destroy$)).subscribe((direction) => {
this.dir = direction;
this.cdr.detectChanges();
});
this.dir = this.directionality.value;
this.focusMonitor
.monitor(this.elementRef, true)
.pipe(takeUntil(this.destroy$))
.subscribe(focusOrigin => {
if (!focusOrigin) {
this.focused = false;
this.cdr.markForCheck();
Promise.resolve().then(() => {
this.onTouched();
});
}
else {
this.focused = true;
this.cdr.markForCheck();
}
});
}
ngOnDestroy() {
this.isDestroy = true;
this.closeDropDown();
this.destroy$.next();
this.destroy$.complete();
}
isComposingChange(isComposing) {
this.isComposing = isComposing;
}
setDisabledState(isDisabled) {
this.nzDisabled = isDisabled;
this.closeDropDown();
}
ngOnChanges(changes) {
const { nzNodes, nzDropdownClassName } = changes;
if (nzNodes) {
this.updateSelectedNodes(true);
}
if (nzDropdownClassName) {
const className = this.nzDropdownClassName && this.nzDropdownClassName.trim();
this.dropdownClassName = className ? `${TREE_SELECT_DEFAULT_CLASS} ${className}` : TREE_SELECT_DEFAULT_CLASS;
}
}
writeValue(value) {
if (isNotNil(value)) {
if (this.isMultiple && Array.isArray(value)) {
this.value = value;
}
else {
this.value = [value];
}
this.updateSelectedNodes(true);
}
else {
this.value = [];
this.selectedNodes.forEach(node => {
this.removeSelected(node, false);
});
this.selectedNodes = [];
}
this.cdr.markForCheck();
}
registerOnChange(fn) {
this.onChange = fn;
}
registerOnTouched(fn) {
this.onTouched = fn;
}
onKeydown(event) {
if (this.nzDisabled) {
return;
}
switch (event.keyCode) {
case ESCAPE:
/**
* Skip the ESCAPE processing, it will be handled in {@link onOverlayKeyDown}.
*/
break;
case TAB:
this.closeDropDown();
break;
default:
if (!this.nzOpen) {
this.openDropdown();
}
}
}
trigger() {
if (this.nzDisabled || (!this.nzDisabled && this.nzOpen)) {
this.closeDropDown();
}
else {
this.openDropdown();
}
}
openDropdown() {
if (!this.nzDisabled) {
this.nzOpen = true;
this.nzOpenChange.emit(this.nzOpen);
this.updateCdkConnectedOverlayStatus();
if (this.nzShowSearch || this.isMultiple) {
this.focusOnInput();
}
}
}
closeDropDown() {
this.onTouched();
this.nzOpen = false;
this.inputValue = '';
this.isNotFound = false;
this.nzOpenChange.emit(this.nzOpen);
this.cdr.markForCheck();
}
onKeyDownInput(e) {
const keyCode = e.keyCode;
const eventTarget = e.target;
if (this.isMultiple && !eventTarget.value && keyCode === BACKSPACE) {
e.preventDefault();
if (this.selectedNodes.length) {
const removeNode = this.selectedNodes[this.selectedNodes.length - 1];
this.removeSelected(removeNode);
}
}
}
onExpandedKeysChange(value) {
this.nzExpandChange.emit(value);
this.expandedKeys = [...value.keys];
}
setInputValue(value) {
this.inputValue = value;
this.updatePosition();
}
removeSelected(node, emit = true) {
node.isSelected = false;
node.isChecked = false;
if (this.nzCheckable) {
this.nzTreeService.conduct(node, this.nzCheckStrictly);
}
else {
this.nzTreeService.setSelectedNodeList(node, this.nzMultiple);
}
if (emit) {
this.nzRemoved.emit(node);
}
}
focusOnInput() {
if (this.nzSelectSearchComponent) {
this.nzSelectSearchComponent.focus();
}
}
subscribeSelectionChange() {
merge(this.nzTreeClick.pipe(tap((event) => {
const node = event.node;
if (this.nzCheckable && !node.isDisabled && !node.isDisableCheckbox) {
node.isChecked = !node.isChecked;
node.isHalfChecked = false;
if (!this.nzCheckStrictly) {
this.nzTreeService.conduct(node);
}
}
if (this.nzCheckable) {
node.isSelected = false;
}
}), filter((event) => {
const node = event.node;
return this.nzCheckable ? !node.isDisabled && !node.isDisableCheckbox : !node.isDisabled && node.isSelectable;
})), this.nzCheckable ? this.nzTreeCheckBoxChange : of(), this.nzCleared, this.nzRemoved)
.pipe(takeUntil(this.destroy$))
.subscribe(() => {
this.updateSelectedNodes();
const value = this.selectedNodes.map(node => node.key);
this.value = [...value];
if (this.nzShowSearch || this.isMultiple) {
this.inputValue = '';
this.isNotFound = false;
}
if (this.isMultiple) {
this.onChange(value);
this.focusOnInput();
this.updatePosition();
}
else {
this.closeDropDown();
this.onChange(value.length ? value[0] : null);
}
});
}
updateSelectedNodes(init = false) {
if (init) {
const nodes = this.coerceTreeNodes(this.nzNodes);
this.nzTreeService.isMultiple = this.isMultiple;
this.nzTreeService.isCheckStrictly = this.nzCheckStrictly;
this.nzTreeService.initTree(nodes);
if (this.nzCheckable) {
this.nzTreeService.conductCheck(this.value, this.nzCheckStrictly);
}
else {
this.nzTreeService.conductSelectedKeys(this.value, this.isMultiple);
}
}
this.selectedNodes = [...(this.nzCheckable ? this.getCheckedNodeList() : this.getSelectedNodeList())];
}
updatePosition() {
reqAnimFrame(() => {
this.cdkConnectedOverlay?.overlayRef?.updatePosition();
});
}
onPositionChange(position) {
this.dropDownPosition = position.connectionPair.originY;
}
onClearSelection() {
this.selectedNodes.forEach(node => {
this.removeSelected(node, false);
});
this.nzCleared.emit();
}
onClickOutside(event) {
if (!this.elementRef.nativeElement.contains(event.target)) {
this.closeDropDown();
}
}
setSearchValues($event) {
Promise.resolve().then(() => {
this.isNotFound = (this.nzShowSearch || this.isMultiple) && !!this.inputValue && $event.matchedKeys.length === 0;
});
}
updateCdkConnectedOverlayStatus() {
this.triggerWidth = this.cdkOverlayOrigin.elementRef.nativeElement.getBoundingClientRect().width;
}
trackValue(_index, option) {
return option.key;
}
}
NzTreeSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: NzTreeSelectComponent, deps: [{ token: NzTreeSelectService }, { token: i2.NzConfigService }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i3.Directionality, optional: true }, { token: i4.FocusMonitor }, { token: i5.NzNoAnimationDirective, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Component });
NzTreeSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: NzTreeSelectComponent, selector: "nz-tree-select", inputs: { nzId: "nzId", nzAllowClear: "nzAllowClear", nzShowExpand: "nzShowExpand", nzShowLine: "nzShowLine", nzDropdownMatchSelectWidth: "nzDropdownMatchSelectWidth", nzCheckable: "nzCheckable", nzHideUnMatched: "nzHideUnMatched", nzShowIcon: "nzShowIcon", nzShowSearch: "nzShowSearch", nzDisabled: "nzDisabled", nzAsyncData: "nzAsyncData", nzMultiple: "nzMultiple", nzDefaultExpandAll: "nzDefaultExpandAll", nzCheckStrictly: "nzCheckStrictly", nzVirtualItemSize: "nzVirtualItemSize", nzVirtualMaxBufferPx: "nzVirtualMaxBufferPx", nzVirtualMinBufferPx: "nzVirtualMinBufferPx", nzVirtualHeight: "nzVirtualHeight", nzExpandedIcon: "nzExpandedIcon", nzNotFoundContent: "nzNotFoundContent", nzNodes: "nzNodes", nzOpen: "nzOpen", nzSize: "nzSize", nzPlaceHolder: "nzPlaceHolder", nzDropdownStyle: "nzDropdownStyle", nzDropdownClassName: "nzDropdownClassName", nzBackdrop: "nzBackdrop", nzExpandedKeys: "nzExpandedKeys", nzDisplayWith: "nzDisplayWith", nzMaxTagCount: "nzMaxTagCount", nzMaxTagPlaceholder: "nzMaxTagPlaceholder", nzTreeTemplate: "nzTreeTemplate" }, outputs: { nzOpenChange: "nzOpenChange", nzCleared: "nzCleared", nzRemoved: "nzRemoved", nzExpandChange: "nzExpandChange", nzTreeClick: "nzTreeClick", nzTreeCheckBoxChange: "nzTreeCheckBoxChange" }, host: { listeners: { "click": "trigger()", "keydown": "onKeydown($event)" }, properties: { "class.ant-select-lg": "nzSize===\"large\"", "class.ant-select-rtl": "dir===\"rtl\"", "class.ant-select-sm": "nzSize===\"small\"", "class.ant-select-disabled": "nzDisabled", "class.ant-select-single": "!isMultiple", "class.ant-select-show-arrow": "!isMultiple", "class.ant-select-show-search": "!isMultiple", "class.ant-select-multiple": "isMultiple", "class.ant-select-allow-clear": "nzAllowClear", "class.ant-select-open": "nzOpen", "class.ant-select-focused": "nzOpen || focused" }, classAttribute: "ant-select" }, providers: [
NzTreeSelectService,
{
provide: NzTreeHigherOrderServiceToken,
useFactory: higherOrderServiceFactory,
deps: [[new Self(), Injector]]
},
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => NzTreeSelectComponent),
multi: true
}
], queries: [{ propertyName: "nzTreeTemplateChild", first: true, predicate: ["nzTreeTemplate"], descendants: true, static: true }], viewQueries: [{ propertyName: "nzSelectSearchComponent", first: true, predicate: NzSelectSearchComponent, descendants: true }, { propertyName: "treeRef", first: true, predicate: ["treeRef"], descendants: true }, { propertyName: "cdkOverlayOrigin", first: true, predicate: CdkOverlayOrigin, descendants: true, static: true }, { propertyName: "cdkConnectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true }], exportAs: ["nzTreeSelect"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
<ng-template
cdkConnectedOverlay
nzConnectedOverlay
[cdkConnectedOverlayHasBackdrop]="nzBackdrop"
[cdkConnectedOverlayOrigin]="cdkOverlayOrigin"
[cdkConnectedOverlayOpen]="nzOpen"
[cdkConnectedOverlayTransformOriginOn]="'.ant-select-tree-dropdown'"
[cdkConnectedOverlayMinWidth]="$any(nzDropdownMatchSelectWidth ? null : triggerWidth)"
[cdkConnectedOverlayWidth]="$any(nzDropdownMatchSelectWidth ? triggerWidth : null)"
(overlayOutsideClick)="onClickOutside($event)"
(detach)="closeDropDown()"
(positionChange)="onPositionChange($event)"
>
<div
[]="'enter'"
[ngClass]="dropdownClassName"
[@.disabled]="noAnimation?.nzNoAnimation"
[nzNoAnimation]="noAnimation?.nzNoAnimation"
[class.ant-select-dropdown-placement-bottomLeft]="dropDownPosition === 'bottom'"
[class.ant-select-dropdown-placement-topLeft]="dropDownPosition === 'top'"
[class.ant-tree-select-dropdown-rtl]="dir === 'rtl'"
[dir]="dir"
[ngStyle]="nzDropdownStyle"
>
<nz-tree
#treeRef
[hidden]="isNotFound"
nzNoAnimation
nzSelectMode
nzBlockNode
[nzData]="nzNodes"
[nzMultiple]="nzMultiple"
[nzSearchValue]="inputValue"
[nzHideUnMatched]="nzHideUnMatched"
[nzShowIcon]="nzShowIcon"
[nzCheckable]="nzCheckable"
[nzAsyncData]="nzAsyncData"
[nzShowExpand]="nzShowExpand"
[nzShowLine]="nzShowLine"
[nzExpandedIcon]="nzExpandedIcon"
[nzExpandAll]="nzDefaultExpandAll"
[nzExpandedKeys]="expandedKeys"
[nzCheckedKeys]="nzCheckable ? value : []"
[nzSelectedKeys]="!nzCheckable ? value : []"
[nzTreeTemplate]="treeTemplate"
[nzCheckStrictly]="nzCheckStrictly"
[nzVirtualItemSize]="nzVirtualItemSize"
[nzVirtualMaxBufferPx]="nzVirtualMaxBufferPx"
[nzVirtualMinBufferPx]="nzVirtualMinBufferPx"
[nzVirtualHeight]="nzVirtualHeight"
(nzExpandChange)="onExpandedKeysChange($event)"
(nzClick)="nzTreeClick.emit($event)"
(nzCheckedKeysChange)="updateSelectedNodes()"
(nzSelectedKeysChange)="updateSelectedNodes()"
(nzCheckBoxChange)="nzTreeCheckBoxChange.emit($event)"
(nzSearchValueChange)="setSearchValues($event)"
></nz-tree>
<span *ngIf="nzNodes.length === 0 || isNotFound" class="ant-select-not-found">
<nz-embed-empty [nzComponentName]="'tree-select'" [specificContent]="nzNotFoundContent"></nz-embed-empty>
</span>
</div>
</ng-template>
<div cdkOverlayOrigin class="ant-select-selector">
<ng-container *ngIf="isMultiple">
<nz-select-item
*ngFor="let node of selectedNodes | slice: 0:nzMaxTagCount; trackBy: trackValue"
[deletable]="true"
[disabled]="node.isDisabled || nzDisabled"
[label]="nzDisplayWith(node)"
(delete)="removeSelected(node, true)"
></nz-select-item>
<nz-select-item
*ngIf="selectedNodes.length > nzMaxTagCount"
[contentTemplateOutlet]="nzMaxTagPlaceholder"
[contentTemplateOutletContext]="selectedNodes | slice: nzMaxTagCount"
[deletable]="false"
[disabled]="false"
[label]="'+ ' + (selectedNodes.length - nzMaxTagCount) + ' ...'"
></nz-select-item>
</ng-container>
<nz-select-search
[nzId]="nzId"
[showInput]="nzShowSearch"
(keydown)="onKeyDownInput($event)"
(isComposingChange)="isComposing = $event"
(valueChange)="setInputValue($event)"
[value]="inputValue"
[mirrorSync]="isMultiple"
[disabled]="nzDisabled"
[focusTrigger]="nzOpen"
></nz-select-search>
<nz-select-placeholder
*ngIf="nzPlaceHolder && selectedNodes.length === 0"
[placeholder]="nzPlaceHolder"
[style.display]="placeHolderDisplay"
></nz-select-placeholder>
<nz-select-item
*ngIf="!isMultiple && selectedNodes.length === 1 && !isComposing && inputValue === ''"
[deletable]="false"
[disabled]="false"
[label]="nzDisplayWith(selectedNodes[0])"
></nz-select-item>
<nz-select-arrow *ngIf="!isMultiple"></nz-select-arrow>
<nz-select-clear
*ngIf="nzAllowClear && !nzDisabled && selectedNodes.length"
(clear)="onClearSelection()"
></nz-select-clear>
</div>
`, isInline: true, components: [{ type: i6.NzTreeComponent, selector: "nz-tree", inputs: ["nzShowIcon", "nzHideUnMatched", "nzBlockNode", "nzExpandAll", "nzSelectMode", "nzCheckStrictly", "nzShowExpand", "nzShowLine", "nzCheckable", "nzAsyncData", "nzDraggable", "nzMultiple", "nzExpandedIcon", "nzVirtualItemSize", "nzVirtualMaxBufferPx", "nzVirtualMinBufferPx", "nzVirtualHeight", "nzTreeTemplate", "nzBeforeDrop", "nzData", "nzExpandedKeys", "nzSelectedKeys", "nzCheckedKeys", "nzSearchValue", "nzSearchFunc"], outputs: ["nzExpandedKeysChange", "nzSelectedKeysChange", "nzCheckedKeysChange", "nzSearchValueChange", "nzClick", "nzDblClick", "nzContextMenu", "nzCheckBoxChange", "nzExpandChange", "nzOnDragStart", "nzOnDragEnter", "nzOnDragOver", "nzOnDragLeave", "nzOnDrop", "nzOnDragEnd"], exportAs: ["nzTree"] }, { type: i7.NzEmbedEmptyComponent, selector: "nz-embed-empty", inputs: ["nzComponentName", "specificContent"], exportAs: ["nzEmbedEmpty"] }, { type: i8.NzSelectItemComponent, selector: "nz-select-item", inputs: ["disabled", "label", "deletable", "removeIcon", "contentTemplateOutletContext", "contentTemplateOutlet"], outputs: ["delete"] }, { type: i8.NzSelectSearchComponent, selector: "nz-select-search", inputs: ["nzId", "disabled", "mirrorSync", "showInput", "focusTrigger", "value", "autofocus"], outputs: ["valueChange", "isComposingChange"] }, { type: i8.NzSelectPlaceholderComponent, selector: "nz-select-placeholder", inputs: ["placeholder"] }, { type: i8.NzSelectArrowComponent, selector: "nz-select-arrow", inputs: ["loading", "search", "suffixIcon"] }, { type: i8.NzSelectClearComponent, selector: "nz-select-clear", inputs: ["clearIcon"], outputs: ["clear"] }], directives: [{ type: i9.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { type: i10.NzConnectedOverlayDirective, selector: "[cdkConnectedOverlay][nzConnectedOverlay]", inputs: ["nzArrowPointAtCenter"], exportAs: ["nzConnectedOverlay"] }, { type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NzNoAnimationDirective, selector: "[nzNoAnimation]", inputs: ["nzNoAnimation"], exportAs: ["nzNoAnimation"] }, { type: i3.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i11.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "slice": i11.SlicePipe }, animations: [slideMotion] });
__decorate([
InputBoolean()
], NzTreeSelectComponent.prototype, "nzAllowClear", void 0);
__decorate([
InputBoolean()
], NzTreeSelectComponent.prototype, "nzShowExpand", void 0);
__decorate([
InputBoolean()
], NzTreeSelectComponent.prototype, "nzShowLine", void 0);
__decorate([
InputBoolean(),
WithConfig()
], NzTreeSelectComponent.prototype, "nzDropdownMatchSelectWidth", void 0);
__decorate([
InputBoolean()
], NzTreeSelectComponent.prototype, "nzCheckable", void 0);
__decorate([
InputBoolean(),
WithConfig()
], NzTreeSelectComponent.prototype, "nzHideUnMatched", void 0);
__decorate([
InputBoolean(),
WithConfig()
], NzTreeSelectComponent.prototype, "nzShowIcon", void 0);
__decorate([
InputBoolean()
], NzTreeSelectComponent.prototype, "nzShowSearch", void 0);
__decorate([
InputBoolean()
], NzTreeSelectComponent.prototype, "nzDisabled", void 0);
__decorate([
InputBoolean()
], NzTreeSelectComponent.prototype, "nzAsyncData", void 0);
__decorate([
InputBoolean()
], NzTreeSelectComponent.prototype, "nzMultiple", void 0);
__decorate([
InputBoolean()
], NzTreeSelectComponent.prototype, "nzDefaultExpandAll", void 0);
__decorate([
InputBoolean()
], NzTreeSelectComponent.prototype, "nzCheckStrictly", void 0);
__decorate([
WithConfig()
], NzTreeSelectComponent.prototype, "nzSize", void 0);
__decorate([
WithConfig()
], NzTreeSelectComponent.prototype, "nzBackdrop", void 0);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: NzTreeSelectComponent, decorators: [{
type: Component,
args: [{
selector: 'nz-tree-select',
exportAs: 'nzTreeSelect',
animations: [slideMotion],
template: `
<ng-template
cdkConnectedOverlay
nzConnectedOverlay
[cdkConnectedOverlayHasBackdrop]="nzBackdrop"
[cdkConnectedOverlayOrigin]="cdkOverlayOrigin"
[cdkConnectedOverlayOpen]="nzOpen"
[cdkConnectedOverlayTransformOriginOn]="'.ant-select-tree-dropdown'"
[cdkConnectedOverlayMinWidth]="$any(nzDropdownMatchSelectWidth ? null : triggerWidth)"
[cdkConnectedOverlayWidth]="$any(nzDropdownMatchSelectWidth ? triggerWidth : null)"
(overlayOutsideClick)="onClickOutside($event)"
(detach)="closeDropDown()"
(positionChange)="onPositionChange($event)"
>
<div
[]="'enter'"
[ngClass]="dropdownClassName"
[@.disabled]="noAnimation?.nzNoAnimation"
[nzNoAnimation]="noAnimation?.nzNoAnimation"
[class.ant-select-dropdown-placement-bottomLeft]="dropDownPosition === 'bottom'"
[class.ant-select-dropdown-placement-topLeft]="dropDownPosition === 'top'"
[class.ant-tree-select-dropdown-rtl]="dir === 'rtl'"
[dir]="dir"
[ngStyle]="nzDropdownStyle"
>
<nz-tree
#treeRef
[hidden]="isNotFound"
nzNoAnimation
nzSelectMode
nzBlockNode
[nzData]="nzNodes"
[nzMultiple]="nzMultiple"
[nzSearchValue]="inputValue"
[nzHideUnMatched]="nzHideUnMatched"
[nzShowIcon]="nzShowIcon"
[nzCheckable]="nzCheckable"
[nzAsyncData]="nzAsyncData"
[nzShowExpand]="nzShowExpand"
[nzShowLine]="nzShowLine"
[nzExpandedIcon]="nzExpandedIcon"
[nzExpandAll]="nzDefaultExpandAll"
[nzExpandedKeys]="expandedKeys"
[nzCheckedKeys]="nzCheckable ? value : []"
[nzSelectedKeys]="!nzCheckable ? value : []"
[nzTreeTemplate]="treeTemplate"
[nzCheckStrictly]="nzCheckStrictly"
[nzVirtualItemSize]="nzVirtualItemSize"
[nzVirtualMaxBufferPx]="nzVirtualMaxBufferPx"
[nzVirtualMinBufferPx]="nzVirtualMinBufferPx"
[nzVirtualHeight]="nzVirtualHeight"
(nzExpandChange)="onExpandedKeysChange($event)"
(nzClick)="nzTreeClick.emit($event)"
(nzCheckedKeysChange)="updateSelectedNodes()"
(nzSelectedKeysChange)="updateSelectedNodes()"
(nzCheckBoxChange)="nzTreeCheckBoxChange.emit($event)"
(nzSearchValueChange)="setSearchValues($event)"
></nz-tree>
<span *ngIf="nzNodes.length === 0 || isNotFound" class="ant-select-not-found">
<nz-embed-empty [nzComponentName]="'tree-select'" [specificContent]="nzNotFoundContent"></nz-embed-empty>
</span>
</div>
</ng-template>
<div cdkOverlayOrigin class="ant-select-selector">
<ng-container *ngIf="isMultiple">
<nz-select-item
*ngFor="let node of selectedNodes | slice: 0:nzMaxTagCount; trackBy: trackValue"
[deletable]="true"
[disabled]="node.isDisabled || nzDisabled"
[label]="nzDisplayWith(node)"
(delete)="removeSelected(node, true)"
></nz-select-item>
<nz-select-item
*ngIf="selectedNodes.length > nzMaxTagCount"
[contentTemplateOutlet]="nzMaxTagPlaceholder"
[contentTemplateOutletContext]="selectedNodes | slice: nzMaxTagCount"
[deletable]="false"
[disabled]="false"
[label]="'+ ' + (selectedNodes.length - nzMaxTagCount) + ' ...'"
></nz-select-item>
</ng-container>
<nz-select-search
[nzId]="nzId"
[showInput]="nzShowSearch"
(keydown)="onKeyDownInput($event)"
(isComposingChange)="isComposing = $event"
(valueChange)="setInputValue($event)"
[value]="inputValue"
[mirrorSync]="isMultiple"
[disabled]="nzDisabled"
[focusTrigger]="nzOpen"
></nz-select-search>
<nz-select-placeholder
*ngIf="nzPlaceHolder && selectedNodes.length === 0"
[placeholder]="nzPlaceHolder"
[style.display]="placeHolderDisplay"
></nz-select-placeholder>
<nz-select-item
*ngIf="!isMultiple && selectedNodes.length === 1 && !isComposing && inputValue === ''"
[deletable]="false"
[disabled]="false"
[label]="nzDisplayWith(selectedNodes[0])"
></nz-select-item>
<nz-select-arrow *ngIf="!isMultiple"></nz-select-arrow>
<nz-select-clear
*ngIf="nzAllowClear && !nzDisabled && selectedNodes.length"
(clear)="onClearSelection()"
></nz-select-clear>
</div>
`,
providers: [
NzTreeSelectService,
{
provide: NzTreeHigherOrderServiceToken,
useFactory: higherOrderServiceFactory,
deps: [[new Self(), Injector]]
},
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => NzTreeSelectComponent),
multi: true
}
],
host: {
class: 'ant-select',
'[class.ant-select-lg]': 'nzSize==="large"',
'[class.ant-select-rtl]': 'dir==="rtl"',
'[class.ant-select-sm]': 'nzSize==="small"',
'[class.ant-select-disabled]': 'nzDisabled',
'[class.ant-select-single]': '!isMultiple',
'[class.ant-select-show-arrow]': '!isMultiple',
'[class.ant-select-show-search]': '!isMultiple',
'[class.ant-select-multiple]': 'isMultiple',
'[class.ant-select-allow-clear]': 'nzAllowClear',
'[class.ant-select-open]': 'nzOpen',
'[class.ant-select-focused]': 'nzOpen || focused',
'(click)': 'trigger()',
'(keydown)': 'onKeydown($event)'
}
}]
}], ctorParameters: function () { return [{ type: NzTreeSelectService }, { type: i2.NzConfigService }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i3.Directionality, decorators: [{
type: Optional
}] }, { type: i4.FocusMonitor }, { type: i5.NzNoAnimationDirective, decorators: [{
type: Host
}, {
type: Optional
}] }]; }, propDecorators: { nzId: [{
type: Input
}], nzAllowClear: [{
type: Input
}], nzShowExpand: [{
type: Input
}], nzShowLine: [{
type: Input
}], nzDropdownMatchSelectWidth: [{
type: Input
}], nzCheckable: [{
type: Input
}], nzHideUnMatched: [{
type: Input
}], nzShowIcon: [{
type: Input
}], nzShowSearch: [{
type: Input
}], nzDisabled: [{
type: Input
}], nzAsyncData: [{
type: Input
}], nzMultiple: [{
type: Input
}], nzDefaultExpandAll: [{
type: Input
}], nzCheckStrictly: [{
type: Input
}], nzVirtualItemSize: [{
type: Input
}], nzVirtualMaxBufferPx: [{
type: Input
}], nzVirtualMinBufferPx: [{
type: Input
}], nzVirtualHeight: [{
type: Input
}], nzExpandedIcon: [{
type: Input
}], nzNotFoundContent: [{
type: Input
}], nzNodes: [{
type: Input
}], nzOpen: [{
type: Input
}], nzSize: [{
type: Input
}], nzPlaceHolder: [{
type: Input
}], nzDropdownStyle: [{
type: Input
}], nzDropdownClassName: [{
type: Input
}], nzBackdrop: [{
type: Input
}], nzExpandedKeys: [{
type: Input
}], nzDisplayWith: [{
type: Input
}], nzMaxTagCount: [{
type: Input
}], nzMaxTagPlaceholder: [{
type: Input
}], nzOpenChange: [{
type: Output
}], nzCleared: [{
type: Output
}], nzRemoved: [{
type: Output
}], nzExpandChange: [{
type: Output
}], nzTreeClick: [{
type: Output
}], nzTreeCheckBoxChange: [{
type: Output
}], nzSelectSearchComponent: [{
type: ViewChild,
args: [NzSelectSearchComponent, { static: false }]
}], treeRef: [{
type: ViewChild,
args: ['treeRef', { static: false }]
}], cdkOverlayOrigin: [{
type: ViewChild,
args: [CdkOverlayOrigin, { static: true }]
}], cdkConnectedOverlay: [{
type: ViewChild,
args: [CdkConnectedOverlay, { static: false }]
}], nzTreeTemplate: [{
type: Input
}], nzTreeTemplateChild: [{
type: ContentChild,
args: ['nzTreeTemplate', { static: true }]
}] } });
/**
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
*/
class NzTreeSelectModule {
}
NzTreeSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: NzTreeSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
NzTreeSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: NzTreeSelectModule, declarations: [NzTreeSelectComponent], imports: [BidiModule,
CommonModule,
OverlayModule,
FormsModule,
NzSelectModule,
NzTreeModule,
NzIconModule,
NzEmptyModule,
NzOverlayModule,
NzNoAnimationModule], exports: [NzTreeSelectComponent] });
NzTreeSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: NzTreeSelectModule, imports: [[
BidiModule,
CommonModule,
OverlayModule,
FormsModule,
NzSelectModule,
NzTreeModule,
NzIconModule,
NzEmptyModule,
NzOverlayModule,
NzNoAnimationModule
]] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: NzTreeSelectModule, decorators: [{
type: NgModule,
args: [{
imports: [
BidiModule,
CommonModule,
OverlayModule,
FormsModule,
NzSelectModule,
NzTreeModule,
NzIconModule,
NzEmptyModule,
NzOverlayModule,
NzNoAnimationModule
],
declarations: [NzTreeSelectComponent],
exports: [NzTreeSelectComponent]
}]
}] });
/**
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
*/
/**
* Generated bundle index. Do not edit.
*/
export { NzTreeSelectComponent, NzTreeSelectModule, NzTreeSelectService, higherOrderServiceFactory };
//# sourceMappingURL=ng-zorro-antd-tree-select.mjs.map