angular-custom-selector
Version:
```bash NOTE*** This library was generated using Angular CLI version 9.0.0. Therefore, it is recommended that you use a compatible version of Angular to ensure proper functionality ```
586 lines (573 loc) • 26.9 kB
JavaScript
import { __decorate } from 'tslib';
import { EventEmitter, Input, Output, Component, ChangeDetectorRef, ElementRef, HostListener, NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { TreeViewModule } from '@progress/kendo-angular-treeview';
import { ButtonsModule } from '@progress/kendo-angular-buttons';
function getFlatData(data, flattedData) {
return data.map(parent => {
if (parent.items.length > 0) {
flattedData.push(parent);
getFlatData(parent.items, flattedData);
}
else {
flattedData.push(parent);
}
});
}
let AngularCustomSelectorComponent = class AngularCustomSelectorComponent {
constructor() {
this.type = "single";
this.selectedId = null;
this.selectedName = 'Select';
this.enableAllNodes = false;
this.disabled = false;
this.onChange = new EventEmitter();
this.onFetchedData = new EventEmitter();
this.dataHierarchy = { data: [], flatData: [] };
}
ngOnInit() {
this.dataHierarchy.data = this.data;
getFlatData(this.data, this.dataHierarchy.flatData);
}
onFetched(data) {
this.onFetchedData.emit(data);
this.dataHierarchy = data;
}
updateLocationState(dataItem) {
this.onChange.emit(dataItem);
}
};
__decorate([
Input()
], AngularCustomSelectorComponent.prototype, "type", void 0);
__decorate([
Input()
], AngularCustomSelectorComponent.prototype, "labelText", void 0);
__decorate([
Input()
], AngularCustomSelectorComponent.prototype, "selectedId", void 0);
__decorate([
Input()
], AngularCustomSelectorComponent.prototype, "selectedName", void 0);
__decorate([
Input()
], AngularCustomSelectorComponent.prototype, "enableAllNodes", void 0);
__decorate([
Input()
], AngularCustomSelectorComponent.prototype, "disabled", void 0);
__decorate([
Input()
], AngularCustomSelectorComponent.prototype, "data", void 0);
__decorate([
Input()
], AngularCustomSelectorComponent.prototype, "hoverText", void 0);
__decorate([
Input()
], AngularCustomSelectorComponent.prototype, "displayName", void 0);
__decorate([
Input()
], AngularCustomSelectorComponent.prototype, "searchKey", void 0);
__decorate([
Output()
], AngularCustomSelectorComponent.prototype, "onChange", void 0);
__decorate([
Output()
], AngularCustomSelectorComponent.prototype, "onFetchedData", void 0);
AngularCustomSelectorComponent = __decorate([
Component({
selector: 'angular-custom-selector',
template: "<single-selector *ngIf=\"type == 'single'\" labelText=\"{{labelText}}\" class=\"location-selector-view\" [dataHierarchy]=\"dataHierarchy\"\r\n[enableAllNodes]=\"enableAllNodes\" selectedId=\"{{selectedId}}\" hoverText=\"{{hoverText}}\"\r\nselectedName=\"{{selectedName}}\" isIncludeFloatLocation=\"true\" [enableAllNodes]=\"enableAllNodes\"\r\n(onData)=\"onFetched($event)\" [selectorDisabled]=\"disabled\"\r\n(onChange)=\"updateLocationState($event)\" [displayName]=\"displayName\" [searchKey]=\"searchKey\" >\r\n</single-selector>\r\n\r\n<multi-selector *ngIf=\"type == 'multi'\" labelText=\"{{labelText}}\" class=\"location-selector-view\" [dataHierarchy]=\"dataHierarchy\"\r\n[enableAllNodes]=\"enableAllNodes\" selectedId=\"{{selectedId}}\" hoverText=\"{{hoverText}}\"\r\nselectedName=\"{{selectedName}}\" isIncludeFloatLocation=\"true\" [enableAllNodes]=\"enableAllNodes\"\r\n(onLocationsData)=\"onFetched($event)\" [selectorDisabled]=\"disabled\"\r\n(onChange)=\"updateLocationState($event)\" [displayName]=\"displayName\" [searchKey]=\"searchKey\" >\r\n</multi-selector>"
})
], AngularCustomSelectorComponent);
let MultiSelectorTreeViewComponent = class MultiSelectorTreeViewComponent {
constructor(cdRef) {
this.cdRef = cdRef;
this.isDisableParent = false;
this.closeEvent = new EventEmitter();
this.onChange = new EventEmitter();
this.enableAllNodes = false;
this.searchKey = "name";
this.checkedKeys = [];
}
ngOnChanges(changes) {
this.checkDefaultValue(changes.checkedKeys.currentValue, this.data);
}
ngOnInit() {
this.checkDefaultValue(this.checkedKeys, this.data);
this.onChange.emit(this.checkedKeys);
if (this.enableAllNodes) {
this.enableAll(this.data);
}
}
ngAfterContentInit() {
this.addExpandListItem(this.data);
}
ngAfterViewInit() {
this.cdRef.detectChanges();
}
checkDefaultValue(checkedKeys, items) {
for (var i = 0; i < items.length; i++) {
if (checkedKeys.indexOf(items[i].id) > -1) {
if (items[i].isSelectable) {
items[i].isSelected = true;
this.checkDefaultValue(checkedKeys, items[i].items);
}
else {
items[i].isSelected = false;
}
}
else {
items[i].isSelected = false;
this.checkDefaultValue(checkedKeys, items[i].items);
}
}
}
handleCheck(dataItem) {
dataItem.isSelected = !dataItem.isSelected;
this.handleChildCheck(dataItem.items, dataItem.isSelected);
this.checkedKeys = [];
this.checkedKeys = this.getCheckedKeys(this.data, this.checkedKeys);
this.onChange.emit(this.checkedKeys);
}
handleChildCheck(childItems, isSelected) {
for (var i = 0; i < childItems.length; i++) {
if (childItems[i].isSelectable) {
childItems[i].isSelected = isSelected;
this.handleChildCheck(childItems[i].items, isSelected);
}
else {
this.handleChildCheck(childItems[i].items, isSelected);
}
}
}
enableAll(data) {
data.map(item => {
item.isSelectable = true;
this.enableAll(item.items);
});
}
unCheckAll(items) {
for (var i = 0; i < items.length; i++) {
if (items[i].isSelectable) {
items[i].isSelected = false;
this.unCheckAll(items[i].items);
}
}
}
getCheckedKeys(items, keys) {
for (var i = 0; i < items.length; i++) {
if (items[i].isSelected) {
keys.push(items[i].id);
}
keys = this.getCheckedKeys(items[i].items, keys);
}
return keys;
}
showClick(dataItem) {
this.closeEvent.emit(dataItem);
}
addExpandListItem(treeItem) {
treeItem.forEach(item => {
if (item.hasChild) {
this.addExpandListItem(item.items);
}
});
}
};
MultiSelectorTreeViewComponent.ctorParameters = () => [
{ type: ChangeDetectorRef }
];
__decorate([
Input()
], MultiSelectorTreeViewComponent.prototype, "expandedKeys", void 0);
__decorate([
Input()
], MultiSelectorTreeViewComponent.prototype, "selectedId", void 0);
__decorate([
Input()
], MultiSelectorTreeViewComponent.prototype, "isDisableParent", void 0);
__decorate([
Input()
], MultiSelectorTreeViewComponent.prototype, "data", void 0);
__decorate([
Output()
], MultiSelectorTreeViewComponent.prototype, "closeEvent", void 0);
__decorate([
Output()
], MultiSelectorTreeViewComponent.prototype, "onChange", void 0);
__decorate([
Input()
], MultiSelectorTreeViewComponent.prototype, "displayName", void 0);
__decorate([
Input()
], MultiSelectorTreeViewComponent.prototype, "enableAllNodes", void 0);
__decorate([
Input()
], MultiSelectorTreeViewComponent.prototype, "searchKey", void 0);
__decorate([
Input()
], MultiSelectorTreeViewComponent.prototype, "checkedKeys", void 0);
MultiSelectorTreeViewComponent = __decorate([
Component({
selector: 'multi-selector-tree-view',
template: "<kendo-treeview [nodes]=\"data\" textField={{searchKey}} childrenField=\"items\" \r\n[(expandedKeys)]=\"expandedKeys\" expandBy=\"id\" \r\n[filterable]=\"true\" \r\n filterInputPlaceholder=\"Search\" kendoTreeViewExpandable \r\n kendoTreeViewHierarchyBinding>\r\n <ng-template kendoTreeViewNodeTemplate let-dataItem>\r\n <input [(ngModel)]=\"dataItem.isSelected\" (click)=\"handleCheck(dataItem)\" [disabled]=\"!dataItem.isSelectable\" class=\"k-checkbox\" type=\"checkbox\"\r\n kendoCheckBox /><span class=\"selectoritem\" (click)=\"handleCheck(dataItem)\" [ngClass]=\"{'disableNode': dataItem.isSelectable === false,'itemactive' : selectedId == dataItem.id}\"> \r\n {{ dataItem[displayName] }} \r\n </span> \r\n </ng-template>\r\n</kendo-treeview>\r\n",
styles: [":host ::ng-deep .k-checkbox{border-color:#000}:host ::ng-deep .k-textbox{width:100%;margin-bottom:8px}:host ::ng-deep .k-in.k-state-focused{box-shadow:none!important}:host ::ng-deep .selectoritem:hover{background-color:#005151;border-radius:3px;color:#fff;font-weight:500;cursor:default}:host ::ng-deep .k-treeview .k-icon{font-size:20px}:host ::ng-deep .k-treeview .k-in{padding:0;width:100%}:host ::ng-deep .selectoritem{padding:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}:host ::ng-deep .disableNode{opacity:.6;pointer-events:none}:host ::ng-deep .itemactive{color:#005151;font-weight:500}"]
})
], MultiSelectorTreeViewComponent);
let MultiSelectorComponent = class MultiSelectorComponent {
constructor(elementRef) {
this.elementRef = elementRef;
this.expandedKeys = [];
this.selectorOpened = false;
this.selectedName = "Select";
this.selectedId = 0;
this.isIncludeFloatLocation = true;
this.includeInactive = false;
this.enableAllNodes = false;
this.checkedKeys = [];
this.selectorDisabled = false;
this.onData = new EventEmitter();
this.onChange = new EventEmitter();
this.selectedItems = [];
}
ngOnInit() {
this.onData.emit(this.dataHierarchy);
this.addExpandListItem(this.dataHierarchy.data);
this.setDefaultValue(this.checkedKeys, this.dataHierarchy.data);
}
onGlobalClick(event) {
if (!this.elementRef.nativeElement.contains(event.target)) {
// clicked outside => close dropdown list
this.selectorOpened = false;
}
}
closeDropDown() {
this.selectorOpened = false;
}
onItemSelected(data) {
this.selectorOpened = false;
}
setDefaultValue(checkedKeys, items) {
for (var i = 0; i < items.length; i++) {
if (checkedKeys.indexOf(items[i].id) > -1) {
if (items[i].isSelectable) {
this.selectedItems.push(items[i]);
this.setDefaultValue(checkedKeys, items[i].items);
}
}
else {
this.setDefaultValue(checkedKeys, items[i].items);
}
}
}
addExpandListItem(treeItem) {
treeItem.forEach(item => {
if (item.items && item.items.length > 0) {
this.expandedKeys.push(item.id);
this.addExpandListItem(item.items);
}
});
}
handleChange(data) {
this.checkedKeys = data;
let locationsFlatArray = this.dataHierarchy.flatData;
let selectedLocatonsArray = locationsFlatArray.filter(item => data.indexOf(item.id) !== -1);
this.selectedItems = selectedLocatonsArray;
this.onChange.emit(this.selectedItems);
}
locationClick() {
this.selectorOpened = !this.selectorOpened;
}
onRemove(item) {
const index = this.selectedItems.findIndex((c) => c.id === item.id);
const checkedKeyIndex = this.checkedKeys.findIndex(k => k == item.id);
this.checkedKeys.splice(checkedKeyIndex, 1);
this.selectedItems.splice(index, 1);
this.onChange.emit(this.selectedItems);
}
};
MultiSelectorComponent.ctorParameters = () => [
{ type: ElementRef }
];
__decorate([
Input()
], MultiSelectorComponent.prototype, "selectedName", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "selectedId", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "labelText", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "hoverText", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "isIncludeFloatLocation", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "includeInactive", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "enableAllNodes", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "dataHierarchy", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "checkedKeys", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "selectorDisabled", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "displayName", void 0);
__decorate([
Input()
], MultiSelectorComponent.prototype, "searchKey", void 0);
__decorate([
Output()
], MultiSelectorComponent.prototype, "onData", void 0);
__decorate([
Output()
], MultiSelectorComponent.prototype, "onChange", void 0);
__decorate([
HostListener('document:mousedown', ['$event'])
], MultiSelectorComponent.prototype, "onGlobalClick", null);
MultiSelectorComponent = __decorate([
Component({
selector: 'multi-selector',
template: "<div class=\"row align-items-center\" (click)=\"closeDropDown()\">\r\n <div class=\"col-md-12\">\r\n <label *ngIf=\"labelText?.length > 0\">{{labelText}}</label>\r\n\r\n <div #menu class=\"d-flex justify-content-between location-selector-form\"\r\n [ngClass]=\"{'disableSelector':selectorDisabled,'location-selector-focus' : selectorOpened}\" id=\"ddlLocationy\"\r\n (click)=\"locationClick()\" [title]=\"hoverText\" (click)=\"$event.stopPropagation()\">\r\n <div >\r\n <span *ngIf=\"selectorDisabled && selectedItems.length<1\">\r\n {{selectedName}}\r\n </span>\r\n <span *ngIf=\"!selectorDisabled && selectedItems.length<1\">\r\n Select\r\n </span>\r\n\r\n <kendo-chip *ngFor=\"let selectedItem of selectedItems.slice(0,3)\"\r\n [label]=\"selectedItem[displayName]\" removable=\"true\" removeIcon=\"k-icon k-i-close\"\r\n (remove)=\"onRemove(selectedItem);\">\r\n </kendo-chip>\r\n </div>\r\n <div class=\"d-flex flex-column align-items-center ml-1\">\r\n <em class=\"fas fa-chevron-down\"></em>\r\n <span *ngIf=\"selectedItems?.length >3\">+{{selectedItems?.length-3}}\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"location-tree-wrapper p-2\" *ngIf=\"selectorOpened\" (click)=\"$event.stopPropagation()\">\r\n <multi-selector-tree-view [data]=\"dataHierarchy.data\" [enableAllNodes]=\"enableAllNodes\"\r\n [expandedKeys]=\"expandedKeys\" [displayName]=\"displayName\" \r\n [selectedId]=\"selectedId\" [checkedKeys]=\"checkedKeys\" (onChange)=\"handleChange($event)\"\r\n (closeEvent)=\"onItemSelected($event)\" [searchKey]=\"searchKey\" >\r\n </multi-selector-tree-view>\r\n </div>\r\n </div>\r\n</div>",
styles: [":host ::ng-deep .location-selector-form{align-items:center;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;color:#495057;cursor:pointer;display:block;font-size:.9rem;height:auto;font-weight:400;line-height:1.5;padding:.2rem .4rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:300px}:host ::ng-deep .location-selector-focus{background-color:#fff;box-shadow:0 0 0 .2rem rgba(0,81,81,.1);color:#495057;outline:0}:host ::ng-deep .location-tree-wrapper{position:absolute;z-index:10}:host ::ng-deep .disableSelector{opacity:.6;pointer-events:none}.k-chip{color:#fff;margin:2px;background-color:#005151;float:left;border-radius:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}.k-chip:last-child{max-width:230px}"]
})
], MultiSelectorComponent);
let MultiSelectorModule = class MultiSelectorModule {
};
MultiSelectorModule = __decorate([
NgModule({
declarations: [
MultiSelectorTreeViewComponent,
MultiSelectorComponent
],
imports: [
CommonModule,
TreeViewModule,
FormsModule,
ButtonsModule
],
exports: [
MultiSelectorComponent
],
entryComponents: [MultiSelectorComponent],
})
], MultiSelectorModule);
let SingleSelectorTreeViewComponent = class SingleSelectorTreeViewComponent {
constructor() {
this.enableAllNodes = false;
this.searchKey = "name";
this.closeEvent = new EventEmitter();
}
ngOnInit() {
if (this.enableAllNodes) {
this.enableAll(this.data);
}
}
ngAfterContentInit() {
this.addExpandListItem(this.data);
}
showClick(dataItem) {
this.closeEvent.emit(dataItem);
}
addExpandListItem(treeItem) {
treeItem.forEach(item => {
if (item.hasChild) {
this.addExpandListItem(item.items);
}
});
}
enableAll(data) {
data.map(item => {
item.isSelectable = true;
this.enableAll(item.items);
});
}
};
__decorate([
Input()
], SingleSelectorTreeViewComponent.prototype, "expandedKeys", void 0);
__decorate([
Input()
], SingleSelectorTreeViewComponent.prototype, "selectedId", void 0);
__decorate([
Input()
], SingleSelectorTreeViewComponent.prototype, "displayName", void 0);
__decorate([
Input()
], SingleSelectorTreeViewComponent.prototype, "enableAllNodes", void 0);
__decorate([
Input()
], SingleSelectorTreeViewComponent.prototype, "searchKey", void 0);
__decorate([
Input()
], SingleSelectorTreeViewComponent.prototype, "data", void 0);
__decorate([
Output()
], SingleSelectorTreeViewComponent.prototype, "closeEvent", void 0);
SingleSelectorTreeViewComponent = __decorate([
Component({
selector: 'single-selector-tree-view',
template: "<kendo-treeview [nodes]=\"data\" [textField]=\"searchKey\" childrenField=\"items\" [(expandedKeys)]=\"expandedKeys\"\r\n expandBy=\"id\" [filterable]=\"true\" filterInputPlaceholder=\"Search\" kendoTreeViewExpandable\r\n kendoTreeViewHierarchyBinding>\r\n <ng-template kendoTreeViewNodeTemplate let-dataItem>\r\n <span class=\"selectoritem\" (click)=\"showClick(dataItem)\"\r\n [ngClass]=\"{'disableNode': dataItem.isSelectable === false,'itemactive' : selectedId == dataItem.id}\">\r\n {{ dataItem[displayName] }}\r\n </span>\r\n </ng-template>\r\n</kendo-treeview>",
styles: [":host ::ng-deep .k-checkbox{border-color:#000}:host ::ng-deep .k-textbox{width:100%;margin-bottom:8px}:host ::ng-deep .k-in.k-state-focused{box-shadow:none!important}:host ::ng-deep .selectoritem:hover{background-color:#005151;border-radius:3px;color:#fff;font-weight:500;cursor:default}:host ::ng-deep .k-treeview .k-icon{font-size:20px}:host ::ng-deep .k-treeview .k-in{padding:0;width:100%}:host ::ng-deep .selectoritem{padding:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}:host ::ng-deep .disableNode{opacity:.6;pointer-events:none}:host ::ng-deep .itemactive{color:#005151;font-weight:500}"]
})
], SingleSelectorTreeViewComponent);
let SingleSelectorComponent = class SingleSelectorComponent {
constructor(elementRef) {
this.elementRef = elementRef;
this.expandedKeys = [];
this.selectorOpened = false;
this.disableSelector = false;
this.selectedName = "Select";
this.selectedId = 0;
this.isIncludeFloatLocation = true;
this.enableAllNodes = false;
this.selectableTypes = []; // an array of location types to be made selectable
this.selectorDisabled = false;
this.onChange = new EventEmitter();
this.onData = new EventEmitter();
}
ngOnInit() {
this.onData.emit(this.dataHierarchy);
if (this.dataHierarchy.data.length > 0 && this.dataHierarchy.data[0].items == null) {
this.disableSelector = true;
this.selectedName = "No branches available";
}
else if (this.selectedName == null && this.selectedId != null) {
// if a location name is not passed in as an input, we set it using the id
this.selectedName = this.dataHierarchy.flatData.find(l => l.id == this.selectedId).locationName;
}
this.addExpandListItem(this.dataHierarchy.data);
this.setDropDownState();
}
setDropDownState() {
this.disableSelector = this.selectorDisabled;
}
onGlobalClick(event) {
if (!this.elementRef.nativeElement.contains(event.target)) {
// clicked outside => close dropdown list
this.selectorOpened = false;
}
}
closeDropDown() {
this.selectorOpened = false;
}
onItemSelected(data) {
this.selectorOpened = false;
this.onChange.emit(data);
this.selectedName = data.name;
}
addExpandListItem(treeItem) {
treeItem.forEach(item => {
if (item.items && item.items.length > 0) {
this.expandedKeys.push(item.id);
this.addExpandListItem(item.items);
}
});
}
itemClick() {
if (!this.selectorDisabled) {
this.selectorOpened = !this.selectorOpened;
}
}
};
SingleSelectorComponent.ctorParameters = () => [
{ type: ElementRef }
];
__decorate([
Input()
], SingleSelectorComponent.prototype, "selectedName", void 0);
__decorate([
Input()
], SingleSelectorComponent.prototype, "selectedId", void 0);
__decorate([
Input()
], SingleSelectorComponent.prototype, "displayName", void 0);
__decorate([
Input()
], SingleSelectorComponent.prototype, "searchKey", void 0);
__decorate([
Input()
], SingleSelectorComponent.prototype, "labelText", void 0);
__decorate([
Input()
], SingleSelectorComponent.prototype, "hoverText", void 0);
__decorate([
Input()
], SingleSelectorComponent.prototype, "isIncludeFloatLocation", void 0);
__decorate([
Input()
], SingleSelectorComponent.prototype, "enableAllNodes", void 0);
__decorate([
Input()
], SingleSelectorComponent.prototype, "selectableTypes", void 0);
__decorate([
Input()
], SingleSelectorComponent.prototype, "selectorDisabled", void 0);
__decorate([
Input()
], SingleSelectorComponent.prototype, "dataHierarchy", void 0);
__decorate([
Output()
], SingleSelectorComponent.prototype, "onChange", void 0);
__decorate([
Output()
], SingleSelectorComponent.prototype, "onData", void 0);
__decorate([
HostListener('document:mousedown', ['$event'])
], SingleSelectorComponent.prototype, "onGlobalClick", null);
SingleSelectorComponent = __decorate([
Component({
selector: 'single-selector',
template: "<div class=\"row align-items-center\" (click)=\"closeDropDown()\">\r\n <div class=\"col-md-12\">\r\n <label *ngIf=\"labelText?.length > 0\">{{labelText}}</label>\r\n\r\n <div #menu class=\"d-flex justify-content-between location-selector-form\"\r\n [ngClass]=\"{'disableSelector':selectorDisabled,'location-selector-focus' : selectorOpened}\" id=\"ddlLocationy\"\r\n (click)=\"itemClick()\" (click)=\"$event.stopPropagation()\" [title]=\"hoverText\">\r\n <div class=\"selected-location\">{{selectedName}}</div>\r\n <div><em class=\"fas fa-chevron-down\"></em></div>\r\n </div>\r\n <div class=\"location-tree-wrapper p-2\" *ngIf=\"selectorOpened\" (click)=\"$event.stopPropagation()\">\r\n <single-selector-tree-view [data]=\"dataHierarchy.data\" [expandedKeys]=\"expandedKeys\" [enableAllNodes]=\"enableAllNodes\"\r\n [selectedId]=\"selectedId\" (closeEvent)=\"onItemSelected($event)\" [displayName]=\"displayName\" [searchKey]=\"searchKey\" >\r\n </single-selector-tree-view>\r\n </div>\r\n </div>\r\n</div>",
styles: [":host ::ng-deep .location-selector-form{cursor:pointer;display:block;width:300px;height:calc(1.5em + .75rem + 2px);padding:.375rem .75rem;font-size:.9rem;font-weight:400;line-height:1.5;color:#495057;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}:host ::ng-deep .location-selector-focus{color:#495057;background-color:#fff;outline:0;box-shadow:0 0 0 .2rem rgba(0,81,81,.1)}:host ::ng-deep .location-tree-wrapper{position:absolute;z-index:10}:host ::ng-deep .disableSelector{opacity:.6;cursor:default}.selected-location{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:350px}"]
})
], SingleSelectorComponent);
let SingleSelectorModule = class SingleSelectorModule {
};
SingleSelectorModule = __decorate([
NgModule({
declarations: [
SingleSelectorTreeViewComponent,
SingleSelectorComponent,
],
imports: [
CommonModule,
TreeViewModule
],
exports: [
SingleSelectorComponent
],
entryComponents: [SingleSelectorComponent],
})
], SingleSelectorModule);
let AngularCustomSelectorModule = class AngularCustomSelectorModule {
};
AngularCustomSelectorModule = __decorate([
NgModule({
declarations: [AngularCustomSelectorComponent],
imports: [
SingleSelectorModule,
MultiSelectorModule,
CommonModule
],
exports: [AngularCustomSelectorComponent]
})
], AngularCustomSelectorModule);
/*
* Public API Surface of angular-custom-selector
*/
/**
* Generated bundle index. Do not edit.
*/
export { AngularCustomSelectorComponent, AngularCustomSelectorModule, SingleSelectorModule as ɵa, SingleSelectorTreeViewComponent as ɵb, SingleSelectorComponent as ɵc, MultiSelectorModule as ɵd, MultiSelectorTreeViewComponent as ɵe, MultiSelectorComponent as ɵf };
//# sourceMappingURL=angular-custom-selector.js.map