@duoduo-oba/ng-devui
Version:
DevUI components based on Angular
910 lines (903 loc) • 36 kB
JavaScript
import { __assign, __read } from 'tslib';
import { EventEmitter, Component, forwardRef, Renderer2, ChangeDetectorRef, Input, ViewChild, ContentChild, Output, NgModule } from '@angular/core';
import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
import { TreeModule } from '@duoduo-oba/ng-devui/tree';
import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
import { I18nService } from '@duoduo-oba/ng-devui/i18n';
import { CommonModule } from '@angular/common';
import { CheckBoxModule } from '@duoduo-oba/ng-devui/checkbox';
import { LoadingModule } from '@duoduo-oba/ng-devui/loading';
import { PopperModule } from '@duoduo-oba/ng-devui/utils';
/**
* @fileoverview added by tsickle
* Generated from: tree-default-icons.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
var DefaultIcons = {
iconParentClose: "\n <span style=\"width: 14px; display: inline-block; content: '';\">\n <svg\n width=\"16px\"\n height=\"16px\"\n viewBox=\"0 0 16 16\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n >\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <path\n d=\"M3,2 L13,2 C13.5522847,2 14,2.44771525 14,3 L14,13 C14,13.5522847 13.5522847,14 13,14 L3,14 C2.44771525,14 2,13.5522847 2,\n 13 L2,3 C2,2.44771525 2.44771525,2 3,2 Z M7,7 L4,7 L4,9 L7,9 L7,12 L9,12 L9,9 L12,9 L12,7 L9,7 L9,4 L7,4 L7,7 Z\"\n fill=\"#5E6678\"\n fill-rule=\"nonzero\"\n ></path>\n </g>\n </svg>\n </span>\n ",
iconParentOpen: "\n <span style=\"width: 14px; display: inline-block; content: '';\">\n <svg\n width=\"16px\"\n height=\"16px\"\n viewBox=\"0 0 16 16\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n >\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <path\n d=\"M3,2 L13,2 C13.5522847,2 14,2.44771525 14,3 L14,13 C14,13.5522847 13.5522847,14 13,14 L3,14 C2.44771525,14 2,13.5522847 2,\n 13 L2,3 C2,2.44771525 2.44771525,2 3,2 Z M12,7 L4,7 L4,9 L12,9 L12,7 Z\"\n fill=\"#5E6678\"\n fill-rule=\"nonzero\"\n ></path>\n </g>\n </svg>\n </span>\n ",
iconLeaf: "\n <span style=\"width: 14px; display: inline-block; content: '';\"></span>\n "
};
var DefaultIcons$1 = __assign({}, DefaultIcons);
/**
* @fileoverview added by tsickle
* Generated from: tree-select.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var TreeSelectComponent = /** @class */ (function () {
function TreeSelectComponent(renderer, changeDetectorRef, i18n) {
this.renderer = renderer;
this.changeDetectorRef = changeDetectorRef;
this.i18n = i18n;
this.placeholder = '';
this.disabled = false;
this.expandTree = false;
this.multiple = false;
this.treeNodeIdKey = 'id';
this.treeNodeChildrenKey = 'children';
this.disabledKey = 'disabled';
this.leafOnly = false;
this.delimiter = ', ';
this.iconParentOpen = DefaultIcons$1.iconParentOpen;
this.iconParentClose = DefaultIcons$1.iconParentClose;
this.iconLeaf = DefaultIcons$1.iconLeaf;
this.closeOnNodeSelected = true;
this.width = null;
this.searchable = false;
this.appendTo = 'body';
this.treeNodeTitleKey = 'title';
this.allowUnselect = true;
this.valueChanged = new EventEmitter();
this._treeData = [];
this.searchString = null;
this.noRecord = false;
this._isOpen = false;
this._sourceTree = [];
this.readyEvent = (/**
* @param {?} treeSelect
* @return {?}
*/
function (treeSelect) {
});
this.onChange = (/**
* @param {?} _
* @return {?}
*/
function (_) { return null; });
this.onTouch = (/**
* @return {?}
*/
function () { return null; });
}
Object.defineProperty(TreeSelectComponent.prototype, "allowClear", {
get: /**
* @return {?}
*/
function () {
return !this.disabled && !this.multiple && this.allowUnselect && this._allowClear && !!this.selectedValue;
},
set: /**
* @param {?} allowClear
* @return {?}
*/
function (allowClear) {
this._allowClear = allowClear;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TreeSelectComponent.prototype, "treeData", {
get: /**
* @return {?}
*/
function () {
return this._treeData;
},
set: /**
* @param {?} treeData
* @return {?}
*/
function (treeData) {
this._sourceTree = treeData;
this.refreshTree(treeData);
},
enumerable: true,
configurable: true
});
Object.defineProperty(TreeSelectComponent.prototype, "isOpen", {
get: /**
* @return {?}
*/
function () {
return this._isOpen;
},
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
if (this._isOpen !== value) {
this._isOpen = value;
this.changeDetectorRef.detectChanges();
}
},
enumerable: true,
configurable: true
});
/**
* @return {?}
*/
TreeSelectComponent.prototype.ngAfterViewInit = /**
* @return {?}
*/
function () {
this.changeDetectorRef.detectChanges();
this.readyEvent(this);
if (this.searchable) {
this.registerSearchListener();
}
};
/**
* @param {?} changes
* @return {?}
*/
TreeSelectComponent.prototype.ngOnChanges = /**
* @param {?} changes
* @return {?}
*/
function (changes) {
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
if (this.i18nSubscription) {
this.i18nSubscription.unsubscribe();
}
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
this.setI18nText();
};
/**
* @param {?} fn
* @return {?}
*/
TreeSelectComponent.prototype.registerOnChange = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onChange = fn;
};
/**
* @param {?} fn
* @return {?}
*/
TreeSelectComponent.prototype.registerOnTouched = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onTouch = fn;
};
/**
* @param {?} isDisabled
* @return {?}
*/
TreeSelectComponent.prototype.setDisabledState = /**
* @param {?} isDisabled
* @return {?}
*/
function (isDisabled) {
this.disabled = isDisabled;
};
/**
* @param {?} value
* @return {?}
*/
TreeSelectComponent.prototype.writeValue = /**
* @param {?} value
* @return {?}
*/
function (value) {
this.value = this.multiple ? Object.assign([], value) : value;
this.refreshTree(this.treeData);
// Trigger visualization after tree data is fulfilled.
this.changeDetectorRef.detectChanges();
this.visualizeSelectedItems();
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.toggle = /**
* @return {?}
*/
function () {
var _this = this;
if (this.timer) {
clearTimeout(this.timer);
}
/** @type {?} */
var applyNow = !this.timer;
this.timer = setTimeout((/**
* @return {?}
*/
function () { _this.timer = null; }), 200);
if (applyNow) {
this.isOpen = !this.isOpen;
}
};
/**
* @private
* @return {?}
*/
TreeSelectComponent.prototype.setI18nText = /**
* @private
* @return {?}
*/
function () {
var _this = this;
this.i18nCommonText = this.i18n.getI18nText().common;
this.i18nSubscription = this.i18n.langChange().subscribe((/**
* @param {?} data
* @return {?}
*/
function (data) {
_this.i18nCommonText = data.common;
}));
};
/**
* @private
* @param {?} treeNode
* @return {?}
*/
TreeSelectComponent.prototype.expandAllNodes = /**
* @private
* @param {?} treeNode
* @return {?}
*/
function (treeNode) {
var _this = this;
if (Array.isArray(treeNode)) {
return treeNode.map((/**
* @param {?} node
* @return {?}
*/
function (node) { return _this.expandAllNodes(node); }));
}
else if (treeNode instanceof Object) {
if (treeNode.hasOwnProperty(this.treeNodeChildrenKey)) {
treeNode.open = true;
treeNode[this.treeNodeChildrenKey] = this.expandAllNodes(treeNode[this.treeNodeChildrenKey]);
}
return treeNode;
}
};
/**
* @private
* @param {?} treeNode
* @param {?=} expandTree
* @return {?}
*/
TreeSelectComponent.prototype.prepareTree = /**
* @private
* @param {?} treeNode
* @param {?=} expandTree
* @return {?}
*/
function (treeNode, expandTree) {
var _a;
var _this = this;
if (expandTree === void 0) { expandTree = false; }
if (Array.isArray(treeNode)) {
return treeNode.map((/**
* @param {?} node
* @return {?}
*/
function (node) { return _this.prepareTree(node, expandTree); }));
}
else if (treeNode) {
/** @type {?} */
var parentCheckedByChildren = false;
if (treeNode.hasOwnProperty(this.treeNodeChildrenKey)) {
treeNode.open = expandTree ? true : treeNode.open;
treeNode[this.treeNodeChildrenKey] = this.prepareTree(treeNode[this.treeNodeChildrenKey], expandTree);
if (this.multiple) {
_a = __read(this.resolveParentNode(treeNode[this.treeNodeChildrenKey]), 2), parentCheckedByChildren = _a[0], treeNode.halfChecked = _a[1];
}
}
if (treeNode.hasOwnProperty(this.treeNodeIdKey)) {
/** @type {?} */
var nodeId = treeNode[this.treeNodeIdKey];
if (this.multiple) {
/** @type {?} */
var selectedByValue = this.nodeSelected(nodeId);
treeNode.isActive = false;
treeNode.isChecked = selectedByValue || parentCheckedByChildren;
if (!this.leafOnly && !selectedByValue && parentCheckedByChildren) {
/** @type {?} */
var insertObject = {};
insertObject[this.treeNodeIdKey] = treeNode[this.treeNodeIdKey];
insertObject[this.treeNodeTitleKey] = treeNode[this.treeNodeTitleKey];
((/** @type {?} */ (this.value))).push(insertObject);
}
}
else {
treeNode.isChecked = false;
treeNode.isActive = this.nodeSelected(nodeId);
if (treeNode.isActive) {
this.currentActiveNode = treeNode;
}
}
}
return treeNode;
}
};
/**
* @private
* @param {?} treeNodeId
* @return {?}
*/
TreeSelectComponent.prototype.nodeSelected = /**
* @private
* @param {?} treeNodeId
* @return {?}
*/
function (treeNodeId) {
var _this = this;
if (!this.value) {
return false;
}
if (this.multiple && Array.isArray(this.value)) {
// polyfill Array.prototype.includes()
return this.value.map((/**
* @param {?} _
* @return {?}
*/
function (_) { return _[_this.treeNodeIdKey]; })).indexOf(treeNodeId) > -1;
}
else {
return this.value[this.treeNodeIdKey] && treeNodeId === this.value[this.treeNodeIdKey];
}
};
/**
* @private
* @param {?} treeNodes
* @return {?}
*/
TreeSelectComponent.prototype.resolveParentNode = /**
* @private
* @param {?} treeNodes
* @return {?}
*/
function (treeNodes) {
/** @type {?} */
var childrenFullCheckedCount = treeNodes.filter((/**
* @param {?} _
* @return {?}
*/
function (_) { return _.isChecked; })).length;
/** @type {?} */
var childrenCheckedCount = treeNodes.filter((/**
* @param {?} _
* @return {?}
*/
function (_) { return _.isChecked || _.halfChecked; })).length;
return [
childrenFullCheckedCount > 0 && treeNodes.length === childrenFullCheckedCount,
childrenCheckedCount > 0 && treeNodes.length > childrenFullCheckedCount
];
};
/**
* @private
* @param {?} treeData
* @return {?}
*/
TreeSelectComponent.prototype.refreshTree = /**
* @private
* @param {?} treeData
* @return {?}
*/
function (treeData) {
this._treeData = Object.assign([], this.prepareTree(treeData, this.expandTree));
};
/**
* @param {?} selectedNodes
* @return {?}
*/
TreeSelectComponent.prototype.onOperableNodeChecked = /**
* @param {?} selectedNodes
* @return {?}
*/
function (selectedNodes) {
var _this = this;
/** @type {?} */
var selectedValueExtractor = (/**
* @param {?} _selectedNodes
* @return {?}
*/
function (_selectedNodes) {
return _this.leafOnly ?
_selectedNodes.filter((/**
* @param {?} _
* @return {?}
*/
function (_) { return !_.data.isParent; })).map((/**
* @param {?} _
* @return {?}
*/
function (_) { return _.data.originItem; })) :
_selectedNodes.map((/**
* @param {?} _
* @return {?}
*/
function (_) { return _.data.originItem; }));
});
if (this.multiple) {
this.value = selectedValueExtractor(selectedNodes);
this.emitEvents();
}
};
/**
* @param {?} selectedNode
* @return {?}
*/
TreeSelectComponent.prototype.onOperableNodeSelected = /**
* @param {?} selectedNode
* @return {?}
*/
function (selectedNode) {
if (!this.multiple) {
if (this.leafOnly && selectedNode.data.isParent) {
return;
}
if (selectedNode.data.isActive) {
this.currentActiveNode = selectedNode.data.originItem;
this.value = selectedNode.data.originItem;
// Configurable close on node selected
if (this.closeOnNodeSelected) {
this.isOpen = false;
}
}
else {
if (this.allowUnselect) {
this.currentActiveNode = null;
this.value = null;
}
else {
selectedNode.data.isActive = true;
if (this.closeOnNodeSelected) {
this.isOpen = false;
}
}
}
this.emitEvents();
}
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.emitEvents = /**
* @return {?}
*/
function () {
this.visualizeSelectedItems();
this.onChange(this.value);
this.valueChanged.emit(this.selectedValue());
this.onTouch();
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.visualizeSelectedItems = /**
* @return {?}
*/
function () {
if (this.multiple) {
this.visualizeMultipleValue();
}
else {
this.visualizeSingleValue();
}
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.visualizeMultipleValue = /**
* @return {?}
*/
function () {
var _this = this;
if (this.tree && this.tree.treeFactory) {
/** @type {?} */
var selectedNodes = (/** @type {?} */ (this.selectedValue()));
/** @type {?} */
var valueText = selectedNodes.map((/**
* @param {?} _
* @return {?}
*/
function (_) { return _[_this.treeNodeTitleKey]; })).join(this.delimiter);
this.renderer.setAttribute(this.selectHost.nativeElement, 'value', valueText);
}
else {
this.emptyInput();
}
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.visualizeSingleValue = /**
* @return {?}
*/
function () {
if (this.value && this.value[this.treeNodeTitleKey]) {
/** @type {?} */
var valueText = this.value[this.treeNodeTitleKey];
this.renderer.setAttribute(this.selectHost.nativeElement, 'value', valueText);
}
else {
this.emptyInput();
}
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.emptyInput = /**
* @return {?}
*/
function () {
this.renderer.setAttribute(this.selectHost.nativeElement, 'value', '');
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.selectedValue = /**
* @return {?}
*/
function () {
return this.value;
};
/**
* @param {?} popperState
* @return {?}
*/
TreeSelectComponent.prototype.responsePopperChange = /**
* @param {?} popperState
* @return {?}
*/
function (popperState) {
if (popperState && this.searchable) {
this.focusSearchInput();
}
};
/**
* @private
* @return {?}
*/
TreeSelectComponent.prototype.focusSearchInput = /**
* @private
* @return {?}
*/
function () {
if (this.searchInput.nativeElement) {
this.searchInput.nativeElement.focus();
}
};
/**
* @param {?} searchString
* @return {?}
*/
TreeSelectComponent.prototype.search = /**
* @param {?} searchString
* @return {?}
*/
function (searchString) {
/** @type {?} */
var searchRes = this.tree.treeFactory.searchTree(searchString, true);
if (typeof searchRes === 'boolean') {
this.noRecord = searchRes;
}
else if (Array.isArray(searchRes)) {
this.noRecord = searchRes.every((/**
* @param {?} res
* @return {?}
*/
function (res) { return !res; }));
}
this.popper.update();
};
/**
* @private
* @return {?}
*/
TreeSelectComponent.prototype.registerSearchListener = /**
* @private
* @return {?}
*/
function () {
var _this = this;
this.searchInputModel.valueChanges.pipe(debounceTime(500), distinctUntilChanged()).subscribe((/**
* @param {?} searchString
* @return {?}
*/
function (searchString) {
_this.search(searchString);
}));
};
/**
* @private
* @return {?}
*/
TreeSelectComponent.prototype.scrollToSelected = /**
* @private
* @return {?}
*/
function () {
if (this.multiple) {
return;
}
/** @type {?} */
var selectedNode = this.optionsContainer.nativeElement.querySelector('.tree-node.operable-tree-node.selected');
/** @type {?} */
var scrollableContainer = this.optionsContainer.nativeElement.parentNode;
if (!selectedNode || !scrollableContainer) {
return;
}
/** @type {?} */
var scrollOffset = selectedNode.offsetTop;
scrollableContainer.scrollTo({ top: (scrollOffset - scrollableContainer.scrollTop) });
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.clearValue = /**
* @return {?}
*/
function () {
if (this.treeData && this.treeData.length > 0 && !this.disabled && !this.multiple && !!this.selectedValue) {
this.tree.treeFactory.deactivateAllNodes();
this.currentActiveNode = null;
this.value = null;
this.emitEvents();
}
};
/**
* @return {?}
*/
TreeSelectComponent.prototype.onNodeToggled = /**
* @return {?}
*/
function () {
if (this.popper) {
this.popper.update();
}
};
TreeSelectComponent.decorators = [
{ type: Component, args: [{
selector: 'd-tree-select',
template: "<div class=\"devui-tree-select\">\r\n <popper-component [(open)]=\"isOpen\" [fluidPopper]=\"!width\" (openChange)=\"responsePopperChange($event)\" [appendTo]=\"appendTo\" #popper>\r\n <input\r\n #selectHost\r\n class=\"devui-select-input devui-input devui-form-control devui-tree-select-input\"\r\n (click)=\"toggle()\"\r\n [placeholder]=\"placeholder\"\r\n autocomplete=\"off\"\r\n [disabled]=\"disabled\"\r\n readonly\r\n popper-activator\r\n />\r\n <div popper-prepend class=\"devui-tree-select devui-search-container\" *ngIf=\"searchable\">\r\n <input class=\"devui-input\" [(ngModel)]=\"searchString\" #searchInputModel=\"ngModel\" #searchInput />\r\n </div>\r\n <div class=\"devui-tree-select devui-options-container\" #optionsContainer popper-container [ngStyle]=\"{ width: width }\">\r\n <d-operable-tree\r\n #tree\r\n [style.display]=\"treeData && treeData.length > 0 && !noRecord ? 'block' : 'none'\"\r\n [tree]=\"treeData\"\r\n [treeNodeIdKey]=\"treeNodeIdKey\"\r\n [treeNodeChildrenKey]=\"treeNodeChildrenKey\"\r\n [checkboxDisabledKey]=\"disabledKey\"\r\n [checkboxInput]=\"checkboxInput\"\r\n [checkable]=\"multiple\"\r\n [canActivateNode]=\"!multiple\"\r\n [canActivateParentNode]=\"!leafOnly\"\r\n (nodeChecked)=\"onOperableNodeChecked($event)\"\r\n (nodeSelected)=\"onOperableNodeSelected($event)\"\r\n (nodeToggled)=\"onNodeToggled()\"\r\n [iconParentOpen]=\"iconParentOpen\"\r\n [iconParentClose]=\"iconParentClose\"\r\n [iconLeaf]=\"iconLeaf\"\r\n [treeNodeTitleKey]=\"treeNodeTitleKey\"\r\n [iconTemplatePosition]=\"iconTemplatePosition\"\r\n class=\"devui-tree\"\r\n >\r\n <ng-template *ngIf=\"iconTemplateInput || iconTemplatePassThrough\" #iconTemplate let-node=\"node\">\r\n <ng-template [ngTemplateOutlet]=\"iconTemplateInput || iconTemplatePassThrough\" [ngTemplateOutletContext]=\"{ node: node }\">\r\n </ng-template>\r\n </ng-template>\r\n </d-operable-tree>\r\n <div *ngIf=\"!treeData || treeData.length <= 0\" class=\"devui-no-data-tip\">\r\n {{ i18nCommonText?.noData }}\r\n </div>\r\n <div *ngIf=\"noRecord\" class=\"devui-no-data-tip\">\r\n {{ i18nCommonText?.noRecordsFound }}\r\n </div>\r\n </div>\r\n </popper-component>\r\n <div\r\n [ngClass]=\"{ disabled: disabled, clear: allowClear }\"\r\n (click)=\"$event.stopPropagation(); $event.preventDefault(); clearValue()\"\r\n ></div>\r\n <span class=\"devui-select-chevron-icon\" [class.open]=\"isOpen\" [ngClass]=\"{ disabled: disabled, clear: allowClear }\">\r\n <svg width=\"14px\" height=\"14px\" viewBox=\"0 0 16 16\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"chevron_down\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <polygon id=\"chevron_down\" points=\"4.5 5 8 8.76923077 11.5 5 13 6.61538462 8 12 3 6.61538462\"></polygon>\r\n </g>\r\n </svg>\r\n </span>\r\n</div>\r\n",
exportAs: 'select',
providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef((/**
* @return {?}
*/
function () { return TreeSelectComponent; })),
multi: true
}
],
styles: [".devui-tree-select{position:relative;width:100%}.devui-tree-select input.devui-select-input{cursor:pointer;display:inline-block;width:100%;color:#252b3a;text-overflow:ellipsis}.devui-tree-select input.devui-select-input.devui-tree-select-input{padding:5px 2em 5px 10px}.devui-tree-select:hover .clear{position:absolute;height:14px;width:14px;right:12px;top:calc((100% - 14px)/ 2);cursor:pointer}.devui-tree-select:hover .clear::after,.devui-tree-select:hover .clear::before{position:absolute;content:'';height:14px;width:1px;background-color:#252b3a;left:50%}.devui-tree-select:hover .clear::before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.devui-tree-select:hover .clear::after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.devui-tree-select:hover .clear:hover::after,.devui-tree-select:hover .clear:hover::before{background-color:#252b3a}.devui-tree-select .devui-select-chevron-icon{right:12px;top:calc((100% - 14px)/ 2);position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}.devui-tree-select .devui-select-chevron-icon svg{-webkit-transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s}.devui-tree-select .devui-select-chevron-icon.open svg{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.devui-tree-select .devui-select-chevron-icon.clear{opacity:0}.devui-tree-select .devui-select-chevron-icon.disabled{opacity:.3}.devui-tree-select .devui-select-chevron-icon ::ng-deep g{fill:#252b3a}.devui-tree-select:not(:hover) .devui-select-chevron-icon:not(.disabled){opacity:1;-webkit-transition:opacity .1s linear;transition:opacity .1s linear}.devui-tree-select.devui-options-container{width:100%;color:#252b3a;padding:5px 0}.devui-tree-select.devui-options-container .devui-tree ::ng-deep .devui-tree-node.devui-operable-tree-node .devui-tree-node__content{margin-left:10px}.devui-tree-select.devui-options-container .devui-tree ::ng-deep .devui-tree-node.devui-operable-tree-node .active{background-color:transparent}.devui-tree-select.devui-options-container .devui-tree ::ng-deep .devui-tree-node.devui-operable-tree-node.selected{position:relative;-webkit-width:-webkit-fit-content;-moz-width:-moz-fit-content;width:fit-content;min-width:calc(100% - 1.2em)}.devui-tree-select.devui-options-container .devui-tree ::ng-deep .devui-tree-node.devui-operable-tree-node.selected::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:#f2f5fc;z-index:-1}.devui-tree-select.devui-options-container .devui-no-data-tip{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:not-allowed;padding:5px 12px;opacity:.3}.devui-tree-select.devui-search-container{padding:5px}:host{display:inline-block;width:100%}"]
}] }
];
/** @nocollapse */
TreeSelectComponent.ctorParameters = function () { return [
{ type: Renderer2 },
{ type: ChangeDetectorRef },
{ type: I18nService }
]; };
TreeSelectComponent.propDecorators = {
allowClear: [{ type: Input }],
treeData: [{ type: Input }],
placeholder: [{ type: Input }],
disabled: [{ type: Input }],
expandTree: [{ type: Input }],
multiple: [{ type: Input }],
treeNodeIdKey: [{ type: Input }],
treeNodeChildrenKey: [{ type: Input }],
disabledKey: [{ type: Input }],
leafOnly: [{ type: Input }],
delimiter: [{ type: Input }],
iconParentOpen: [{ type: Input }],
iconParentClose: [{ type: Input }],
iconLeaf: [{ type: Input }],
closeOnNodeSelected: [{ type: Input }],
width: [{ type: Input }],
searchable: [{ type: Input }],
appendTo: [{ type: Input }],
treeNodeTitleKey: [{ type: Input }],
allowUnselect: [{ type: Input }],
iconTemplatePosition: [{ type: Input }],
iconTemplateInput: [{ type: Input }],
selectHost: [{ type: ViewChild, args: ['selectHost', { static: true },] }],
optionsContainer: [{ type: ViewChild, args: ['optionsContainer', { static: true },] }],
tree: [{ type: ViewChild, args: ['tree', { static: true },] }],
searchInput: [{ type: ViewChild, args: ['searchInput', { static: false },] }],
searchInputModel: [{ type: ViewChild, args: ['searchInputModel', { static: false },] }],
popper: [{ type: ViewChild, args: ['popper', { static: true },] }],
iconTemplatePassThrough: [{ type: ContentChild, args: ['iconTemplate', { static: false },] }],
valueChanged: [{ type: Output }],
readyEvent: [{ type: Input }]
};
return TreeSelectComponent;
}());
if (false) {
/** @type {?} */
TreeSelectComponent.prototype.placeholder;
/** @type {?} */
TreeSelectComponent.prototype.disabled;
/** @type {?} */
TreeSelectComponent.prototype.expandTree;
/** @type {?} */
TreeSelectComponent.prototype.multiple;
/** @type {?} */
TreeSelectComponent.prototype.treeNodeIdKey;
/** @type {?} */
TreeSelectComponent.prototype.treeNodeChildrenKey;
/** @type {?} */
TreeSelectComponent.prototype.disabledKey;
/** @type {?} */
TreeSelectComponent.prototype.leafOnly;
/** @type {?} */
TreeSelectComponent.prototype.delimiter;
/** @type {?} */
TreeSelectComponent.prototype.iconParentOpen;
/** @type {?} */
TreeSelectComponent.prototype.iconParentClose;
/** @type {?} */
TreeSelectComponent.prototype.iconLeaf;
/** @type {?} */
TreeSelectComponent.prototype.closeOnNodeSelected;
/** @type {?} */
TreeSelectComponent.prototype.width;
/** @type {?} */
TreeSelectComponent.prototype.searchable;
/** @type {?} */
TreeSelectComponent.prototype.appendTo;
/** @type {?} */
TreeSelectComponent.prototype.treeNodeTitleKey;
/** @type {?} */
TreeSelectComponent.prototype.allowUnselect;
/** @type {?} */
TreeSelectComponent.prototype.iconTemplatePosition;
/** @type {?} */
TreeSelectComponent.prototype.iconTemplateInput;
/** @type {?} */
TreeSelectComponent.prototype.selectHost;
/** @type {?} */
TreeSelectComponent.prototype.optionsContainer;
/** @type {?} */
TreeSelectComponent.prototype.tree;
/** @type {?} */
TreeSelectComponent.prototype.searchInput;
/** @type {?} */
TreeSelectComponent.prototype.searchInputModel;
/** @type {?} */
TreeSelectComponent.prototype.popper;
/** @type {?} */
TreeSelectComponent.prototype.iconTemplatePassThrough;
/** @type {?} */
TreeSelectComponent.prototype.valueChanged;
/** @type {?} */
TreeSelectComponent.prototype.checkboxInput;
/** @type {?} */
TreeSelectComponent.prototype._treeData;
/** @type {?} */
TreeSelectComponent.prototype.value;
/** @type {?} */
TreeSelectComponent.prototype.currentActiveNode;
/** @type {?} */
TreeSelectComponent.prototype.searchString;
/** @type {?} */
TreeSelectComponent.prototype.i18nCommonText;
/** @type {?} */
TreeSelectComponent.prototype.i18nSubscription;
/** @type {?} */
TreeSelectComponent.prototype.noRecord;
/**
* @type {?}
* @private
*/
TreeSelectComponent.prototype._isOpen;
/**
* @type {?}
* @private
*/
TreeSelectComponent.prototype._sourceTree;
/**
* @type {?}
* @private
*/
TreeSelectComponent.prototype._allowClear;
/**
* @type {?}
* @private
*/
TreeSelectComponent.prototype.timer;
/** @type {?} */
TreeSelectComponent.prototype.readyEvent;
/**
* @type {?}
* @private
*/
TreeSelectComponent.prototype.onChange;
/**
* @type {?}
* @private
*/
TreeSelectComponent.prototype.onTouch;
/**
* @type {?}
* @protected
*/
TreeSelectComponent.prototype.renderer;
/**
* @type {?}
* @protected
*/
TreeSelectComponent.prototype.changeDetectorRef;
/**
* @type {?}
* @private
*/
TreeSelectComponent.prototype.i18n;
}
/**
* @fileoverview added by tsickle
* Generated from: tree-select.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var TreeSelectModule = /** @class */ (function () {
function TreeSelectModule() {
}
TreeSelectModule.decorators = [
{ type: NgModule, args: [{
imports: [
CommonModule,
FormsModule,
CheckBoxModule,
LoadingModule,
TreeModule,
PopperModule
],
exports: [TreeSelectComponent],
declarations: [
TreeSelectComponent,
],
providers: []
},] }
];
return TreeSelectModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: public-api.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: ng-devui-tree-select.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { DefaultIcons, TreeSelectComponent, TreeSelectModule };
//# sourceMappingURL=ng-devui-tree-select.js.map