ng-zenduit 1.0.49 → 1.0.51

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -99,7 +99,7 @@ export class ZenduColumnConfigurationComponent {
99
99
  }
100
100
  }
101
101
  ZenduColumnConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduColumnConfigurationComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
102
- ZenduColumnConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduColumnConfigurationComponent, selector: "zen-column-configuration", inputs: { configuration: "configuration", defaultConfiguration: "defaultConfiguration", dropdownPosition: "dropdownPosition" }, outputs: { configurationChange: "configurationChange" }, host: { listeners: { "window:mousedown": "outsideHandling($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"column-config-component\">\n <button class=\"button-basic button-icon\"\n [ngClass]=\"{ 'active': showPanel }\"\n (click)=\"togglePanel()\">\n <i class=\"material-icons\">view_column</i>\n </button>\n\n <div *ngIf=\"showPanel\"\n class=\"action-menu column-config-menu\"\n [ngClass]=\"{'right': dropdownPosition === 'right'}\">\n <div class=\"action-menu-header\">\n <div class=\"title\">Manage Columns</div>\n <zen-search-box [(text)]=\"searchText\"\n (textChange)=\"filterItems()\"></zen-search-box>\n </div>\n\n\n <div class=\"action-menu-body dnd-container\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\">\n <div *ngFor=\"let config of filteredColumnsConfiguration\"\n class=\"action-item-checkbox drag-item\"\n cdkDrag>\n <zen-checkbox class=\"flex-1\"\n [(checked)]=\"config.isVisible\"\n [label]=\"config.displayName\"></zen-checkbox>\n <i class=\"material-icons drag-icon\">drag_handle</i>\n </div>\n </div>\n\n <div class=\"action-menu-footer\">\n <button (click)=\"reset()\"\n type=\"button\"\n class=\"button-stroked full-width\">Reset</button>\n <button (click)=\"apply()\"\n type=\"button\"\n class=\"button-flat full-width\">Apply</button>\n </div>\n </div>\n</div>\n", styles: [".column-config-component{display:inline-block;position:relative}.column-config-component .column-config-menu{top:115%;width:300px}.column-config-component .column-config-menu.right{right:0}.column-config-component .column-config-menu .dnd-container{max-height:218px;overflow-y:auto}.column-config-component .column-config-menu .dnd-container .drag-item{justify-content:space-between}.column-config-component .column-config-menu .dnd-container .drag-item .drag-icon{cursor:move;color:#b8b9bc}.column-config-component .column-config-menu .dnd-container .dndDraggingSource{display:none}.column-config-component .column-config-menu .dnd-container .dndPlaceholder{background-color:#b8b9bc;display:block;min-height:40px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i3.ZenduCheckboxComponent, selector: "zen-checkbox", inputs: ["checked", "label", "disabled", "disableValueChange", "indeterminate", "imageUrl"], outputs: ["checkedChange"] }, { kind: "component", type: i4.ZenduSearchBoxComponent, selector: "zen-search-box", inputs: ["text", "delay", "autoFocus", "placeholder"], outputs: ["textChange"] }] });
102
+ ZenduColumnConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduColumnConfigurationComponent, selector: "zen-column-configuration", inputs: { configuration: "configuration", defaultConfiguration: "defaultConfiguration", dropdownPosition: "dropdownPosition" }, outputs: { configurationChange: "configurationChange" }, host: { listeners: { "window:mousedown": "outsideHandling($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"column-config-component\">\n <button class=\"button-basic button-icon\"\n [ngClass]=\"{ 'active': showPanel }\"\n (click)=\"togglePanel()\">\n <i class=\"material-icons\">view_column</i>\n </button>\n\n <div *ngIf=\"showPanel\"\n class=\"action-menu column-config-menu\"\n [ngClass]=\"{'right': dropdownPosition === 'right'}\">\n <div class=\"action-menu-header\">\n <div class=\"title\">Manage Columns</div>\n <zen-search-box [(text)]=\"searchText\"\n (textChange)=\"filterItems()\"></zen-search-box>\n </div>\n\n\n <div class=\"action-menu-body dnd-container\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\">\n <div *ngFor=\"let config of filteredColumnsConfiguration\"\n class=\"action-item-checkbox drag-item\"\n cdkDrag>\n <zen-checkbox class=\"flex-1\"\n [(checked)]=\"config.isVisible\"\n [label]=\"config.displayName\"></zen-checkbox>\n <i class=\"material-icons drag-icon\">drag_handle</i>\n </div>\n </div>\n\n <div class=\"action-menu-footer\">\n <button (click)=\"reset()\"\n type=\"button\"\n class=\"button-stroked full-width\">Reset</button>\n <button (click)=\"apply()\"\n type=\"button\"\n class=\"button-flat full-width\">Apply</button>\n </div>\n </div>\n</div>\n", styles: [".column-config-component{display:inline-block;position:relative}.column-config-component .column-config-menu{top:115%;width:300px}.column-config-component .column-config-menu.right{right:0}.column-config-component .column-config-menu .dnd-container{max-height:218px;overflow-y:auto}.column-config-component .column-config-menu .dnd-container .drag-item{justify-content:space-between}.column-config-component .column-config-menu .dnd-container .drag-item .drag-icon{cursor:move;color:#b8b9bc}.column-config-component .column-config-menu .dnd-container .dndDraggingSource{display:none}.column-config-component .column-config-menu .dnd-container .dndPlaceholder{background-color:#b8b9bc;display:block;min-height:40px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i3.ZenduCheckboxComponent, selector: "zen-checkbox", inputs: ["checked", "label", "disabled", "disableValueChange", "indeterminate", "imageUrl"], outputs: ["checkedChange"] }, { kind: "component", type: i4.ZenduSearchBoxComponent, selector: "zen-search-box", inputs: ["text", "delay", "autoFocus", "disabled", "placeholder"], outputs: ["textChange"] }] });
103
103
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduColumnConfigurationComponent, decorators: [{
104
104
  type: Component,
105
105
  args: [{ selector: 'zen-column-configuration', template: "<div class=\"column-config-component\">\n <button class=\"button-basic button-icon\"\n [ngClass]=\"{ 'active': showPanel }\"\n (click)=\"togglePanel()\">\n <i class=\"material-icons\">view_column</i>\n </button>\n\n <div *ngIf=\"showPanel\"\n class=\"action-menu column-config-menu\"\n [ngClass]=\"{'right': dropdownPosition === 'right'}\">\n <div class=\"action-menu-header\">\n <div class=\"title\">Manage Columns</div>\n <zen-search-box [(text)]=\"searchText\"\n (textChange)=\"filterItems()\"></zen-search-box>\n </div>\n\n\n <div class=\"action-menu-body dnd-container\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\">\n <div *ngFor=\"let config of filteredColumnsConfiguration\"\n class=\"action-item-checkbox drag-item\"\n cdkDrag>\n <zen-checkbox class=\"flex-1\"\n [(checked)]=\"config.isVisible\"\n [label]=\"config.displayName\"></zen-checkbox>\n <i class=\"material-icons drag-icon\">drag_handle</i>\n </div>\n </div>\n\n <div class=\"action-menu-footer\">\n <button (click)=\"reset()\"\n type=\"button\"\n class=\"button-stroked full-width\">Reset</button>\n <button (click)=\"apply()\"\n type=\"button\"\n class=\"button-flat full-width\">Apply</button>\n </div>\n </div>\n</div>\n", styles: [".column-config-component{display:inline-block;position:relative}.column-config-component .column-config-menu{top:115%;width:300px}.column-config-component .column-config-menu.right{right:0}.column-config-component .column-config-menu .dnd-container{max-height:218px;overflow-y:auto}.column-config-component .column-config-menu .dnd-container .drag-item{justify-content:space-between}.column-config-component .column-config-menu .dnd-container .drag-item .drag-icon{cursor:move;color:#b8b9bc}.column-config-component .column-config-menu .dnd-container .dndDraggingSource{display:none}.column-config-component .column-config-menu .dnd-container .dndPlaceholder{background-color:#b8b9bc;display:block;min-height:40px}\n"] }]
@@ -618,7 +618,7 @@ export class ZenduFilterComponent {
618
618
  }
619
619
  }
620
620
  ZenduFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
621
- ZenduFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduFilterComponent, selector: "zen-filter", inputs: { config: "config", filter: "filter", position: "position", resetBehavior: "resetBehavior", isVisible: "isVisible", customTrigger: "customTrigger", imageUrl: "imageUrl", label: "label", showOptions: "showOptions", customOptions: "customOptions", wrapperBodyClass: "wrapperBodyClass" }, outputs: { filterChange: "filterChange", isVisibleChange: "isVisibleChange" }, host: { listeners: { "window:mousedown": "outsideHandling($event)", "window:resize": "windowSizeHandling($event)", "window:scroll": "windowScroll($event)", "window:wheel": "handleMouseScroll($event)", "window:keydown": "onWindowKeyDown($event)" } }, viewQueries: [{ propertyName: "searchBox", first: true, predicate: ["searchBox"], descendants: true }, { propertyName: "_componentElement", first: true, predicate: ["mainComponent"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"filters-component\"\n #mainComponent\n click-out=\"isVisible && hide()\">\n\n <ng-container *ngIf=\"!customTrigger\">\n <button (click)=\"toggle()\"\n class=\"button-stroked filter {{isApplied ? 'applied' : ''}}\">\n <zen-icon [src]=\"imageUrl\"\n *ngIf=\"imageUrl\"></zen-icon>\n <i class=\"filter-icon material-icons\"\n *ngIf=\"!imageUrl\">filter_list</i>\n <span *ngIf=\"label\">{{ label | translate }}</span>\n </button>\n </ng-container>\n\n <ng-content *ngIf=\"customTrigger\"></ng-content>\n\n <div [hidden]=\"!isVisible\"\n class=\"action-menu menu-content\"\n [class.customTrigger]=\"customTrigger\"\n [ngStyle]=\"{ 'left': menuLeft, 'right': menuRight, 'top': menuTop, 'bottom': menuBottom }\">\n <div class=\"action-menu-header\">\n <zen-search-box [(text)]=\"searchText\"\n #searchBox\n (textChange)=\"searchTextChanged()\"></zen-search-box>\n </div>\n\n <div class=\"action-menu-body items-wrapper\"\n ngClass=\"{{wrapperBodyClass}}\">\n <ng-container *ngIf=\"errorMessage.length\">\n <li *ngFor=\"let item of errorMessage\"\n class=\"error-msg\">{{item | translate }}</li>\n </ng-container>\n\n <div *ngFor=\"let item of config.items\">\n <div class=\"menu-item\"\n *ngIf=\"isMenuIsVisible(item)\">\n\n <!-- Divider between two filter -->\n <div *ngIf=\"item.type === 'divider'\">\n <p class=\"filter-divider\"></p>\n </div>\n\n <!-- Boolean toggle -->\n <div *ngIf=\"item.type === 'toggle'\"\n class=\"action-item toggle-row\">\n <div>{{item.title | translate}}</div>\n <zen-toggle-slide [(enabled)]=\"item.enabled\"></zen-toggle-slide>\n </div>\n\n <button class=\"action-item expander-item\"\n *ngIf=\"item.type != 'toggle' && item.type != 'divider' && !item.disableCollapse\"\n (click)=\"toggleItem(item)\"\n [ngClass]=\"{'active': isItemActive(item), 'expanded': item.expanded}\">\n <i class=\"material-icons expand-icon\"\n [ngClass]=\"{'active': item.expanded}\">expand_more</i>\n {{item.title | translate}}\n </button>\n\n <ng-container *ngIf=\"item.expanded || item.disableCollapse\">\n <div [ngSwitch]=\"item.type\">\n <!-- Multiselect -->\n <div *ngSwitchCase=\"'multiselect'\">\n <!-- Lazy loading mode -->\n <ng-container *ngIf=\"item.isLazyLoading\">\n <div *ngFor=\"let dsItem of item.filteredDataSource\"\n class=\"action-item-checkbox ds-item\">\n <zen-checkbox [(checked)]=\"dsItem.checked\"\n [imageUrl]=\"dsItem.imageUrl\"\n (checkedChange)=\"checkChanged(dsItem, item)\"\n [label]=\"dsItem.name?.toString() | translate\"></zen-checkbox>\n </div>\n <div *ngIf=\"item.canLoadMore && !item.isLoadingNow\"\n class=\"action-item\">\n <button (click)=\"loadMore(item, false)\"\n class=\"button-stroked full-width\">\n {{'Load More' | translate}}\n </button>\n </div>\n <div *ngIf=\"item.isLoadingNow\"\n class=\"loader-more-spinner\">\n <zen-spinner size=\"small\"></zen-spinner>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"!item.isLazyLoading\">\n <div class=\"action-item-checkbox ds-item select-all\">\n <zen-checkbox *ngIf=\"item.dataSource.length === item.filteredDataSource.length\"\n [(checked)]=\"item.isSelectedAll\"\n [indeterminate]=\"isItemActive(item) && !item.isSelectedAll\"\n [label]=\"'Select All' | translate\"\n (checkedChange)=\"onSelectAll(item)\">\n </zen-checkbox>\n </div>\n\n <div *ngFor=\"let dsItem of item.filteredDataSource\"\n class=\"action-item-checkbox ds-item\">\n <zen-checkbox [(checked)]=\"dsItem.checked\"\n [imageUrl]=\"dsItem.imageUrl\"\n (checkedChange)=\"checkChanged(dsItem, item)\"\n [label]=\"dsItem.name?.toString() | translate\"></zen-checkbox>\n </div>\n </ng-container>\n </div>\n\n <!-- Date range picker -->\n <div *ngSwitchCase=\"'dateRange'\">\n <!-- Options date range view -->\n <ng-container *ngIf=\"item.dateRangeOptions?.length\">\n <ng-container *ngFor=\"let option of item.dateRangeOptions\">\n <div class=\"action-item-radio ds-item\"\n [ngClass]=\"{'active': selectedDateRangeOptions[item.key] === option.name}\">\n <zen-radio [value]=\"option.name\"\n [label]=\"option.name | translate\"\n [name]=\"item.key\"\n [selected]=\"selectedDateRangeOptions[item.key] === option.name\"\n (radioChange)=\"handleDateRangeOptionClick(item, option)\"></zen-radio>\n </div>\n </ng-container>\n <div class=\"action-item-radio ds-item\"\n [ngClass]=\"{'active': selectedDateRangeOptions[item.key] === 'Custom'}\">\n <zen-radio [value]=\"'Custom'\"\n [label]=\"'Custom' | translate\"\n [name]=\"item.key\"\n [selected]=\"selectedDateRangeOptions[item.key] === 'Custom'\"\n (radioChange)=\"handleCustomDateRangeClick(item)\"></zen-radio>\n </div>\n <ng-container *ngIf=\"selectedDateRangeOptions[item.key] === 'Custom'\">\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'From' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.start\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'To' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.end\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n (dateChange)=\"handleEndDateChange(item)\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n </ng-container>\n </ng-container>\n\n <!-- Default date range view -->\n <ng-container *ngIf=\"!item.dateRangeOptions?.length\">\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'From' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.start\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'To' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.end\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n (dateChange)=\"handleEndDateChange(item)\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n </ng-container>\n </div>\n\n <!-- Date picker -->\n <div *ngSwitchCase=\"'date'\">\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'Date' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.date\"\n [showTime]=\"item.showTime\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n </div>\n\n <!-- Number range -->\n <div *ngSwitchCase=\"'numberRange'\"\n class=\"filter-row number-range-row\">\n <div>\n <div class=\"lbl\">{{'Min' | translate}}:</div>\n <input class=\"material-input\"\n [(ngModel)]=\"item.numberRange.from\"\n type=\"number\" />\n </div>\n <div>\n <div class=\"lbl\">{{'Max' | translate}}:</div>\n <input class=\"material-input\"\n [(ngModel)]=\"item.numberRange.to\"\n type=\"number\" />\n </div>\n </div>\n\n <!-- Radio -->\n <div *ngSwitchCase=\"'radio'\">\n <div *ngFor=\"let option of item.radioOptions\"\n class=\"action-item-radio ds-item\"\n [ngClass]=\"{'active': option.selected}\">\n <zen-radio [value]=\"option.id\"\n [label]=\"option.name | translate\"\n [name]=\"item.key\"\n [imageUrl]=\"option.imageUrl\"\n [selected]=\"option.selected\"\n (radioChange)=\"radioChanged($event, item)\"\n [disabled]=\"option.disabled\"></zen-radio>\n </div>\n </div>\n </div>\n </ng-container>\n\n </div>\n </div>\n <span *ngIf=\"showNoFilterResult\"\n class=\"no-item\">{{'No Results Found' | translate}}..</span>\n </div>\n\n <div class=\"action-menu-footer\">\n <button (click)=\"reset()\"\n class=\"button-stroked full-width\">\n {{'Reset' | translate}}\n </button>\n <button (click)=\"apply()\"\n class=\"button-flat full-width\">\n {{'Apply' | translate}}\n </button>\n </div>\n\n </div>\n</div>\n", styles: [".filters-component{display:inline-block;position:relative}.filters-component .filter{color:#828282;position:relative;border-color:#ececed;padding:0 7px;height:38px}.filters-component .filter zen-icon{background:#828282}.filters-component .filter.applied{color:var(--color-primary, #2188d9);background:#f4f9fd;border:1px solid var(--color-primary, #2188d9)}.filters-component .filter.applied zen-icon{background:var(--color-primary, #2188d9)}.filters-component .filter .dot{background:var(--color-primary, #2188d9);width:4px;height:4px;position:absolute;border-radius:50%;left:42px;top:9px}.filters-component .menu-content{width:360px;white-space:initial;position:fixed}.filters-component .menu-content.customTrigger{top:30px}.filters-component .menu-content .items-wrapper{overflow-y:auto;max-height:calc(100vh - 407px);position:relative}.filters-component .menu-content .items-wrapper .expander-item{outline:none;border:none;display:flex;width:100%}.filters-component .menu-content .items-wrapper .action-item{color:#828282}.filters-component .menu-content .items-wrapper .action-item.expanded,.filters-component .menu-content .items-wrapper .action-item.active{background:#f4f9fd;color:#4f4f4f}.filters-component .menu-content .items-wrapper .expand-icon{transition:.3s}.filters-component .menu-content .items-wrapper .expand-icon.active{transform:rotate(180deg)}.filters-component .menu-content .items-wrapper .ds-item{padding-left:48px}.filters-component .menu-content .items-wrapper .no-item,.filters-component .menu-content .items-wrapper .error-msg{color:#dc3e33;display:flex;flex-direction:row;align-items:center;padding:10px 16px;font-weight:400;font-size:14px}.filters-component .menu-content .items-wrapper .select-all{font-weight:500}.filters-component .menu-content .items-wrapper .filter-row{padding:0 16px}.filters-component .menu-content .items-wrapper .filter-row:not(:last-of-type){margin-bottom:20px}.filters-component .menu-content .items-wrapper .filter-row .lbl{color:#60636c;font-size:14px;margin-bottom:8px}.filters-component .menu-content .items-wrapper .filter-row:focus-within .lbl{color:var(--color-primary, #2188d9)}.filters-component .menu-content .items-wrapper .number-range-row{display:flex;margin-left:32px;gap:16px;margin-bottom:10px}.filters-component .menu-content .items-wrapper .toggle-row{justify-content:space-between}.filters-component .loader-more-spinner{display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box}.hidden{display:none}:host ::ng-deep zen-radio label{margin:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.ZenduCheckboxComponent, selector: "zen-checkbox", inputs: ["checked", "label", "disabled", "disableValueChange", "indeterminate", "imageUrl"], outputs: ["checkedChange"] }, { kind: "component", type: i4.ZenduToggleSlideComponent, selector: "zen-toggle-slide", inputs: ["enabled", "disabled"], outputs: ["enabledChange"] }, { kind: "component", type: i5.ZenduSearchBoxComponent, selector: "zen-search-box", inputs: ["text", "delay", "autoFocus", "placeholder"], outputs: ["textChange"] }, { kind: "component", type: i6.ZenduDatepickerComponent, selector: "zen-datepicker", inputs: ["date", "showTime", "showDate", "parentContainer", "containerClass", "minDate", "maxDate", "boxDesign", "highlightDays", "autoConfirm", "hint", "highlightError", "disabled", "readonly", "xPosition", "yPosition", "dispalyOverParent"], outputs: ["dateChange"] }, { kind: "component", type: i7.ZenduRadioButtonComponent, selector: "zen-radio", inputs: ["selected", "label", "value", "name", "disabled", "imageUrl"], outputs: ["radioChange"] }, { kind: "component", type: i8.ZenduIconComponent, selector: "zen-icon", inputs: ["src"] }, { kind: "component", type: i9.ZenduSpinner, selector: "zen-spinner", inputs: ["size"] }, { kind: "pipe", type: i10.TranslatePipe, name: "translate" }] });
621
+ ZenduFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduFilterComponent, selector: "zen-filter", inputs: { config: "config", filter: "filter", position: "position", resetBehavior: "resetBehavior", isVisible: "isVisible", customTrigger: "customTrigger", imageUrl: "imageUrl", label: "label", showOptions: "showOptions", customOptions: "customOptions", wrapperBodyClass: "wrapperBodyClass" }, outputs: { filterChange: "filterChange", isVisibleChange: "isVisibleChange" }, host: { listeners: { "window:mousedown": "outsideHandling($event)", "window:resize": "windowSizeHandling($event)", "window:scroll": "windowScroll($event)", "window:wheel": "handleMouseScroll($event)", "window:keydown": "onWindowKeyDown($event)" } }, viewQueries: [{ propertyName: "searchBox", first: true, predicate: ["searchBox"], descendants: true }, { propertyName: "_componentElement", first: true, predicate: ["mainComponent"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"filters-component\"\n #mainComponent\n click-out=\"isVisible && hide()\">\n\n <ng-container *ngIf=\"!customTrigger\">\n <button (click)=\"toggle()\"\n class=\"button-stroked filter {{isApplied ? 'applied' : ''}}\">\n <zen-icon [src]=\"imageUrl\"\n *ngIf=\"imageUrl\"></zen-icon>\n <i class=\"filter-icon material-icons\"\n *ngIf=\"!imageUrl\">filter_list</i>\n <span *ngIf=\"label\">{{ label | translate }}</span>\n </button>\n </ng-container>\n\n <ng-content *ngIf=\"customTrigger\"></ng-content>\n\n <div [hidden]=\"!isVisible\"\n class=\"action-menu menu-content\"\n [class.customTrigger]=\"customTrigger\"\n [ngStyle]=\"{ 'left': menuLeft, 'right': menuRight, 'top': menuTop, 'bottom': menuBottom }\">\n <div class=\"action-menu-header\">\n <zen-search-box [(text)]=\"searchText\"\n #searchBox\n (textChange)=\"searchTextChanged()\"></zen-search-box>\n </div>\n\n <div class=\"action-menu-body items-wrapper\"\n ngClass=\"{{wrapperBodyClass}}\">\n <ng-container *ngIf=\"errorMessage.length\">\n <li *ngFor=\"let item of errorMessage\"\n class=\"error-msg\">{{item | translate }}</li>\n </ng-container>\n\n <div *ngFor=\"let item of config.items\">\n <div class=\"menu-item\"\n *ngIf=\"isMenuIsVisible(item)\">\n\n <!-- Divider between two filter -->\n <div *ngIf=\"item.type === 'divider'\">\n <p class=\"filter-divider\"></p>\n </div>\n\n <!-- Boolean toggle -->\n <div *ngIf=\"item.type === 'toggle'\"\n class=\"action-item toggle-row\">\n <div>{{item.title | translate}}</div>\n <zen-toggle-slide [(enabled)]=\"item.enabled\"></zen-toggle-slide>\n </div>\n\n <button class=\"action-item expander-item\"\n *ngIf=\"item.type != 'toggle' && item.type != 'divider' && !item.disableCollapse\"\n (click)=\"toggleItem(item)\"\n [ngClass]=\"{'active': isItemActive(item), 'expanded': item.expanded}\">\n <i class=\"material-icons expand-icon\"\n [ngClass]=\"{'active': item.expanded}\">expand_more</i>\n {{item.title | translate}}\n </button>\n\n <ng-container *ngIf=\"item.expanded || item.disableCollapse\">\n <div [ngSwitch]=\"item.type\">\n <!-- Multiselect -->\n <div *ngSwitchCase=\"'multiselect'\">\n <!-- Lazy loading mode -->\n <ng-container *ngIf=\"item.isLazyLoading\">\n <div *ngFor=\"let dsItem of item.filteredDataSource\"\n class=\"action-item-checkbox ds-item\">\n <zen-checkbox [(checked)]=\"dsItem.checked\"\n [imageUrl]=\"dsItem.imageUrl\"\n (checkedChange)=\"checkChanged(dsItem, item)\"\n [label]=\"dsItem.name?.toString() | translate\"></zen-checkbox>\n </div>\n <div *ngIf=\"item.canLoadMore && !item.isLoadingNow\"\n class=\"action-item\">\n <button (click)=\"loadMore(item, false)\"\n class=\"button-stroked full-width\">\n {{'Load More' | translate}}\n </button>\n </div>\n <div *ngIf=\"item.isLoadingNow\"\n class=\"loader-more-spinner\">\n <zen-spinner size=\"small\"></zen-spinner>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"!item.isLazyLoading\">\n <div class=\"action-item-checkbox ds-item select-all\">\n <zen-checkbox *ngIf=\"item.dataSource.length === item.filteredDataSource.length\"\n [(checked)]=\"item.isSelectedAll\"\n [indeterminate]=\"isItemActive(item) && !item.isSelectedAll\"\n [label]=\"'Select All' | translate\"\n (checkedChange)=\"onSelectAll(item)\">\n </zen-checkbox>\n </div>\n\n <div *ngFor=\"let dsItem of item.filteredDataSource\"\n class=\"action-item-checkbox ds-item\">\n <zen-checkbox [(checked)]=\"dsItem.checked\"\n [imageUrl]=\"dsItem.imageUrl\"\n (checkedChange)=\"checkChanged(dsItem, item)\"\n [label]=\"dsItem.name?.toString() | translate\"></zen-checkbox>\n </div>\n </ng-container>\n </div>\n\n <!-- Date range picker -->\n <div *ngSwitchCase=\"'dateRange'\">\n <!-- Options date range view -->\n <ng-container *ngIf=\"item.dateRangeOptions?.length\">\n <ng-container *ngFor=\"let option of item.dateRangeOptions\">\n <div class=\"action-item-radio ds-item\"\n [ngClass]=\"{'active': selectedDateRangeOptions[item.key] === option.name}\">\n <zen-radio [value]=\"option.name\"\n [label]=\"option.name | translate\"\n [name]=\"item.key\"\n [selected]=\"selectedDateRangeOptions[item.key] === option.name\"\n (radioChange)=\"handleDateRangeOptionClick(item, option)\"></zen-radio>\n </div>\n </ng-container>\n <div class=\"action-item-radio ds-item\"\n [ngClass]=\"{'active': selectedDateRangeOptions[item.key] === 'Custom'}\">\n <zen-radio [value]=\"'Custom'\"\n [label]=\"'Custom' | translate\"\n [name]=\"item.key\"\n [selected]=\"selectedDateRangeOptions[item.key] === 'Custom'\"\n (radioChange)=\"handleCustomDateRangeClick(item)\"></zen-radio>\n </div>\n <ng-container *ngIf=\"selectedDateRangeOptions[item.key] === 'Custom'\">\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'From' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.start\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'To' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.end\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n (dateChange)=\"handleEndDateChange(item)\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n </ng-container>\n </ng-container>\n\n <!-- Default date range view -->\n <ng-container *ngIf=\"!item.dateRangeOptions?.length\">\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'From' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.start\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'To' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.end\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n (dateChange)=\"handleEndDateChange(item)\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n </ng-container>\n </div>\n\n <!-- Date picker -->\n <div *ngSwitchCase=\"'date'\">\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'Date' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.date\"\n [showTime]=\"item.showTime\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n </div>\n\n <!-- Number range -->\n <div *ngSwitchCase=\"'numberRange'\"\n class=\"filter-row number-range-row\">\n <div>\n <div class=\"lbl\">{{'Min' | translate}}:</div>\n <input class=\"material-input\"\n [(ngModel)]=\"item.numberRange.from\"\n type=\"number\" />\n </div>\n <div>\n <div class=\"lbl\">{{'Max' | translate}}:</div>\n <input class=\"material-input\"\n [(ngModel)]=\"item.numberRange.to\"\n type=\"number\" />\n </div>\n </div>\n\n <!-- Radio -->\n <div *ngSwitchCase=\"'radio'\">\n <div *ngFor=\"let option of item.radioOptions\"\n class=\"action-item-radio ds-item\"\n [ngClass]=\"{'active': option.selected}\">\n <zen-radio [value]=\"option.id\"\n [label]=\"option.name | translate\"\n [name]=\"item.key\"\n [imageUrl]=\"option.imageUrl\"\n [selected]=\"option.selected\"\n (radioChange)=\"radioChanged($event, item)\"\n [disabled]=\"option.disabled\"></zen-radio>\n </div>\n </div>\n </div>\n </ng-container>\n\n </div>\n </div>\n <span *ngIf=\"showNoFilterResult\"\n class=\"no-item\">{{'No Results Found' | translate}}..</span>\n </div>\n\n <div class=\"action-menu-footer\">\n <button (click)=\"reset()\"\n class=\"button-stroked full-width\">\n {{'Reset' | translate}}\n </button>\n <button (click)=\"apply()\"\n class=\"button-flat full-width\">\n {{'Apply' | translate}}\n </button>\n </div>\n\n </div>\n</div>\n", styles: [".filters-component{display:inline-block;position:relative}.filters-component .filter{color:#828282;position:relative;border-color:#ececed;padding:0 7px;height:38px}.filters-component .filter zen-icon{background:#828282}.filters-component .filter.applied{color:var(--color-primary, #2188d9);background:#f4f9fd;border:1px solid var(--color-primary, #2188d9)}.filters-component .filter.applied zen-icon{background:var(--color-primary, #2188d9)}.filters-component .filter .dot{background:var(--color-primary, #2188d9);width:4px;height:4px;position:absolute;border-radius:50%;left:42px;top:9px}.filters-component .menu-content{width:360px;white-space:initial;position:fixed}.filters-component .menu-content.customTrigger{top:30px}.filters-component .menu-content .items-wrapper{overflow-y:auto;max-height:calc(100vh - 407px);position:relative}.filters-component .menu-content .items-wrapper .expander-item{outline:none;border:none;display:flex;width:100%}.filters-component .menu-content .items-wrapper .action-item{color:#828282}.filters-component .menu-content .items-wrapper .action-item.expanded,.filters-component .menu-content .items-wrapper .action-item.active{background:#f4f9fd;color:#4f4f4f}.filters-component .menu-content .items-wrapper .expand-icon{transition:.3s}.filters-component .menu-content .items-wrapper .expand-icon.active{transform:rotate(180deg)}.filters-component .menu-content .items-wrapper .ds-item{padding-left:48px}.filters-component .menu-content .items-wrapper .no-item,.filters-component .menu-content .items-wrapper .error-msg{color:#dc3e33;display:flex;flex-direction:row;align-items:center;padding:10px 16px;font-weight:400;font-size:14px}.filters-component .menu-content .items-wrapper .select-all{font-weight:500}.filters-component .menu-content .items-wrapper .filter-row{padding:0 16px}.filters-component .menu-content .items-wrapper .filter-row:not(:last-of-type){margin-bottom:20px}.filters-component .menu-content .items-wrapper .filter-row .lbl{color:#60636c;font-size:14px;margin-bottom:8px}.filters-component .menu-content .items-wrapper .filter-row:focus-within .lbl{color:var(--color-primary, #2188d9)}.filters-component .menu-content .items-wrapper .number-range-row{display:flex;margin-left:32px;gap:16px;margin-bottom:10px}.filters-component .menu-content .items-wrapper .toggle-row{justify-content:space-between}.filters-component .loader-more-spinner{display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box}.hidden{display:none}:host ::ng-deep zen-radio label{margin:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.ZenduCheckboxComponent, selector: "zen-checkbox", inputs: ["checked", "label", "disabled", "disableValueChange", "indeterminate", "imageUrl"], outputs: ["checkedChange"] }, { kind: "component", type: i4.ZenduToggleSlideComponent, selector: "zen-toggle-slide", inputs: ["enabled", "disabled"], outputs: ["enabledChange"] }, { kind: "component", type: i5.ZenduSearchBoxComponent, selector: "zen-search-box", inputs: ["text", "delay", "autoFocus", "disabled", "placeholder"], outputs: ["textChange"] }, { kind: "component", type: i6.ZenduDatepickerComponent, selector: "zen-datepicker", inputs: ["date", "showTime", "showDate", "parentContainer", "containerClass", "minDate", "maxDate", "boxDesign", "highlightDays", "autoConfirm", "hint", "highlightError", "disabled", "readonly", "xPosition", "yPosition", "dispalyOverParent"], outputs: ["dateChange"] }, { kind: "component", type: i7.ZenduRadioButtonComponent, selector: "zen-radio", inputs: ["selected", "label", "value", "name", "disabled", "imageUrl"], outputs: ["radioChange"] }, { kind: "component", type: i8.ZenduIconComponent, selector: "zen-icon", inputs: ["src"] }, { kind: "component", type: i9.ZenduSpinner, selector: "zen-spinner", inputs: ["size"] }, { kind: "pipe", type: i10.TranslatePipe, name: "translate" }] });
622
622
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduFilterComponent, decorators: [{
623
623
  type: Component,
624
624
  args: [{ selector: 'zen-filter', template: "<div class=\"filters-component\"\n #mainComponent\n click-out=\"isVisible && hide()\">\n\n <ng-container *ngIf=\"!customTrigger\">\n <button (click)=\"toggle()\"\n class=\"button-stroked filter {{isApplied ? 'applied' : ''}}\">\n <zen-icon [src]=\"imageUrl\"\n *ngIf=\"imageUrl\"></zen-icon>\n <i class=\"filter-icon material-icons\"\n *ngIf=\"!imageUrl\">filter_list</i>\n <span *ngIf=\"label\">{{ label | translate }}</span>\n </button>\n </ng-container>\n\n <ng-content *ngIf=\"customTrigger\"></ng-content>\n\n <div [hidden]=\"!isVisible\"\n class=\"action-menu menu-content\"\n [class.customTrigger]=\"customTrigger\"\n [ngStyle]=\"{ 'left': menuLeft, 'right': menuRight, 'top': menuTop, 'bottom': menuBottom }\">\n <div class=\"action-menu-header\">\n <zen-search-box [(text)]=\"searchText\"\n #searchBox\n (textChange)=\"searchTextChanged()\"></zen-search-box>\n </div>\n\n <div class=\"action-menu-body items-wrapper\"\n ngClass=\"{{wrapperBodyClass}}\">\n <ng-container *ngIf=\"errorMessage.length\">\n <li *ngFor=\"let item of errorMessage\"\n class=\"error-msg\">{{item | translate }}</li>\n </ng-container>\n\n <div *ngFor=\"let item of config.items\">\n <div class=\"menu-item\"\n *ngIf=\"isMenuIsVisible(item)\">\n\n <!-- Divider between two filter -->\n <div *ngIf=\"item.type === 'divider'\">\n <p class=\"filter-divider\"></p>\n </div>\n\n <!-- Boolean toggle -->\n <div *ngIf=\"item.type === 'toggle'\"\n class=\"action-item toggle-row\">\n <div>{{item.title | translate}}</div>\n <zen-toggle-slide [(enabled)]=\"item.enabled\"></zen-toggle-slide>\n </div>\n\n <button class=\"action-item expander-item\"\n *ngIf=\"item.type != 'toggle' && item.type != 'divider' && !item.disableCollapse\"\n (click)=\"toggleItem(item)\"\n [ngClass]=\"{'active': isItemActive(item), 'expanded': item.expanded}\">\n <i class=\"material-icons expand-icon\"\n [ngClass]=\"{'active': item.expanded}\">expand_more</i>\n {{item.title | translate}}\n </button>\n\n <ng-container *ngIf=\"item.expanded || item.disableCollapse\">\n <div [ngSwitch]=\"item.type\">\n <!-- Multiselect -->\n <div *ngSwitchCase=\"'multiselect'\">\n <!-- Lazy loading mode -->\n <ng-container *ngIf=\"item.isLazyLoading\">\n <div *ngFor=\"let dsItem of item.filteredDataSource\"\n class=\"action-item-checkbox ds-item\">\n <zen-checkbox [(checked)]=\"dsItem.checked\"\n [imageUrl]=\"dsItem.imageUrl\"\n (checkedChange)=\"checkChanged(dsItem, item)\"\n [label]=\"dsItem.name?.toString() | translate\"></zen-checkbox>\n </div>\n <div *ngIf=\"item.canLoadMore && !item.isLoadingNow\"\n class=\"action-item\">\n <button (click)=\"loadMore(item, false)\"\n class=\"button-stroked full-width\">\n {{'Load More' | translate}}\n </button>\n </div>\n <div *ngIf=\"item.isLoadingNow\"\n class=\"loader-more-spinner\">\n <zen-spinner size=\"small\"></zen-spinner>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"!item.isLazyLoading\">\n <div class=\"action-item-checkbox ds-item select-all\">\n <zen-checkbox *ngIf=\"item.dataSource.length === item.filteredDataSource.length\"\n [(checked)]=\"item.isSelectedAll\"\n [indeterminate]=\"isItemActive(item) && !item.isSelectedAll\"\n [label]=\"'Select All' | translate\"\n (checkedChange)=\"onSelectAll(item)\">\n </zen-checkbox>\n </div>\n\n <div *ngFor=\"let dsItem of item.filteredDataSource\"\n class=\"action-item-checkbox ds-item\">\n <zen-checkbox [(checked)]=\"dsItem.checked\"\n [imageUrl]=\"dsItem.imageUrl\"\n (checkedChange)=\"checkChanged(dsItem, item)\"\n [label]=\"dsItem.name?.toString() | translate\"></zen-checkbox>\n </div>\n </ng-container>\n </div>\n\n <!-- Date range picker -->\n <div *ngSwitchCase=\"'dateRange'\">\n <!-- Options date range view -->\n <ng-container *ngIf=\"item.dateRangeOptions?.length\">\n <ng-container *ngFor=\"let option of item.dateRangeOptions\">\n <div class=\"action-item-radio ds-item\"\n [ngClass]=\"{'active': selectedDateRangeOptions[item.key] === option.name}\">\n <zen-radio [value]=\"option.name\"\n [label]=\"option.name | translate\"\n [name]=\"item.key\"\n [selected]=\"selectedDateRangeOptions[item.key] === option.name\"\n (radioChange)=\"handleDateRangeOptionClick(item, option)\"></zen-radio>\n </div>\n </ng-container>\n <div class=\"action-item-radio ds-item\"\n [ngClass]=\"{'active': selectedDateRangeOptions[item.key] === 'Custom'}\">\n <zen-radio [value]=\"'Custom'\"\n [label]=\"'Custom' | translate\"\n [name]=\"item.key\"\n [selected]=\"selectedDateRangeOptions[item.key] === 'Custom'\"\n (radioChange)=\"handleCustomDateRangeClick(item)\"></zen-radio>\n </div>\n <ng-container *ngIf=\"selectedDateRangeOptions[item.key] === 'Custom'\">\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'From' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.start\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'To' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.end\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n (dateChange)=\"handleEndDateChange(item)\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n </ng-container>\n </ng-container>\n\n <!-- Default date range view -->\n <ng-container *ngIf=\"!item.dateRangeOptions?.length\">\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'From' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.start\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'To' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.dateRange.end\"\n [showTime]=\"item.showTime\"\n [yPosition]=\"item.config?.yPosition ?? datepickerPosition.AUTO\"\n (dateChange)=\"handleEndDateChange(item)\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n </ng-container>\n </div>\n\n <!-- Date picker -->\n <div *ngSwitchCase=\"'date'\">\n <div class=\"ds-item filter-row\">\n <div class=\"lbl\">{{'Date' | translate}}:</div>\n <zen-datepicker class=\"width-full\"\n [(date)]=\"item.date\"\n [showTime]=\"item.showTime\"\n [parentContainer]=\"mainComponent\">\n </zen-datepicker>\n </div>\n </div>\n\n <!-- Number range -->\n <div *ngSwitchCase=\"'numberRange'\"\n class=\"filter-row number-range-row\">\n <div>\n <div class=\"lbl\">{{'Min' | translate}}:</div>\n <input class=\"material-input\"\n [(ngModel)]=\"item.numberRange.from\"\n type=\"number\" />\n </div>\n <div>\n <div class=\"lbl\">{{'Max' | translate}}:</div>\n <input class=\"material-input\"\n [(ngModel)]=\"item.numberRange.to\"\n type=\"number\" />\n </div>\n </div>\n\n <!-- Radio -->\n <div *ngSwitchCase=\"'radio'\">\n <div *ngFor=\"let option of item.radioOptions\"\n class=\"action-item-radio ds-item\"\n [ngClass]=\"{'active': option.selected}\">\n <zen-radio [value]=\"option.id\"\n [label]=\"option.name | translate\"\n [name]=\"item.key\"\n [imageUrl]=\"option.imageUrl\"\n [selected]=\"option.selected\"\n (radioChange)=\"radioChanged($event, item)\"\n [disabled]=\"option.disabled\"></zen-radio>\n </div>\n </div>\n </div>\n </ng-container>\n\n </div>\n </div>\n <span *ngIf=\"showNoFilterResult\"\n class=\"no-item\">{{'No Results Found' | translate}}..</span>\n </div>\n\n <div class=\"action-menu-footer\">\n <button (click)=\"reset()\"\n class=\"button-stroked full-width\">\n {{'Reset' | translate}}\n </button>\n <button (click)=\"apply()\"\n class=\"button-flat full-width\">\n {{'Apply' | translate}}\n </button>\n </div>\n\n </div>\n</div>\n", styles: [".filters-component{display:inline-block;position:relative}.filters-component .filter{color:#828282;position:relative;border-color:#ececed;padding:0 7px;height:38px}.filters-component .filter zen-icon{background:#828282}.filters-component .filter.applied{color:var(--color-primary, #2188d9);background:#f4f9fd;border:1px solid var(--color-primary, #2188d9)}.filters-component .filter.applied zen-icon{background:var(--color-primary, #2188d9)}.filters-component .filter .dot{background:var(--color-primary, #2188d9);width:4px;height:4px;position:absolute;border-radius:50%;left:42px;top:9px}.filters-component .menu-content{width:360px;white-space:initial;position:fixed}.filters-component .menu-content.customTrigger{top:30px}.filters-component .menu-content .items-wrapper{overflow-y:auto;max-height:calc(100vh - 407px);position:relative}.filters-component .menu-content .items-wrapper .expander-item{outline:none;border:none;display:flex;width:100%}.filters-component .menu-content .items-wrapper .action-item{color:#828282}.filters-component .menu-content .items-wrapper .action-item.expanded,.filters-component .menu-content .items-wrapper .action-item.active{background:#f4f9fd;color:#4f4f4f}.filters-component .menu-content .items-wrapper .expand-icon{transition:.3s}.filters-component .menu-content .items-wrapper .expand-icon.active{transform:rotate(180deg)}.filters-component .menu-content .items-wrapper .ds-item{padding-left:48px}.filters-component .menu-content .items-wrapper .no-item,.filters-component .menu-content .items-wrapper .error-msg{color:#dc3e33;display:flex;flex-direction:row;align-items:center;padding:10px 16px;font-weight:400;font-size:14px}.filters-component .menu-content .items-wrapper .select-all{font-weight:500}.filters-component .menu-content .items-wrapper .filter-row{padding:0 16px}.filters-component .menu-content .items-wrapper .filter-row:not(:last-of-type){margin-bottom:20px}.filters-component .menu-content .items-wrapper .filter-row .lbl{color:#60636c;font-size:14px;margin-bottom:8px}.filters-component .menu-content .items-wrapper .filter-row:focus-within .lbl{color:var(--color-primary, #2188d9)}.filters-component .menu-content .items-wrapper .number-range-row{display:flex;margin-left:32px;gap:16px;margin-bottom:10px}.filters-component .menu-content .items-wrapper .toggle-row{justify-content:space-between}.filters-component .loader-more-spinner{display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box}.hidden{display:none}:host ::ng-deep zen-radio label{margin:0}\n"] }]
@@ -54,7 +54,7 @@ export class ZenduPaginationBarComponent {
54
54
  }
55
55
  }
56
56
  ZenduPaginationBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduPaginationBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
57
- ZenduPaginationBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduPaginationBarComponent, selector: "zen-pagination-bar", inputs: { page: "page", perPage: "perPage", count: "count" }, outputs: { pageChange: "pageChange", perPageChange: "perPageChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"pagination-component\">\n <div class=\"select-dropdown\">\n <label>{{\"Rows per page\" | translate}}:</label>\n <zen-select [(selectModel)]=\"perPage\"\n [options]=\"availablePagesSize\"\n (selectModelChange)=\"updatePageSize()\"></zen-select>\n </div>\n <div class=\"pages\">\n <button class=\"pagination-button\"\n [disabled]=\"page - 1 <= 0\"\n (click)=\"prevPage()\">\n <i class=\"material-icons\">keyboard_arrow_left</i>\n </button>\n <label>{{((page - 1) * perPage) + 1 }} - {{endRowSize()}} of {{count}}</label>\n <button class=\"pagination-button\"\n [disabled]=\"page + 1 > totalPages\"\n (click)=\"nextPage()\">\n <i class=\"material-icons\">keyboard_arrow_right</i>\n </button>\n </div>\n</div>\n", styles: [".pagination-component{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.pagination-component .select-dropdown{display:flex;flex-direction:row;align-items:center;gap:8px}.pagination-component .select-dropdown label{margin:0;font-style:normal;font-weight:400;font-size:12px;line-height:120%;color:#4f4f4f}.pagination-component .pages{display:flex;flex-direction:row;align-items:center;gap:8px}.pagination-component .pages label{margin:0;font-style:normal;font-weight:400;font-size:12px;line-height:16px;color:#828282}.pagination-component .pages .pagination-button{display:flex;flex-direction:row;align-items:center;height:16px;padding:0;box-sizing:border-box;white-space:nowrap;border:none;border-radius:50%;transition:.1s;cursor:pointer;color:#828282;background:#FFFFFF}.pagination-component .pages .pagination-button:hover{color:#4f4f4f;background:#F2F2F2}.pagination-component .pages .pagination-button:focus{outline:none;color:#2188d9;background:#F4F9FD}.pagination-component .pages .pagination-button:disabled{color:#e0e0e0;background:#FFFFFF;cursor:not-allowed}.pagination-component .pages .pagination-button .material-icons{font-size:16px;height:16px;width:16px}\n"], dependencies: [{ kind: "component", type: i1.ZenduSelectComponent, selector: "zen-select", inputs: ["selectModel", "options", "placeholder", "displayProp", "idProp", "hasSearch", "returnOption", "isMultiselect", "disabled", "customIcon", "customIconStart", "customIconColor", "isTruncate", "enableAddNewOption", "newOptionText", "enableRemoveOption", "removeOptionText", "isLazyLoading", "lazyLoader"], outputs: ["selectModelChange", "addNewOption", "removeOption", "closed"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
57
+ ZenduPaginationBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduPaginationBarComponent, selector: "zen-pagination-bar", inputs: { page: "page", perPage: "perPage", count: "count" }, outputs: { pageChange: "pageChange", perPageChange: "perPageChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"pagination-component\">\n <div class=\"select-dropdown\">\n <label>{{\"Rows per page\" | translate}}:</label>\n <zen-select [(selectModel)]=\"perPage\"\n [options]=\"availablePagesSize\"\n (selectModelChange)=\"updatePageSize()\"></zen-select>\n </div>\n <div class=\"pages\">\n <button class=\"pagination-button\"\n [disabled]=\"page - 1 <= 0\"\n (click)=\"prevPage()\">\n <i class=\"material-icons\">keyboard_arrow_left</i>\n </button>\n <label>{{((page - 1) * perPage) + 1 }} - {{endRowSize()}} of {{count}}</label>\n <button class=\"pagination-button\"\n [disabled]=\"page + 1 > totalPages\"\n (click)=\"nextPage()\">\n <i class=\"material-icons\">keyboard_arrow_right</i>\n </button>\n </div>\n</div>\n", styles: [".pagination-component{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.pagination-component .select-dropdown{display:flex;flex-direction:row;align-items:center;gap:8px}.pagination-component .select-dropdown label{margin:0;font-style:normal;font-weight:400;font-size:12px;line-height:120%;color:#4f4f4f}.pagination-component .pages{display:flex;flex-direction:row;align-items:center;gap:8px}.pagination-component .pages label{margin:0;font-style:normal;font-weight:400;font-size:12px;line-height:16px;color:#828282}.pagination-component .pages .pagination-button{display:flex;flex-direction:row;align-items:center;height:16px;padding:0;box-sizing:border-box;white-space:nowrap;border:none;border-radius:50%;transition:.1s;cursor:pointer;color:#828282;background:#FFFFFF}.pagination-component .pages .pagination-button:hover{color:#4f4f4f;background:#F2F2F2}.pagination-component .pages .pagination-button:focus{outline:none;color:#2188d9;background:#F4F9FD}.pagination-component .pages .pagination-button:disabled{color:#e0e0e0;background:#FFFFFF;cursor:not-allowed}.pagination-component .pages .pagination-button .material-icons{font-size:16px;height:16px;width:16px}\n"], dependencies: [{ kind: "component", type: i1.ZenduSelectComponent, selector: "zen-select", inputs: ["selectModel", "options", "placeholder", "displayProp", "idProp", "hasSearch", "returnOption", "isMultiselect", "disabled", "customIcon", "customIconStart", "customIconColor", "isTruncate", "enableAddNewOption", "newOptionText", "enableRemoveOption", "removeOptionText", "isLazyLoading", "lazyLoader", "preferedOpenDirection"], outputs: ["selectModelChange", "addNewOption", "removeOption", "closed"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
58
58
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduPaginationBarComponent, decorators: [{
59
59
  type: Component,
60
60
  args: [{ selector: 'zen-pagination-bar', template: "<div class=\"pagination-component\">\n <div class=\"select-dropdown\">\n <label>{{\"Rows per page\" | translate}}:</label>\n <zen-select [(selectModel)]=\"perPage\"\n [options]=\"availablePagesSize\"\n (selectModelChange)=\"updatePageSize()\"></zen-select>\n </div>\n <div class=\"pages\">\n <button class=\"pagination-button\"\n [disabled]=\"page - 1 <= 0\"\n (click)=\"prevPage()\">\n <i class=\"material-icons\">keyboard_arrow_left</i>\n </button>\n <label>{{((page - 1) * perPage) + 1 }} - {{endRowSize()}} of {{count}}</label>\n <button class=\"pagination-button\"\n [disabled]=\"page + 1 > totalPages\"\n (click)=\"nextPage()\">\n <i class=\"material-icons\">keyboard_arrow_right</i>\n </button>\n </div>\n</div>\n", styles: [".pagination-component{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.pagination-component .select-dropdown{display:flex;flex-direction:row;align-items:center;gap:8px}.pagination-component .select-dropdown label{margin:0;font-style:normal;font-weight:400;font-size:12px;line-height:120%;color:#4f4f4f}.pagination-component .pages{display:flex;flex-direction:row;align-items:center;gap:8px}.pagination-component .pages label{margin:0;font-style:normal;font-weight:400;font-size:12px;line-height:16px;color:#828282}.pagination-component .pages .pagination-button{display:flex;flex-direction:row;align-items:center;height:16px;padding:0;box-sizing:border-box;white-space:nowrap;border:none;border-radius:50%;transition:.1s;cursor:pointer;color:#828282;background:#FFFFFF}.pagination-component .pages .pagination-button:hover{color:#4f4f4f;background:#F2F2F2}.pagination-component .pages .pagination-button:focus{outline:none;color:#2188d9;background:#F4F9FD}.pagination-component .pages .pagination-button:disabled{color:#e0e0e0;background:#FFFFFF;cursor:not-allowed}.pagination-component .pages .pagination-button .material-icons{font-size:16px;height:16px;width:16px}\n"] }]
@@ -1,4 +1,4 @@
1
- import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
1
+ import { Component, EventEmitter, Input, Output, ViewChild, } from '@angular/core';
2
2
  import { Util } from '../util';
3
3
  import * as i0 from "@angular/core";
4
4
  import * as i1 from "@angular/common";
@@ -10,7 +10,8 @@ export class ZenduSearchBoxComponent {
10
10
  this._ngZone = _ngZone;
11
11
  this.textChange = new EventEmitter();
12
12
  this.autoFocus = true;
13
- this.placeholder = "Search";
13
+ this.disabled = false;
14
+ this.placeholder = 'Search';
14
15
  this._focusAttempts = 0;
15
16
  this.setDelay(500);
16
17
  }
@@ -29,10 +30,10 @@ export class ZenduSearchBoxComponent {
29
30
  this._debouncedInvoke();
30
31
  }
31
32
  clearFromParent() {
32
- this.text = "";
33
+ this.text = '';
33
34
  }
34
35
  clear() {
35
- this.text = "";
36
+ this.text = '';
36
37
  this._debouncedInvoke();
37
38
  }
38
39
  invokeChange() {
@@ -80,12 +81,12 @@ export class ZenduSearchBoxComponent {
80
81
  if (!element) {
81
82
  return null;
82
83
  }
83
- if (element.nodeName == "INPUT") {
84
+ if (element.nodeName == 'INPUT') {
84
85
  return element;
85
86
  }
86
87
  for (let idx = 0; idx < element.children.length; idx++) {
87
88
  const el = element.children.item(idx);
88
- if (el && el.nodeName == "INPUT") {
89
+ if (el && el.nodeName == 'INPUT') {
89
90
  return el;
90
91
  }
91
92
  }
@@ -104,10 +105,10 @@ export class ZenduSearchBoxComponent {
104
105
  }
105
106
  }
106
107
  ZenduSearchBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduSearchBoxComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
107
- ZenduSearchBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduSearchBoxComponent, selector: "zen-search-box", inputs: { text: "text", delay: "delay", autoFocus: "autoFocus", placeholder: "placeholder" }, outputs: { textChange: "textChange" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }], ngImport: i0, template: "<div class=\"search-box-component\">\n <i class=\"svg-icons\"\n (click)=\"activateSearchBox()\">\n <svg width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"8.33333\"\n cy=\"8.33333\"\n r=\"5.83333\"\n stroke=\"#828282\"\n stroke-width=\"1.6\" />\n <path d=\"M17.5 17.5001L12.9166 12.9167\"\n stroke=\"#828282\"\n stroke-width=\"1.6\"\n stroke-linecap=\"round\" />\n </svg>\n </i>\n <input [(ngModel)]=\"text\"\n class=\"search-box\"\n (ngModelChange)=\"onChange()\"\n placeholder=\"{{placeholder | translate}}\"\n #searchInput>\n <i class=\"material-icons close-icon\"\n *ngIf=\"text\"\n (click)=\"clear()\">close</i>\n</div>", styles: [".search-box-component{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:8px;width:100%;height:40px;background:#FFFFFF;border:1px solid #F2F2F2;box-sizing:border-box;border-radius:4px;padding:8px}.search-box-component:hover{border-color:#b8b9bc}.search-box-component:focus-within{box-shadow:0 0 2px 2px #2188d94d}.search-box-component input{border:0;font-style:normal;font-weight:400;font-size:14px;line-height:130%;width:100%;outline:none;color:#4f4f4f;font-family:Roboto}.search-box-component input::placeholder{color:#828282}.search-box-component .svg-icons{display:flex}.search-box-component .material-icons{color:#828282;-webkit-user-select:none;user-select:none}.search-box-component .material-icons.close-icon{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
108
+ ZenduSearchBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduSearchBoxComponent, selector: "zen-search-box", inputs: { text: "text", delay: "delay", autoFocus: "autoFocus", disabled: "disabled", placeholder: "placeholder" }, outputs: { textChange: "textChange" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }], ngImport: i0, template: "<div class=\"search-box-component\">\n <i class=\"svg-icons\"\n (click)=\"activateSearchBox()\">\n <svg width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"8.33333\"\n cy=\"8.33333\"\n r=\"5.83333\"\n stroke=\"#828282\"\n stroke-width=\"1.6\" />\n <path d=\"M17.5 17.5001L12.9166 12.9167\"\n stroke=\"#828282\"\n stroke-width=\"1.6\"\n stroke-linecap=\"round\" />\n </svg>\n </i>\n <input [(ngModel)]=\"text\"\n class=\"search-box\"\n (ngModelChange)=\"onChange()\"\n placeholder=\"{{placeholder | translate}}\"\n [disabled]=\"disabled\"\n #searchInput>\n <i class=\"material-icons close-icon\"\n *ngIf=\"text\"\n (click)=\"clear()\">close</i>\n</div>\n", styles: [".search-box-component{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:8px;width:100%;height:40px;background:#FFFFFF;border:1px solid #F2F2F2;box-sizing:border-box;border-radius:4px;padding:8px}.search-box-component:hover{border-color:#b8b9bc}.search-box-component:focus-within{box-shadow:0 0 2px 2px #2188d94d}.search-box-component input{border:0;font-style:normal;font-weight:400;font-size:14px;line-height:130%;width:100%;outline:none;color:#4f4f4f;font-family:Roboto}.search-box-component input::placeholder{color:#828282}.search-box-component .svg-icons{display:flex}.search-box-component .material-icons{color:#828282;-webkit-user-select:none;user-select:none}.search-box-component .material-icons.close-icon{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
108
109
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduSearchBoxComponent, decorators: [{
109
110
  type: Component,
110
- args: [{ selector: 'zen-search-box', template: "<div class=\"search-box-component\">\n <i class=\"svg-icons\"\n (click)=\"activateSearchBox()\">\n <svg width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"8.33333\"\n cy=\"8.33333\"\n r=\"5.83333\"\n stroke=\"#828282\"\n stroke-width=\"1.6\" />\n <path d=\"M17.5 17.5001L12.9166 12.9167\"\n stroke=\"#828282\"\n stroke-width=\"1.6\"\n stroke-linecap=\"round\" />\n </svg>\n </i>\n <input [(ngModel)]=\"text\"\n class=\"search-box\"\n (ngModelChange)=\"onChange()\"\n placeholder=\"{{placeholder | translate}}\"\n #searchInput>\n <i class=\"material-icons close-icon\"\n *ngIf=\"text\"\n (click)=\"clear()\">close</i>\n</div>", styles: [".search-box-component{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:8px;width:100%;height:40px;background:#FFFFFF;border:1px solid #F2F2F2;box-sizing:border-box;border-radius:4px;padding:8px}.search-box-component:hover{border-color:#b8b9bc}.search-box-component:focus-within{box-shadow:0 0 2px 2px #2188d94d}.search-box-component input{border:0;font-style:normal;font-weight:400;font-size:14px;line-height:130%;width:100%;outline:none;color:#4f4f4f;font-family:Roboto}.search-box-component input::placeholder{color:#828282}.search-box-component .svg-icons{display:flex}.search-box-component .material-icons{color:#828282;-webkit-user-select:none;user-select:none}.search-box-component .material-icons.close-icon{cursor:pointer}\n"] }]
111
+ args: [{ selector: 'zen-search-box', template: "<div class=\"search-box-component\">\n <i class=\"svg-icons\"\n (click)=\"activateSearchBox()\">\n <svg width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"8.33333\"\n cy=\"8.33333\"\n r=\"5.83333\"\n stroke=\"#828282\"\n stroke-width=\"1.6\" />\n <path d=\"M17.5 17.5001L12.9166 12.9167\"\n stroke=\"#828282\"\n stroke-width=\"1.6\"\n stroke-linecap=\"round\" />\n </svg>\n </i>\n <input [(ngModel)]=\"text\"\n class=\"search-box\"\n (ngModelChange)=\"onChange()\"\n placeholder=\"{{placeholder | translate}}\"\n [disabled]=\"disabled\"\n #searchInput>\n <i class=\"material-icons close-icon\"\n *ngIf=\"text\"\n (click)=\"clear()\">close</i>\n</div>\n", styles: [".search-box-component{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:8px;width:100%;height:40px;background:#FFFFFF;border:1px solid #F2F2F2;box-sizing:border-box;border-radius:4px;padding:8px}.search-box-component:hover{border-color:#b8b9bc}.search-box-component:focus-within{box-shadow:0 0 2px 2px #2188d94d}.search-box-component input{border:0;font-style:normal;font-weight:400;font-size:14px;line-height:130%;width:100%;outline:none;color:#4f4f4f;font-family:Roboto}.search-box-component input::placeholder{color:#828282}.search-box-component .svg-icons{display:flex}.search-box-component .material-icons{color:#828282;-webkit-user-select:none;user-select:none}.search-box-component .material-icons.close-icon{cursor:pointer}\n"] }]
111
112
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }]; }, propDecorators: { text: [{
112
113
  type: Input
113
114
  }], textChange: [{
@@ -116,10 +117,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
116
117
  type: Input
117
118
  }], autoFocus: [{
118
119
  type: Input
120
+ }], disabled: [{
121
+ type: Input
119
122
  }], placeholder: [{
120
123
  type: Input
121
124
  }], searchInput: [{
122
125
  type: ViewChild,
123
126
  args: ['searchInput', { static: false }]
124
127
  }] } });
125
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemVuZHUtc2VhcmNoLWJveC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy16ZW5kdWl0L3NyYy9saWIvc2VhcmNoLWJveC96ZW5kdS1zZWFyY2gtYm94LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLXplbmR1aXQvc3JjL2xpYi9zZWFyY2gtYm94L3plbmR1LXNlYXJjaC1ib3guY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxZQUFZLEVBQUUsS0FBSyxFQUFrQixNQUFNLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzlHLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxTQUFTLENBQUM7Ozs7O0FBTy9CLE1BQU0sT0FBTyx1QkFBdUI7SUFvQmxDLFlBQ1UsUUFBb0IsRUFDcEIsT0FBZTtRQURmLGFBQVEsR0FBUixRQUFRLENBQVk7UUFDcEIsWUFBTyxHQUFQLE9BQU8sQ0FBUTtRQWxCZixlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztRQU16QyxjQUFTLEdBQUcsSUFBSSxDQUFDO1FBRVYsZ0JBQVcsR0FBRyxRQUFRLENBQUM7UUFNL0IsbUJBQWMsR0FBRyxDQUFDLENBQUM7UUFNekIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsQ0FBQztJQUNyQixDQUFDO0lBbkJELElBQWEsS0FBSyxDQUFDLEdBQVc7UUFDNUIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsQ0FBQztJQUNyQixDQUFDO0lBbUJNLFFBQVE7UUFDYix5Q0FBeUM7UUFDekMsVUFBVSxDQUFDLEdBQUcsRUFBRTtZQUNkLElBQUksSUFBSSxDQUFDLFNBQVMsRUFBRTtnQkFDbEIsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDO2FBQ2hCO1FBQ0gsQ0FBQyxFQUFFLEdBQUcsQ0FBQyxDQUFDO0lB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QUNWO1lBQ0QsTUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxFQUFpQixDQUFDLENBQUM7WUFDakQsSUFBSSxPQUFPLEVBQUU7Z0JBQ1gsT0FBTyxPQUFPLENBQUM7YUFDaEI7U0FDRjtRQUVELE9BQU8sSUFBSSxDQUFDO0lBQ2QsQ0FBQzs7cUhBN0hVLHVCQUF1Qjt5R0FBdkIsdUJBQXVCLHVTQ1JwQyxrNkJBMkJNOzRGRG5CTyx1QkFBdUI7a0JBTG5DLFNBQVM7K0JBQ0UsZ0JBQWdCO3NIQU1qQixJQUFJO3NCQUFaLEtBQUs7Z0JBRUksVUFBVTtzQkFBbkIsTUFBTTtnQkFFTSxLQUFLO3NCQUFqQixLQUFLO2dCQUlHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBRVUsV0FBVztzQkFBMUIsS0FBSztnQkFFdUMsV0FBVztzQkFBdkQsU0FBUzt1QkFBQyxhQUFhLEVBQUUsRUFBRSxNQUFNLEVBQUUsS0FBSyxFQUFFIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFbGVtZW50UmVmLCBFdmVudEVtaXR0ZXIsIElucHV0LCBOZ1pvbmUsIE9uSW5pdCwgT3V0cHV0LCBWaWV3Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFV0aWwgfSBmcm9tICcuLi91dGlsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnemVuLXNlYXJjaC1ib3gnLFxuICB0ZW1wbGF0ZVVybDogJy4vemVuZHUtc2VhcmNoLWJveC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3plbmR1LXNlYXJjaC1ib3guY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBaZW5kdVNlYXJjaEJveENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG5cbiAgQElucHV0KCkgdGV4dDogc3RyaW5nO1xuXG4gIEBPdXRwdXQoKSB0ZXh0Q2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XG5cbiAgQElucHV0KCkgc2V0IGRlbGF5KHZhbDogbnVtYmVyKSB7XG4gICAgdGhpcy5zZXREZWxheSh2YWwpO1xuICB9XG5cbiAgQElucHV0KCkgYXV0b0ZvY3VzID0gdHJ1ZTtcblxuICBASW5wdXQoKSBwdWJsaWMgcGxhY2Vob2xkZXIgPSBcIlNlYXJjaFwiO1xuXG4gIEBWaWV3Q2hpbGQoJ3NlYXJjaElucHV0JywgeyBzdGF0aWM6IGZhbHNlIH0pIHNlYXJjaElucHV0ITogRWxlbWVudFJlZjtcblxuICBwcml2YXRlIF9kZWJvdW5jZWRJbnZva2UhOiAoKSA9PiB2b2lkO1xuXG4gIHByaXZhdGUgX2ZvY3VzQXR0ZW1wdHMgPSAwO1xuXG4gIHB1YmxpYyBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIF9lbGVtZW50OiBFbGVtZW50UmVmLFxuICAgIHByaXZhdGUgX25nWm9uZTogTmdab25lKSB7XG5cbiAgICB0aGlzLnNldERlbGF5KDUwMCk7XG4gIH1cblxuICBwdWJsaWMgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgLy8gZ2l2ZSAxMDBtcyBmb3IgYXV0b0ZvY3VzIGluaXRhbGl6YXRpb25cbiAgICBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgIGlmICh0aGlzLmF1dG9Gb2N1cykge1xuICAgICAgICB0aGlzLmRvRm9jdXMoKTtcbiAgICAgIH1cbiAgICB9LCAxMDApO1xuICB9XG5cbiAgcHVibGljIG9uQ2hhbmdlKCkge1xuICAgIHRoaXMuX2RlYm91bmNlZEludm9rZSgpO1xuICB9XG5cbiAgcHVibGljIGNsZWFyRnJvbVBhcmVudCgpIHtcbiAgICB0aGlzLnRleHQgPSBcIlwiO1xuICB9XG5cbiAgcHVibGljIGNsZWFyKCkge1xuICAgIHRoaXMudGV4dCA9IFwiXCI7XG4gICAgdGhpcy5fZGVib3VuY2VkSW52b2tlKCk7XG4gIH1cblxuICBwcml2YXRlIGludm9rZUNoYW5nZSgpIHtcbiAgICB0aGlzLl9uZ1pvbmUucnVuKCgpID0+IHtcbiAgICAgIHRoaXMudGV4dENoYW5nZS5lbWl0KHRoaXMudGV4dCk7XG4gICAgfSlcbiAgfVxuXG4gIHByaXZhdGUgc2V0RGVsYXkoZGVsYXk6IG51bWJlcikge1xuICAgIHRoaXMuX2RlYm91bmNlZEludm9rZSA9IFV0aWwuZGVib3VuY2UoKCkgPT4ge1xuICAgICAgdGhpcy5pbnZva2VDaGFuZ2UoKTtcbiAgICB9LCBkZWxheSk7XG4gIH1cblxuICBwdWJsaWMgYWN0aXZhdGVTZWFyY2hCb3goKSB7XG4gICAgdGhpcy5zZWFyY2hJbnB1dC5uYXRpdmVFbGVtZW50LmZvY3VzKCk7XG4gIH1cblxuICBwdWJsaWMgZG9Gb2N1cygpIHtcblxuICAgIHRoaXMuX2ZvY3VzQXR0ZW1wdHMrKztcbiAgICBpZiAodGhpcy5fZm9jdXNBdHRlbXB0cyA+IDEwMCkge1xuICAgICAgLy8gc3RvcCBhdHRlbXB0cyB0byBpbml0YWxpemVcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBjb25zdCBpbnB1dCA9IHRoaXMuZ2V0SW5wdXQodGhpcy5fZWxlbWVudC5uYXRpdmVFbGVtZW50KTtcbiAgICBpZiAoIWlucHV0KSB7XG4gICAgICAvLyB3YWl0IDEwMG1zIHRvIHJ1biB0aGUgbmV4dCBjaGVja1xuICAgICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICAgIHRoaXMuZG9Gb2N1cygpO1xuICAgICAgfSwgMTAwKTtcbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgLy8gY2hlY2sgaWYgZWxlbWVudCB2aXNpYmxlIG9yIG5vdFxuICAgIGNvbnN0IGhlaWdodCA9IGlucHV0LmNsaWVudEhlaWdodDtcbiAgICBpZiAoaGVpZ2h0ID09IDApIHtcbiAgICAgIC8vIHdhaXQgMTAwbXMgdG8gcnVuIHRoZSBuZXh0IGNoZWNrXG4gICAgICBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgdGhpcy5kb0ZvY3VzKCk7XG4gICAgICB9LCAxMDApO1xuICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIC8vIHNldCBmb2N1cyB0byBlbGVtZW50XG4gICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICBpbnB1dC5mb2N1cygpO1xuICAgIH0sIDEpO1xuICB9XG5cbiAgcHJpdmF0ZSBnZXRJbnB1dChlbGVtZW50OiBIVE1MRWxlbWVudCB8IG51bGwpOiBIVE1MSW5wdXRFbGVtZW50IHwgbnVsbCB7XG4gICAgaWYgKCFlbGVtZW50KSB7XG4gICAgICByZXR1cm4gbnVsbDtcbiAgICB9XG4gICAgaWYgKGVsZW1lbnQubm9kZU5hbWUgPT0gXCJJTlBVVFwiKSB7XG4gICAgICByZXR1cm4gZWxlbWVudCBhcyBIVE1MSW5wdXRFbGVtZW50O1xuICAgIH1cblxuICAgIGZvciAobGV0IGlkeCA9IDA7IGlkeCA8IGVsZW1lbnQuY2hpbGRyZW4ubGVuZ3RoOyBpZHgrKykge1xuICAgICAgY29uc3QgZWwgPSBlbGVtZW50LmNoaWxkcmVuLml0ZW0oaWR4KTtcbiAgICAgIGlmIChlbCAmJiBlbC5ub2RlTmFtZSA9PSBcIklOUFVUXCIpIHtcbiAgICAgICAgcmV0dXJuIGVsIGFzIEhUTUxJbnB1dEVsZW1lbnQ7XG4gICAgICB9XG4gICAgfVxuXG4gICAgLy8gZmluZCBpbnB1dCBpbiB0aGUgY2hpbGRyZW4gdHJlZVxuICAgIGZvciAobGV0IGlkeCA9IDA7IGlkeCA8IGVsZW1lbnQuY2hpbGRyZW4ubGVuZ3RoOyBpZHgrKykge1xuICAgICAgY29uc3QgZWwgPSBlbGVtZW50LmNoaWxkcmVuLml0ZW0oaWR4KTtcbiAgICAgIGlmICghZWwpIHtcbiAgICAgICAgY29udGludWU7XG4gICAgICB9XG4gICAgICBjb25zdCBlbElucHV0ID0gdGhpcy5nZXRJbnB1dChlbCBhcyBIVE1MRWxlbWVudCk7XG4gICAgICBpZiAoZWxJbnB1dCkge1xuICAgICAgICByZXR1cm4gZWxJbnB1dDtcbiAgICAgIH1cbiAgICB9XG5cbiAgICByZXR1cm4gbnVsbDtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cInNlYXJjaC1ib3gtY29tcG9uZW50XCI+XG4gICA8aSBjbGFzcz1cInN2Zy1pY29uc1wiXG4gICAgICAoY2xpY2spPVwiYWN0aXZhdGVTZWFyY2hCb3goKVwiPlxuICAgICAgPHN2ZyB3aWR0aD1cIjIwXCJcbiAgICAgICAgICAgaGVpZ2h0PVwiMjBcIlxuICAgICAgICAgICB2aWV3Qm94PVwiMCAwIDIwIDIwXCJcbiAgICAgICAgICAgZmlsbD1cIm5vbmVcIlxuICAgICAgICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+XG4gICAgICAgICA8Y2lyY2xlIGN4PVwiOC4zMzMzM1wiXG4gICAgICAgICAgICAgICAgIGN5PVwiOC4zMzMzM1wiXG4gICAgICAgICAgICAgICAgIHI9XCI1LjgzMzMzXCJcbiAgICAgICAgICAgICAgICAgc3Ryb2tlPVwiIzgyODI4MlwiXG4gICAgICAgICAgICAgICAgIHN0cm9rZS13aWR0aD1cIjEuNlwiIC8+XG4gICAgICAgICA8cGF0aCBkPVwiTTE3LjUgMTcuNTAwMUwxMi45MTY2IDEyLjkxNjdcIlxuICAgICAgICAgICAgICAgc3Ryb2tlPVwiIzgyODI4MlwiXG4gICAgICAgICAgICAgICBzdHJva2Utd2lkdGg9XCIxLjZcIlxuICAgICAgICAgICAgICAgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIC8+XG4gICAgICA8L3N2Zz5cbiAgIDwvaT5cbiAgIDxpbnB1dCBbKG5nTW9kZWwpXT1cInRleHRcIlxuICAgICAgICAgIGNsYXNzPVwic2VhcmNoLWJveFwiXG4gICAgICAgICAgKG5nTW9kZWxDaGFuZ2UpPVwib25DaGFuZ2UoKVwiXG4gICAgICAgICAgcGxhY2Vob2xkZXI9XCJ7e3BsYWNlaG9sZGVyIHwgdHJhbnNsYXRlfX1cIlxuICAgICAgICAgICNzZWFyY2hJbnB1dD5cbiAgIDxpIGNsYXNzPVwibWF0ZXJpYWwtaWNvbnMgY2xvc2UtaWNvblwiXG4gICAgICAqbmdJZj1cInRleHRcIlxuICAgICAgKGNsaWNrKT1cImNsZWFyKClcIj5jbG9zZTwvaT5cbjwvZGl2PiJdfQ==
128
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemVuZHUtc2VhcmNoLWJveC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy16ZW5kdWl0L3NyYy9saWIvc2VhcmNoLWJveC96ZW5kdS1zZWFyY2gtYm94LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLXplbmR1aXQvc3JjL2xpYi9zZWFyY2gtYm94L3plbmR1LXNlYXJjaC1ib3guY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLFNBQVMsRUFFVCxZQUFZLEVBQ1osS0FBSyxFQUdMLE1BQU0sRUFDTixTQUFTLEdBQ1YsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLFNBQVMsQ0FBQzs7Ozs7QUFPL0IsTUFBTSxPQUFPLHVCQUF1QjtJQXFCbEMsWUFBMkIsUUFBb0IsRUFBVSxPQUFlO1FBQTdDLGFBQVEsR0FBUixRQUFRLENBQVk7UUFBVSxZQUFPLEdBQVAsT0FBTyxDQUFRO1FBbEI5RCxlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztRQU16QyxjQUFTLEdBQUcsSUFBSSxDQUFDO1FBRWpCLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFFVixnQkFBVyxHQUFHLFFBQVEsQ0FBQztRQU0vQixtQkFBYyxHQUFHLENBQUMsQ0FBQztRQUd6QixJQUFJLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxDQUFDO0lBQ3JCLENBQUM7SUFsQkQsSUFBYSxLQUFLLENBQUMsR0FBVztRQUM1QixJQUFJLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxDQUFDO0lBQ3JCLENBQUM7SUFrQk0sUUFBUTtRQUNiLHlDQUF5QztRQUN6QyxVQUFVLENBQUMsR0FBRyxFQUFFO1lBQ2QsSUFBSSxJQUFJLENBQUMsU0FBUyxFQUFFO2dCQUNsQixJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7YUFDaEI7UUFDSCxDQUFDLEVBQUUsR0FBRyxDQUFDLENBQUM7SUFDVixDQUFDO0lBRU0sUUFBUTtRQUNiLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO0lBQzFCLENBQUM7SUFFTSxlQUFlO1FBQ3BCLElBQUksQ0FBQyxJQUFJLEdBQUcsRUFBRSxDQUFDO0lBQ2pCLENBQUM7SUFFTSxLQUFLO1FBQ1YsSUFBSSxDQUFDLElBQUksR0FBRyxFQUFFLENBQUM7UUFDZixJQUFJLENBQUMsZ0JBQWdCLEVBQUUsQ0FBQztJQUMxQixDQUFDO0lBRU8sWUFBWTtRQUNsQixJQUFJLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxHQUFHLEVBQUU7WUFDcEIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQ2xDLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVPLFFBQVEsQ0FBQyxLQUFhO1FBQzVCLElBQUksQ0FBQyxnQkFBZ0IsR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLEdBQUcsRUFBRTtZQUN6QyxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDdEIsQ0FBQyxFQUFFLEtBQUssQ0FBQyxDQUFDO0lBQ1osQ0FBQztJQUVNLGlCQUFpQjtRQUN0QixJQUFJLENBQUMsV0FBVyxDQUFDLGFBQWEsQ0FBQyxLQUFLLEVBQUUsQ0FBQztJQUN6QyxDQUFDO0lBRU0sT0FBTztRQUNaLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUN0QixJQUFJLElBQUksQ0FBQyxjQUFjLEdBQUcsR0FBRyxFQUFFO1lBQzdCLDZCQUE2QjtZQUM3QixPQUFPO1NBQ1I7UUFFRCxNQUFNLEtBQUssR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsYUFBYSxDQUFDLENBQUM7UUFDekQsSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNWLG1DQUFtQztZQUNuQyxVQUFVLENBQUMsR0FBRyxFQUFFO2dCQUNkLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztZQUNqQixDQUFDLEVBQUUsR0FBRyxDQUFDLENBQUM7WUFDUixPQUFPO1NBQ1I7UUFDRCxrQ0FBa0M7UUFDbEMsTUFBTSxNQUFNLEdBQUcsS0FBSyxDQUFDLFlBQVksQ0FBQztRQUNsQyxJQUFJLE1BQU0sSUFBSSxDQUFDLEVBQUU7WUFDZixtQ0FBbUM7WUFDbkMsVUFBVSxDQUFDLEdBQUcsRUFBRTtnQkFDZCxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7WUFDakIsQ0FBQyxFQUFFLEdBQUcsQ0FBQyxDQUFDO1lBQ1IsT0FBTztTQUNSO1FBRUQsdUJBQXVCO1FBQ3ZCLFVBQVUsQ0FBQyxHQUFHLEVBQUU7WUFDZCxLQUFLLENBQUMsS0FBSyxFQUFFLENBQUM7UUFDaEIsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDO0lBQ1IsQ0FBQztJQUVPLFFBQVEsQ0FBQyxPQUEyQjtRQUMxQyxJQUFJLENBQUMsT0FBTyxFQUFFO1lBQ1osT0FBTyxJQUFJLENBQUM7U0FDYjtRQUNELElBQUksT0FBTyxDQUFDLFFBQVEsSUFBSSxPQUFPLEVBQUU7WUFDL0IsT0FBTyxPQUEyQixDQUFDO1NBQ3BDO1FBRUQsS0FBSyxJQUFJLEdBQUcsR0FBRyxDQUFDLEVBQUUsR0FBRyxHQUFHLE9BQU8sQ0FBQyxRQUFRLENBQUMsTUFBTSxFQUFFLEdBQUcsRUFBRSxFQUFFO1lBQ3RELE1BQU0sRUFBRSxHQUFHLE9BQU8sQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO1lBQ3RDLElBQUksRUFBRSxJQUFJLEVBQUUsQ0FBQyxRQUFRLElBQUksT0FBTyxFQUFFO2dCQUNoQyxPQUFPLEVBQXNCLENBQUM7YUFDL0I7U0FDRjtRQUVELGtDQUFrQztRQUNsQyxLQUFLLElBQUksR0FBRyxHQUFHLENBQUMsRUFBRSxHQUFHLEdBQUcsT0FBTyxDQUFDLFFBQVEsQ0FBQyxNQUFNLEVBQUUsR0FBRyxFQUFFLEVBQUU7WUFDdEQsTUFBTSxFQUFFLEdBQUcsT0FBTyxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7WUFDdEMsSUFBSSxDQUFDLEVBQUUsRUFBRTtnQkFDUCxTQUFTO2FBQ1Y7WUFDRCxNQUFNLE9BQU8sR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLEVBQWlCLENBQUMsQ0FBQztZQUNqRCxJQUFJLE9BQU8sRUFBRTtnQkFDWCxPQUFPLE9BQU8sQ0FBQzthQUNoQjtTQUNGO1FBRUQsT0FBTyxJQUFJLENBQUM7SUFDZCxDQUFDOztxSEExSFUsdUJBQXVCO3lHQUF2Qix1QkFBdUIsNlRDakJwQyx1OEJBNkJBOzRGRFphLHVCQUF1QjtrQkFMbkMsU0FBUzsrQkFDRSxnQkFBZ0I7c0hBS2pCLElBQUk7c0JBQVosS0FBSztnQkFFSSxVQUFVO3NCQUFuQixNQUFNO2dCQUVNLEtBQUs7c0JBQWpCLEtBQUs7Z0JBSUcsU0FBUztzQkFBakIsS0FBSztnQkFFRyxRQUFRO3NCQUFoQixLQUFLO2dCQUVVLFdBQVc7c0JBQTFCLEtBQUs7Z0JBRXVDLFdBQVc7c0JBQXZELFNBQVM7dUJBQUMsYUFBYSxFQUFFLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIENvbXBvbmVudCxcbiAgRWxlbWVudFJlZixcbiAgRXZlbnRFbWl0dGVyLFxuICBJbnB1dCxcbiAgTmdab25lLFxuICBPbkluaXQsXG4gIE91dHB1dCxcbiAgVmlld0NoaWxkLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFV0aWwgfSBmcm9tICcuLi91dGlsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnemVuLXNlYXJjaC1ib3gnLFxuICB0ZW1wbGF0ZVVybDogJy4vemVuZHUtc2VhcmNoLWJveC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3plbmR1LXNlYXJjaC1ib3guY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgWmVuZHVTZWFyY2hCb3hDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBASW5wdXQoKSB0ZXh0OiBzdHJpbmc7XG5cbiAgQE91dHB1dCgpIHRleHRDaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcblxuICBASW5wdXQoKSBzZXQgZGVsYXkodmFsOiBudW1iZXIpIHtcbiAgICB0aGlzLnNldERlbGF5KHZhbCk7XG4gIH1cblxuICBASW5wdXQoKSBhdXRvRm9jdXMgPSB0cnVlO1xuXG4gIEBJbnB1dCgpIGRpc2FibGVkID0gZmFsc2U7XG5cbiAgQElucHV0KCkgcHVibGljIHBsYWNlaG9sZGVyID0gJ1NlYXJjaCc7XG5cbiAgQFZpZXdDaGlsZCgnc2VhcmNoSW5wdXQnLCB7IHN0YXRpYzogZmFsc2UgfSkgc2VhcmNoSW5wdXQhOiBFbGVtZW50UmVmO1xuXG4gIHByaXZhdGUgX2RlYm91bmNlZEludm9rZSE6ICgpID0+IHZvaWQ7XG5cbiAgcHJpdmF0ZSBfZm9jdXNBdHRlbXB0cyA9IDA7XG5cbiAgcHVibGljIGNvbnN0cnVjdG9yKHByaXZhdGUgX2VsZW1lbnQ6IEVsZW1lbnRSZWYsIHByaXZhdGUgX25nWm9uZTogTmdab25lKSB7XG4gICAgdGhpcy5zZXREZWxheSg1MDApO1xuICB9XG5cbiAgcHVibGljIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIC8vIGdpdmUgMTAwbXMgZm9yIGF1dG9Gb2N1cyBpbml0YWxpemF0aW9uXG4gICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICBpZiAodGhpcy5hdXRvRm9jdXMpIHtcbiAgICAgICAgdGhpcy5kb0ZvY3VzKCk7XG4gICAgICB9XG4gICAgfSwgMTAwKTtcbiAgfVxuXG4gIHB1YmxpYyBvbkNoYW5nZSgpIHtcbiAgICB0aGlzLl9kZWJvdW5jZWRJbnZva2UoKTtcbiAgfVxuXG4gIHB1YmxpYyBjbGVhckZyb21QYXJlbnQoKSB7XG4gICAgdGhpcy50ZXh0ID0gJyc7XG4gIH1cblxuICBwdWJsaWMgY2xlYXIoKSB7XG4gICAgdGhpcy50ZXh0ID0gJyc7XG4gICAgdGhpcy5fZGVib3VuY2VkSW52b2tlKCk7XG4gIH1cblxuICBwcml2YXRlIGludm9rZUNoYW5nZSgpIHtcbiAgICB0aGlzLl9uZ1pvbmUucnVuKCgpID0+IHtcbiAgICAgIHRoaXMudGV4dENoYW5nZS5lbWl0KHRoaXMudGV4dCk7XG4gICAgfSk7XG4gIH1cblxuICBwcml2YXRlIHNldERlbGF5KGRlbGF5OiBudW1iZXIpIHtcbiAgICB0aGlzLl9kZWJvdW5jZWRJbnZva2UgPSBVdGlsLmRlYm91bmNlKCgpID0+IHtcbiAgICAgIHRoaXMuaW52b2tlQ2hhbmdlKCk7XG4gICAgfSwgZGVsYXkpO1xuICB9XG5cbiAgcHVibGljIGFjdGl2YXRlU2VhcmNoQm94KCkge1xuICAgIHRoaXMuc2VhcmNoSW5wdXQubmF0aXZlRWxlbWVudC5mb2N1cygpO1xuICB9XG5cbiAgcHVibGljIGRvRm9jdXMoKSB7XG4gICAgdGhpcy5fZm9jdXNBdHRlbXB0cysrO1xuICAgIGlmICh0aGlzLl9mb2N1c0F0dGVtcHRzID4gMTAwKSB7XG4gICAgICAvLyBzdG9wIGF0dGVtcHRzIHRvIGluaXRhbGl6ZVxuICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIGNvbnN0IGlucHV0ID0gdGhpcy5nZXRJbnB1dCh0aGlzLl9lbGVtZW50Lm5hdGl2ZUVsZW1lbnQpO1xuICAgIGlmICghaW5wdXQpIHtcbiAgICAgIC8vIHdhaXQgMTAwbXMgdG8gcnVuIHRoZSBuZXh0IGNoZWNrXG4gICAgICBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgdGhpcy5kb0ZvY3VzKCk7XG4gICAgICB9LCAxMDApO1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICAvLyBjaGVjayBpZiBlbGVtZW50IHZpc2libGUgb3Igbm90XG4gICAgY29uc3QgaGVpZ2h0ID0gaW5wdXQuY2xpZW50SGVpZ2h0O1xuICAgIGlmIChoZWlnaHQgPT0gMCkge1xuICAgICAgLy8gd2FpdCAxMDBtcyB0byBydW4gdGhlIG5leHQgY2hlY2tcbiAgICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICB0aGlzLmRvRm9jdXMoKTtcbiAgICAgIH0sIDEwMCk7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgLy8gc2V0IGZvY3VzIHRvIGVsZW1lbnRcbiAgICBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgIGlucHV0LmZvY3VzKCk7XG4gICAgfSwgMSk7XG4gIH1cblxuICBwcml2YXRlIGdldElucHV0KGVsZW1lbnQ6IEhUTUxFbGVtZW50IHwgbnVsbCk6IEhUTUxJbnB1dEVsZW1lbnQgfCBudWxsIHtcbiAgICBpZiAoIWVsZW1lbnQpIHtcbiAgICAgIHJldHVybiBudWxsO1xuICAgIH1cbiAgICBpZiAoZWxlbWVudC5ub2RlTmFtZSA9PSAnSU5QVVQnKSB7XG4gICAgICByZXR1cm4gZWxlbWVudCBhcyBIVE1MSW5wdXRFbGVtZW50O1xuICAgIH1cblxuICAgIGZvciAobGV0IGlkeCA9IDA7IGlkeCA8IGVsZW1lbnQuY2hpbGRyZW4ubGVuZ3RoOyBpZHgrKykge1xuICAgICAgY29uc3QgZWwgPSBlbGVtZW50LmNoaWxkcmVuLml0ZW0oaWR4KTtcbiAgICAgIGlmIChlbCAmJiBlbC5ub2RlTmFtZSA9PSAnSU5QVVQnKSB7XG4gICAgICAgIHJldHVybiBlbCBhcyBIVE1MSW5wdXRFbGVtZW50O1xuICAgICAgfVxuICAgIH1cblxuICAgIC8vIGZpbmQgaW5wdXQgaW4gdGhlIGNoaWxkcmVuIHRyZWVcbiAgICBmb3IgKGxldCBpZHggPSAwOyBpZHggPCBlbGVtZW50LmNoaWxkcmVuLmxlbmd0aDsgaWR4KyspIHtcbiAgICAgIGNvbnN0IGVsID0gZWxlbWVudC5jaGlsZHJlbi5pdGVtKGlkeCk7XG4gICAgICBpZiAoIWVsKSB7XG4gICAgICAgIGNvbnRpbnVlO1xuICAgICAgfVxuICAgICAgY29uc3QgZWxJbnB1dCA9IHRoaXMuZ2V0SW5wdXQoZWwgYXMgSFRNTEVsZW1lbnQpO1xuICAgICAgaWYgKGVsSW5wdXQpIHtcbiAgICAgICAgcmV0dXJuIGVsSW5wdXQ7XG4gICAgICB9XG4gICAgfVxuXG4gICAgcmV0dXJuIG51bGw7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJzZWFyY2gtYm94LWNvbXBvbmVudFwiPlxuICAgPGkgY2xhc3M9XCJzdmctaWNvbnNcIlxuICAgICAgKGNsaWNrKT1cImFjdGl2YXRlU2VhcmNoQm94KClcIj5cbiAgICAgIDxzdmcgd2lkdGg9XCIyMFwiXG4gICAgICAgICAgIGhlaWdodD1cIjIwXCJcbiAgICAgICAgICAgdmlld0JveD1cIjAgMCAyMCAyMFwiXG4gICAgICAgICAgIGZpbGw9XCJub25lXCJcbiAgICAgICAgICAgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgICAgPGNpcmNsZSBjeD1cIjguMzMzMzNcIlxuICAgICAgICAgICAgICAgICBjeT1cIjguMzMzMzNcIlxuICAgICAgICAgICAgICAgICByPVwiNS44MzMzM1wiXG4gICAgICAgICAgICAgICAgIHN0cm9rZT1cIiM4MjgyODJcIlxuICAgICAgICAgICAgICAgICBzdHJva2Utd2lkdGg9XCIxLjZcIiAvPlxuICAgICAgICAgPHBhdGggZD1cIk0xNy41IDE3LjUwMDFMMTIuOTE2NiAxMi45MTY3XCJcbiAgICAgICAgICAgICAgIHN0cm9rZT1cIiM4MjgyODJcIlxuICAgICAgICAgICAgICAgc3Ryb2tlLXdpZHRoPVwiMS42XCJcbiAgICAgICAgICAgICAgIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIiAvPlxuICAgICAgPC9zdmc+XG4gICA8L2k+XG4gICA8aW5wdXQgWyhuZ01vZGVsKV09XCJ0ZXh0XCJcbiAgICAgICAgICBjbGFzcz1cInNlYXJjaC1ib3hcIlxuICAgICAgICAgIChuZ01vZGVsQ2hhbmdlKT1cIm9uQ2hhbmdlKClcIlxuICAgICAgICAgIHBsYWNlaG9sZGVyPVwie3twbGFjZWhvbGRlciB8IHRyYW5zbGF0ZX19XCJcbiAgICAgICAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxuICAgICAgICAgICNzZWFyY2hJbnB1dD5cbiAgIDxpIGNsYXNzPVwibWF0ZXJpYWwtaWNvbnMgY2xvc2UtaWNvblwiXG4gICAgICAqbmdJZj1cInRleHRcIlxuICAgICAgKGNsaWNrKT1cImNsZWFyKClcIj5jbG9zZTwvaT5cbjwvZGl2PlxuIl19