@porscheinformatik/clr-addons 17.4.3 → 17.5.1

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.
@@ -1,18 +1,18 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Component, NgModule, Injectable, EventEmitter, Input, Output, Directive, ViewChild, ContentChildren, TemplateRef, ViewChildren, HostBinding, ElementRef, Renderer2, forwardRef, Inject, ContentChild, Optional, HostListener, InjectionToken, LOCALE_ID, Self } from '@angular/core';
2
+ import { Component, NgModule, Injectable, EventEmitter, Input, Output, Directive, ViewChild, ContentChildren, TemplateRef, ViewChildren, HostBinding, ElementRef, Renderer2, forwardRef, Inject, ContentChild, Optional, HostListener, InjectionToken, ChangeDetectionStrategy, LOCALE_ID, Self } from '@angular/core';
3
3
  import * as i1 from '@angular/common';
4
4
  import { CommonModule, DOCUMENT, getLocaleDateFormat, FormatWidth } from '@angular/common';
5
5
  import { ClarityIcons, arrowIcon, angleIcon, timesIcon, trashIcon, plusCircleIcon, exclamationCircleIcon, searchIcon, ellipsisVerticalIcon, pencilIcon, historyIcon, treeViewIcon, organizationIcon, calendarIcon, checkCircleIcon, windowCloseIcon, exclamationTriangleIcon } from '@cds/core/icon';
6
- import * as i1$1 from '@clr/angular';
6
+ import * as i2 from '@clr/angular';
7
7
  import { ClarityModule, ClrFormsModule, ClrDropdown, ClrForm, ClrAlert, ClrAxis, ClrSide, ClrAlignment, ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService, ClrIconModule, ClrDropdownModule, ClrDatagridSortOrder, DatagridPropertyComparator, ClrDatagridPagination, ClrDatagridFilter, ClrDateContainer, ClrLabel, ClrControlHelper, ClrControlError, ClrControlSuccess, ClrDatepickerModule } from '@clr/angular';
8
8
  import * as i3$1 from '@angular/forms';
9
- import { FormsModule, NG_VALIDATORS, NgControl, NG_VALUE_ACCESSOR } from '@angular/forms';
10
- import { Subject, BehaviorSubject, timer, asyncScheduler, interval, of, ReplaySubject, takeUntil as takeUntil$1, delay } from 'rxjs';
9
+ import { FormsModule, NG_VALIDATORS, NgControl, NG_VALUE_ACCESSOR, FormControl, ReactiveFormsModule } from '@angular/forms';
10
+ import { Subject, BehaviorSubject, timer, asyncScheduler, interval, takeUntil as takeUntil$1, of, ReplaySubject, delay } from 'rxjs';
11
11
  import { takeUntil, take, observeOn } from 'rxjs/operators';
12
12
  import * as i3 from '@angular/router';
13
13
  import { RouterModule } from '@angular/router';
14
14
  import { trigger, transition, style, animate, state } from '@angular/animations';
15
- import * as i1$2 from '@angular/common/http';
15
+ import * as i1$1 from '@angular/common/http';
16
16
  import '@cds/core/icon/register.js';
17
17
 
18
18
  /*
@@ -29,7 +29,7 @@ class ClrBackButton {
29
29
  this.location.back();
30
30
  }
31
31
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrBackButton, deps: [{ token: i1.Location }], target: i0.ɵɵFactoryTarget.Component }); }
32
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrBackButton, selector: "clr-back-button", ngImport: i0, template: "<button type=\"button\" class=\"btn btn-icon btn-link back-button\" (click)=\"back()\">\n <cds-icon shape=\"arrow\" direction=\"left\" size=\"36\"></cds-icon>\n</button>\n", dependencies: [{ kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }] }); }
32
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrBackButton, selector: "clr-back-button", ngImport: i0, template: "<button type=\"button\" class=\"btn btn-icon btn-link back-button\" (click)=\"back()\">\n <cds-icon shape=\"arrow\" direction=\"left\" size=\"36\"></cds-icon>\n</button>\n", dependencies: [{ kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }] }); }
33
33
  }
34
34
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrBackButton, decorators: [{
35
35
  type: Component,
@@ -170,7 +170,7 @@ class ClrCollapseExpandSection {
170
170
  this.isCollapsed = !this.isCollapsed;
171
171
  }
172
172
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrCollapseExpandSection, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
173
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrCollapseExpandSection, selector: "clr-collapse-expand-section", inputs: { isCollapsed: ["clrIsCollapsed", "isCollapsed"], disableHeaderStyles: ["clrDisableHeaderStyles", "disableHeaderStyles"], disableSubtitle: ["clrDisableSubtitle", "disableSubtitle"] }, outputs: { collapsed: "clrCollapsed", expanded: "clrExpanded" }, ngImport: i0, template: "<div class=\"ces\">\n <div class=\"ces-title\" [class.disabled-header-styles]=\"disableHeaderStyles\">\n <h2 *ngIf=\"!disableHeaderStyles; else title\">\n <ng-container *ngTemplateOutlet=\"title\"></ng-container>\n </h2>\n <ng-template #title>\n <ng-content select=\"[clr-ces-title]\"></ng-content>\n <button type=\"button\" (click)=\"onCollapseExpand()\" class=\"btn btn-icon btn-link ces-caret-btn\">\n <cds-icon shape=\"angle\" direction=\"up\" size=\"28\" class=\"ces-caret-icon\" [@rotateIcon]=\"isCollapsed\"></cds-icon>\n </button>\n </ng-template>\n </div>\n <div class=\"ces-subtitle\" *ngIf=\"!disableSubtitle\">\n <h4 *ngIf=\"!disableHeaderStyles; else subtitle\">\n <ng-container *ngTemplateOutlet=\"subtitle\"></ng-container>\n </h4>\n <ng-template #subtitle>\n <ng-content select=\"[clr-ces-subtitle]\"></ng-content>\n </ng-template>\n </div>\n <div [@collapseExpandAnimation] *ngIf=\"!isCollapsed\">\n <ng-content select=\"[clr-ces-content]\"></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }], animations: [
173
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrCollapseExpandSection, selector: "clr-collapse-expand-section", inputs: { isCollapsed: ["clrIsCollapsed", "isCollapsed"], disableHeaderStyles: ["clrDisableHeaderStyles", "disableHeaderStyles"], disableSubtitle: ["clrDisableSubtitle", "disableSubtitle"] }, outputs: { collapsed: "clrCollapsed", expanded: "clrExpanded" }, ngImport: i0, template: "<div class=\"ces\">\n <div class=\"ces-title\" [class.disabled-header-styles]=\"disableHeaderStyles\">\n <h2 *ngIf=\"!disableHeaderStyles; else title\">\n <ng-container *ngTemplateOutlet=\"title\"></ng-container>\n </h2>\n <ng-template #title>\n <ng-content select=\"[clr-ces-title]\"></ng-content>\n <button type=\"button\" (click)=\"onCollapseExpand()\" class=\"btn btn-icon btn-link ces-caret-btn\">\n <cds-icon shape=\"angle\" direction=\"up\" size=\"28\" class=\"ces-caret-icon\" [@rotateIcon]=\"isCollapsed\"></cds-icon>\n </button>\n </ng-template>\n </div>\n <div class=\"ces-subtitle\" *ngIf=\"!disableSubtitle\">\n <h4 *ngIf=\"!disableHeaderStyles; else subtitle\">\n <ng-container *ngTemplateOutlet=\"subtitle\"></ng-container>\n </h4>\n <ng-template #subtitle>\n <ng-content select=\"[clr-ces-subtitle]\"></ng-content>\n </ng-template>\n </div>\n <div [@collapseExpandAnimation] *ngIf=\"!isCollapsed\">\n <ng-content select=\"[clr-ces-content]\"></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }], animations: [
174
174
  trigger('collapseExpandAnimation', [
175
175
  transition(':enter', [
176
176
  style({ opacity: 0, height: 0, overflow: 'hidden' }),
@@ -293,7 +293,7 @@ class ClrContentPanel {
293
293
  window.dispatchEvent(new Event('resize'));
294
294
  }
295
295
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrContentPanel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
296
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrContentPanel, selector: "clr-content-panel", outputs: { opened: "clrOpened", closed: "clrClosed" }, host: { properties: { "class.content-panel": "true" } }, ngImport: i0, template: "<ng-container *ngIf=\"_open\">\n <div [@slideIn] class=\"content-panel-content-wrapper\" (@slideIn.done)=\"resizeWindow()\">\n <h3 class=\"content-panel-title\">\n <button type=\"button\" class=\"close content-panel-close-btn\" (click)=\"close()\">\n <cds-icon class=\"content-panel-close-icon\" shape=\"times\" size=\"36\"></cds-icon>\n </button>\n <ng-content select=\"[clr-content-panel-title]\"></ng-content>\n </h3>\n <ng-content select=\"[clr-content-panel-content]\"></ng-content>\n </div>\n <div [@fade] class=\"content-panel-backdrop\" (click)=\"close()\" (@fade.done)=\"resizeWindow()\"></div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }], animations: [
296
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrContentPanel, selector: "clr-content-panel", outputs: { opened: "clrOpened", closed: "clrClosed" }, host: { properties: { "class.content-panel": "true" } }, ngImport: i0, template: "<ng-container *ngIf=\"_open\">\n <div [@slideIn] class=\"content-panel-content-wrapper\" (@slideIn.done)=\"resizeWindow()\">\n <h3 class=\"content-panel-title\">\n <button type=\"button\" class=\"close content-panel-close-btn\" (click)=\"close()\">\n <cds-icon class=\"content-panel-close-icon\" shape=\"times\" size=\"36\"></cds-icon>\n </button>\n <ng-content select=\"[clr-content-panel-title]\"></ng-content>\n </h3>\n <ng-content select=\"[clr-content-panel-content]\"></ng-content>\n </div>\n <div [@fade] class=\"content-panel-backdrop\" (click)=\"close()\" (@fade.done)=\"resizeWindow()\"></div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }], animations: [
297
297
  trigger('slideIn', [
298
298
  transition(':enter', [style({ opacity: 0, width: 0 }), animate('0.2s', style({ opacity: 1, width: '*' }))]),
299
299
  transition(':leave', [style({ opacity: 1, width: '*' }), animate('0.2s', style({ opacity: 0, width: 0 }))]),
@@ -652,7 +652,7 @@ class ClrDotPager {
652
652
  return Array(this._pages);
653
653
  }
654
654
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDotPager, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
655
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrDotPager, selector: "clr-dot-pager", inputs: { pages: ["clrPages", "pages"], currentPage: ["clrCurrentPage", "currentPage"] }, outputs: { currentPageChange: "clrCurrentPageChange" }, host: { properties: { "class.dot-pager": "true" } }, ngImport: i0, template: "<clr-radio-container *ngIf=\"pages > 0\" clrInline>\n <clr-radio-wrapper *ngFor=\"let a of pageArray(); let page = index\">\n <input clrRadio type=\"radio\" [value]=\"page+1\" [(ngModel)]=\"currentPage\" name=\"{{uniqueName}}\" />\n <label>&nbsp;</label>\n </clr-radio-wrapper>\n</clr-radio-container>\n", dependencies: [{ 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$1.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i1$1.ClrRadio, selector: "[clrRadio]" }, { kind: "component", type: i1$1.ClrRadioContainer, selector: "clr-radio-container", inputs: ["clrInline"] }, { kind: "component", type: i1$1.ClrRadioWrapper, selector: "clr-radio-wrapper" }, { kind: "directive", type: i3$1.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: i3$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
655
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrDotPager, selector: "clr-dot-pager", inputs: { pages: ["clrPages", "pages"], currentPage: ["clrCurrentPage", "currentPage"] }, outputs: { currentPageChange: "clrCurrentPageChange" }, host: { properties: { "class.dot-pager": "true" } }, ngImport: i0, template: "<clr-radio-container *ngIf=\"pages > 0\" clrInline>\n <clr-radio-wrapper *ngFor=\"let a of pageArray(); let page = index\">\n <input clrRadio type=\"radio\" [value]=\"page+1\" [(ngModel)]=\"currentPage\" name=\"{{uniqueName}}\" />\n <label>&nbsp;</label>\n </clr-radio-wrapper>\n</clr-radio-container>\n", dependencies: [{ 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.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i2.ClrRadio, selector: "[clrRadio]" }, { kind: "component", type: i2.ClrRadioContainer, selector: "clr-radio-container", inputs: ["clrInline"] }, { kind: "component", type: i2.ClrRadioWrapper, selector: "clr-radio-wrapper" }, { kind: "directive", type: i3$1.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: i3$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
656
656
  }
657
657
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDotPager, decorators: [{
658
658
  type: Component,
@@ -946,7 +946,7 @@ class ClrFlowBar {
946
946
  return this._steps.slice(index + 1, this._steps.length).find(step => step.enabled);
947
947
  }
948
948
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrFlowBar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
949
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrFlowBar, selector: "clr-flow-bar", inputs: { _steps: ["clrSteps", "_steps"], _activeStep: ["clrActiveStep", "_activeStep"] }, outputs: { _activeStepChange: "clrActiveStepChange" }, host: { properties: { "class.flow-bar": "true" } }, ngImport: i0, template: "<div class=\"flow-bar-wrapper\">\n <ng-container *ngFor=\"let step of _steps; let index = index; let last = last\">\n <div class=\"flow-bar-step\" [class.active]=\"step === _activeStep\">\n <button\n class=\"btn btn-link flow-bar-btn\"\n [disabled]=\"!step.enabled\"\n [class.active]=\"step === _activeStep\"\n (click)=\"changeActiveStep(step)\"\n >\n {{index + 1}}. {{(step.title | async)}}\n </button>\n <cds-icon shape=\"angle\" direction=\"right\" *ngIf=\"!last\"></cds-icon>\n </div>\n </ng-container>\n</div>\n<clr-dropdown class=\"flow-bar-dropdown clr-flex-fill\">\n <button type=\"button\" class=\"btn btn-outline-primary\" clrDropdownTrigger>\n {{_steps.indexOf(_activeStep) + 1}}. {{_activeStep?.title | async}}\n <cds-icon shape=\"angle\" direction=\"down\"></cds-icon>\n </button>\n <clr-dropdown-menu>\n <ng-container *ngFor=\"let step of _steps; let index = index; let last = last\">\n <button clrDropdownItem type=\"button\" class=\"btn\" [disabled]=\"!step.enabled\" (click)=\"changeActiveStep(step)\">\n {{index + 1}}. {{step.title | async}}\n </button>\n </ng-container>\n </clr-dropdown-menu>\n</clr-dropdown>\n", dependencies: [{ 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$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: i1$1.ClrDropdown, selector: "clr-dropdown", inputs: ["clrCloseMenuOnItemClick"] }, { kind: "component", type: i1$1.ClrDropdownMenu, selector: "clr-dropdown-menu", inputs: ["clrPosition"] }, { kind: "directive", type: i1$1.ClrDropdownTrigger, selector: "[clrDropdownTrigger],[clrDropdownToggle]" }, { kind: "directive", type: i1$1.ClrDropdownItem, selector: "[clrDropdownItem]", inputs: ["clrDisabled", "id"] }, { kind: "directive", type: ClrDropdownOverflowDirective, selector: "clr-dropdown-menu", inputs: ["clrDropdownMenuMaxHeight", "clrDropdownMenuItemMinHeight", "clrMarginBottom"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
949
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrFlowBar, selector: "clr-flow-bar", inputs: { _steps: ["clrSteps", "_steps"], _activeStep: ["clrActiveStep", "_activeStep"] }, outputs: { _activeStepChange: "clrActiveStepChange" }, host: { properties: { "class.flow-bar": "true" } }, ngImport: i0, template: "<div class=\"flow-bar-wrapper\">\n <ng-container *ngFor=\"let step of _steps; let index = index; let last = last\">\n <div class=\"flow-bar-step\" [class.active]=\"step === _activeStep\">\n <button\n class=\"btn btn-link flow-bar-btn\"\n [disabled]=\"!step.enabled\"\n [class.active]=\"step === _activeStep\"\n (click)=\"changeActiveStep(step)\"\n >\n {{index + 1}}. {{(step.title | async)}}\n </button>\n <cds-icon shape=\"angle\" direction=\"right\" *ngIf=\"!last\"></cds-icon>\n </div>\n </ng-container>\n</div>\n<clr-dropdown class=\"flow-bar-dropdown clr-flex-fill\">\n <button type=\"button\" class=\"btn btn-outline-primary\" clrDropdownTrigger>\n {{_steps.indexOf(_activeStep) + 1}}. {{_activeStep?.title | async}}\n <cds-icon shape=\"angle\" direction=\"down\"></cds-icon>\n </button>\n <clr-dropdown-menu>\n <ng-container *ngFor=\"let step of _steps; let index = index; let last = last\">\n <button clrDropdownItem type=\"button\" class=\"btn\" [disabled]=\"!step.enabled\" (click)=\"changeActiveStep(step)\">\n {{index + 1}}. {{step.title | async}}\n </button>\n </ng-container>\n </clr-dropdown-menu>\n</clr-dropdown>\n", dependencies: [{ 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.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: i2.ClrDropdown, selector: "clr-dropdown", inputs: ["clrCloseMenuOnItemClick"] }, { kind: "component", type: i2.ClrDropdownMenu, selector: "clr-dropdown-menu", inputs: ["clrPosition"] }, { kind: "directive", type: i2.ClrDropdownTrigger, selector: "[clrDropdownTrigger],[clrDropdownToggle]" }, { kind: "directive", type: i2.ClrDropdownItem, selector: "[clrDropdownItem]", inputs: ["clrDisabled", "id"] }, { kind: "directive", type: ClrDropdownOverflowDirective, selector: "clr-dropdown-menu", inputs: ["clrDropdownMenuMaxHeight", "clrDropdownMenuItemMinHeight", "clrMarginBottom"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
950
950
  }
951
951
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrFlowBar, decorators: [{
952
952
  type: Component,
@@ -1065,7 +1065,7 @@ class ClrGenericQuickList {
1065
1065
  clearTimeout(this.timeout);
1066
1066
  }
1067
1067
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrGenericQuickList, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1068
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrGenericQuickList, selector: "clr-generic-quick-list", inputs: { allItems: ["clrAllItems", "allItems"], addLabel: ["clrAddLabel", "addLabel"], addPossible: ["clrAddPossible", "addPossible"], blankItem: ["clrBlankItem", "blankItem"], controlClasses: ["clrControlClasses", "controlClasses"], required: ["clrMandatory", "required"], readonly: "readonly", compactMode: "compactMode" }, outputs: { added: "clrAdded", removed: "clrRemoved" }, host: { properties: { "class.generic-quick-list": "true", "class.clr-form-control": "true" } }, queries: [{ propertyName: "itemTemplate", predicate: TemplateRef }], viewQueries: [{ propertyName: "itemRows", predicate: ["row"], descendants: true }], ngImport: i0, template: "<ng-content select=\"label\"></ng-content>\n<div class=\"clr-control-container\" [ngClass]=\"controlClasses\">\n <ng-content select=\".header-container\"></ng-content>\n\n <ng-container *ngFor=\"let item of allItems; index as i\">\n <div class=\"controls-wrapper\">\n <div class=\"controls-container\" *ngIf=\"itemTemplate\" #row>\n <ng-container *ngTemplateOutlet=\"itemTemplate.get(0); context: {$implicit:item}\"></ng-container>\n </div>\n <button\n *ngIf=\"!(readonly || readonly === '')\"\n type=\"button\"\n class=\"btn btn-icon btn-link btn-trash\"\n [ngClass]=\"{'btn-trash-ext': !(compactMode && i === allItems.length - 1)}\"\n [disabled]=\"required && allItems.length === 1\"\n (click)=\"removeItem(item)\"\n >\n <cds-icon shape=\"trash\"></cds-icon>\n </button>\n <button\n *ngIf=\"!(readonly || readonly === '') && compactMode && i === allItems.length - 1\"\n type=\"button\"\n class=\"btn btn-icon btn-link quick-list-addcompact\"\n (click)=\"addItem()\"\n [disabled]=\"!addPossible\"\n >\n <cds-icon shape=\"plus-circle\"></cds-icon>\n </button>\n </div>\n </ng-container>\n <button\n *ngIf=\"!(readonly || readonly === '') && allItems.length === 0 && compactMode\"\n type=\"button\"\n class=\"btn btn-icon btn-link quick-list-addcompact\"\n (click)=\"addItem()\"\n [disabled]=\"!addPossible\"\n >\n <cds-icon shape=\"plus-circle\"></cds-icon>\n </button>\n <button\n *ngIf=\"!(readonly || readonly === '') && !compactMode\"\n type=\"button\"\n class=\"btn btn-link btn-sm btn-add\"\n (click)=\"addItem()\"\n [disabled]=\"!addPossible\"\n >\n {{addLabel}}\n </button>\n</div>\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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }] }); }
1068
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrGenericQuickList, selector: "clr-generic-quick-list", inputs: { allItems: ["clrAllItems", "allItems"], addLabel: ["clrAddLabel", "addLabel"], addPossible: ["clrAddPossible", "addPossible"], blankItem: ["clrBlankItem", "blankItem"], controlClasses: ["clrControlClasses", "controlClasses"], required: ["clrMandatory", "required"], readonly: "readonly", compactMode: "compactMode" }, outputs: { added: "clrAdded", removed: "clrRemoved" }, host: { properties: { "class.generic-quick-list": "true", "class.clr-form-control": "true" } }, queries: [{ propertyName: "itemTemplate", predicate: TemplateRef }], viewQueries: [{ propertyName: "itemRows", predicate: ["row"], descendants: true }], ngImport: i0, template: "<ng-content select=\"label\"></ng-content>\n<div class=\"clr-control-container\" [ngClass]=\"controlClasses\">\n <ng-content select=\".header-container\"></ng-content>\n\n <ng-container *ngFor=\"let item of allItems; index as i\">\n <div class=\"controls-wrapper\">\n <div class=\"controls-container\" *ngIf=\"itemTemplate\" #row>\n <ng-container *ngTemplateOutlet=\"itemTemplate.get(0); context: {$implicit:item}\"></ng-container>\n </div>\n <button\n *ngIf=\"!(readonly || readonly === '')\"\n type=\"button\"\n class=\"btn btn-icon btn-link btn-trash\"\n [ngClass]=\"{'btn-trash-ext': !(compactMode && i === allItems.length - 1)}\"\n [disabled]=\"required && allItems.length === 1\"\n (click)=\"removeItem(item)\"\n >\n <cds-icon shape=\"trash\"></cds-icon>\n </button>\n <button\n *ngIf=\"!(readonly || readonly === '') && compactMode && i === allItems.length - 1\"\n type=\"button\"\n class=\"btn btn-icon btn-link quick-list-addcompact\"\n (click)=\"addItem()\"\n [disabled]=\"!addPossible\"\n >\n <cds-icon shape=\"plus-circle\"></cds-icon>\n </button>\n </div>\n </ng-container>\n <button\n *ngIf=\"!(readonly || readonly === '') && allItems.length === 0 && compactMode\"\n type=\"button\"\n class=\"btn btn-icon btn-link quick-list-addcompact\"\n (click)=\"addItem()\"\n [disabled]=\"!addPossible\"\n >\n <cds-icon shape=\"plus-circle\"></cds-icon>\n </button>\n <button\n *ngIf=\"!(readonly || readonly === '') && !compactMode\"\n type=\"button\"\n class=\"btn btn-link btn-sm btn-add\"\n (click)=\"addItem()\"\n [disabled]=\"!addPossible\"\n >\n {{addLabel}}\n </button>\n</div>\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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }] }); }
1069
1069
  }
1070
1070
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrGenericQuickList, decorators: [{
1071
1071
  type: Component,
@@ -1368,7 +1368,7 @@ class ClrMainNavGroup {
1368
1368
  setTimeout(() => this.items.toArray()[this.currentFocusedId].focus());
1369
1369
  }
1370
1370
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrMainNavGroup, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
1371
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrMainNavGroup, selector: "clr-main-nav-group", inputs: { title: ["clrTitle", "title"] }, host: { properties: { "class.main-nav-group": "true" } }, queries: [{ propertyName: "items", predicate: ClrMainNavGroupItem }], ngImport: i0, template: "<section\n class=\"nav-link collapsible\"\n (click)=\"onClick($event)\"\n (keydown.enter)=\"onClick($event)\"\n (keydown.space)=\"onClick($event)\"\n [class.active]=\"isActive()\"\n tabindex=\"0\"\n>\n <input id=\"{{prefix}}{{id}}\" type=\"checkbox\" [checked]=\"isChecked()\" />\n <label class=\"nav-text nav-trigger\" for=\"{{prefix}}{{id}}\"\n >{{title}}\n <cds-icon shape=\"angle\" direction=\"down\"></cds-icon>\n </label>\n <div class=\"nav-list dropdown-menu\">\n <ng-content></ng-content>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i1$1.ClrLabel, selector: "label", inputs: ["for"] }] }); }
1371
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrMainNavGroup, selector: "clr-main-nav-group", inputs: { title: ["clrTitle", "title"] }, host: { properties: { "class.main-nav-group": "true" } }, queries: [{ propertyName: "items", predicate: ClrMainNavGroupItem }], ngImport: i0, template: "<section\n class=\"nav-link collapsible\"\n (click)=\"onClick($event)\"\n (keydown.enter)=\"onClick($event)\"\n (keydown.space)=\"onClick($event)\"\n [class.active]=\"isActive()\"\n tabindex=\"0\"\n>\n <input id=\"{{prefix}}{{id}}\" type=\"checkbox\" [checked]=\"isChecked()\" />\n <label class=\"nav-text nav-trigger\" for=\"{{prefix}}{{id}}\"\n >{{title}}\n <cds-icon shape=\"angle\" direction=\"down\"></cds-icon>\n </label>\n <div class=\"nav-list dropdown-menu\">\n <ng-content></ng-content>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }] }); }
1372
1372
  }
1373
1373
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrMainNavGroup, decorators: [{
1374
1374
  type: Component,
@@ -1791,7 +1791,7 @@ class ClrMultilingualSelector {
1791
1791
  </clr-dropdown-menu>
1792
1792
  </clr-dropdown>
1793
1793
  </div>
1794
- `, isInline: true, dependencies: [{ 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$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i1$1.ClrIfOpen, selector: "[clrIfOpen]", inputs: ["clrIfOpen"], outputs: ["clrIfOpenChange"] }, { kind: "component", type: i1$1.ClrDropdown, selector: "clr-dropdown", inputs: ["clrCloseMenuOnItemClick"] }, { kind: "component", type: i1$1.ClrDropdownMenu, selector: "clr-dropdown-menu", inputs: ["clrPosition"] }, { kind: "directive", type: i1$1.ClrDropdownTrigger, selector: "[clrDropdownTrigger],[clrDropdownToggle]" }, { kind: "directive", type: i1$1.ClrDropdownItem, selector: "[clrDropdownItem]", inputs: ["clrDisabled", "id"] }, { kind: "directive", type: ClrDropdownOverflowDirective, selector: "clr-dropdown-menu", inputs: ["clrDropdownMenuMaxHeight", "clrDropdownMenuItemMinHeight", "clrMarginBottom"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] }); }
1794
+ `, isInline: true, dependencies: [{ 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.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrIfOpen, selector: "[clrIfOpen]", inputs: ["clrIfOpen"], outputs: ["clrIfOpenChange"] }, { kind: "component", type: i2.ClrDropdown, selector: "clr-dropdown", inputs: ["clrCloseMenuOnItemClick"] }, { kind: "component", type: i2.ClrDropdownMenu, selector: "clr-dropdown-menu", inputs: ["clrPosition"] }, { kind: "directive", type: i2.ClrDropdownTrigger, selector: "[clrDropdownTrigger],[clrDropdownToggle]" }, { kind: "directive", type: i2.ClrDropdownItem, selector: "[clrDropdownItem]", inputs: ["clrDisabled", "id"] }, { kind: "directive", type: ClrDropdownOverflowDirective, selector: "clr-dropdown-menu", inputs: ["clrDropdownMenuMaxHeight", "clrDropdownMenuItemMinHeight", "clrMarginBottom"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] }); }
1795
1795
  }
1796
1796
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrMultilingualSelector, decorators: [{
1797
1797
  type: Component,
@@ -1854,7 +1854,7 @@ class ClrMultilingualInput extends ClrMultilingualAbstract {
1854
1854
  multi: true,
1855
1855
  },
1856
1856
  ControlIdService,
1857
- ], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"label\"></ng-content>\n<div class=\"clr-control-container\" [ngClass]=\"controlClasses\">\n <clr-multilingual-selector\n *ngIf=\"showLanguageSelector()\"\n [disabled]=\"disabled\"\n [texts]=\"shownTexts\"\n [selectedLang]=\"selectedLang\"\n (selectedLangChange)=\"changeLanguage($event)\"\n >\n </clr-multilingual-selector>\n <div class=\"clr-multi-input-wrapper\">\n <div class=\"clr-input-wrapper\">\n <input\n class=\"clr-input\"\n type=\"text\"\n [id]=\"inputId\"\n [ngModel]=\"!!shownTexts && !!selectedLang ? shownTexts.get(selectedLang) : ''\"\n (ngModelChange)=\"setText(selectedLang, $event)\"\n (blur)=\"onTouch()\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly || readonly === ''\"\n autocomplete=\"off\"\n [maxlength]=\"maxlength || null\"\n #input\n />\n <cds-icon *ngIf=\"showError\" class=\"clr-validate-icon\" shape=\"exclamation-circle\" aria-hidden=\"true\"></cds-icon>\n </div>\n <ng-content select=\"clr-control-helper\" *ngIf=\"!showError\"></ng-content>\n <ng-content select=\"clr-control-error\" *ngIf=\"showError\"></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i3$1.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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ClrMultilingualSelector, selector: "clr-multilingual-selector", inputs: ["disabled", "texts", "selectedLang"], outputs: ["selectedLangChange"] }] }); }
1857
+ ], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"label\"></ng-content>\n<div class=\"clr-control-container\" [ngClass]=\"controlClasses\">\n <clr-multilingual-selector\n *ngIf=\"showLanguageSelector()\"\n [disabled]=\"disabled\"\n [texts]=\"shownTexts\"\n [selectedLang]=\"selectedLang\"\n (selectedLangChange)=\"changeLanguage($event)\"\n >\n </clr-multilingual-selector>\n <div class=\"clr-multi-input-wrapper\">\n <div class=\"clr-input-wrapper\">\n <input\n class=\"clr-input\"\n type=\"text\"\n [id]=\"inputId\"\n [ngModel]=\"!!shownTexts && !!selectedLang ? shownTexts.get(selectedLang) : ''\"\n (ngModelChange)=\"setText(selectedLang, $event)\"\n (blur)=\"onTouch()\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly || readonly === ''\"\n autocomplete=\"off\"\n [maxlength]=\"maxlength || null\"\n #input\n />\n <cds-icon *ngIf=\"showError\" class=\"clr-validate-icon\" shape=\"exclamation-circle\" aria-hidden=\"true\"></cds-icon>\n </div>\n <ng-content select=\"clr-control-helper\" *ngIf=\"!showError\"></ng-content>\n <ng-content select=\"clr-control-error\" *ngIf=\"showError\"></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i3$1.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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ClrMultilingualSelector, selector: "clr-multilingual-selector", inputs: ["disabled", "texts", "selectedLang"], outputs: ["selectedLangChange"] }] }); }
1858
1858
  }
1859
1859
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrMultilingualInput, decorators: [{
1860
1860
  type: Component,
@@ -1886,7 +1886,7 @@ class ClrMultilingualTextarea extends ClrMultilingualAbstract {
1886
1886
  multi: true,
1887
1887
  },
1888
1888
  ControlIdService,
1889
- ], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"label\"></ng-content>\n<div class=\"clr-control-container\" [ngClass]=\"controlClasses\">\n <clr-multilingual-selector\n *ngIf=\"showLanguageSelector()\"\n [disabled]=\"disabled\"\n [texts]=\"shownTexts\"\n [selectedLang]=\"selectedLang\"\n (selectedLangChange)=\"changeLanguage($event)\"\n >\n </clr-multilingual-selector>\n <div class=\"clr-multi-input-wrapper\">\n <div class=\"clr-textarea-wrapper\">\n <textarea\n class=\"clr-textarea\"\n [id]=\"inputId\"\n [ngModel]=\"!!shownTexts && !!selectedLang ? shownTexts.get(selectedLang) : ''\"\n (ngModelChange)=\"setText(selectedLang, $event)\"\n (blur)=\"onTouch()\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly || readonly === ''\"\n [maxlength]=\"maxlength || null\"\n [rows]=\"rows || 1\"\n #input\n ></textarea>\n <cds-icon *ngIf=\"showError\" class=\"clr-validate-icon\" shape=\"exclamation-circle\" aria-hidden=\"true\"></cds-icon>\n </div>\n <ng-content select=\"clr-control-helper\" *ngIf=\"!showError\"></ng-content>\n <ng-content select=\"clr-control-error\" *ngIf=\"showError\"></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i3$1.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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ClrMultilingualSelector, selector: "clr-multilingual-selector", inputs: ["disabled", "texts", "selectedLang"], outputs: ["selectedLangChange"] }] }); }
1889
+ ], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"label\"></ng-content>\n<div class=\"clr-control-container\" [ngClass]=\"controlClasses\">\n <clr-multilingual-selector\n *ngIf=\"showLanguageSelector()\"\n [disabled]=\"disabled\"\n [texts]=\"shownTexts\"\n [selectedLang]=\"selectedLang\"\n (selectedLangChange)=\"changeLanguage($event)\"\n >\n </clr-multilingual-selector>\n <div class=\"clr-multi-input-wrapper\">\n <div class=\"clr-textarea-wrapper\">\n <textarea\n class=\"clr-textarea\"\n [id]=\"inputId\"\n [ngModel]=\"!!shownTexts && !!selectedLang ? shownTexts.get(selectedLang) : ''\"\n (ngModelChange)=\"setText(selectedLang, $event)\"\n (blur)=\"onTouch()\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly || readonly === ''\"\n [maxlength]=\"maxlength || null\"\n [rows]=\"rows || 1\"\n #input\n ></textarea>\n <cds-icon *ngIf=\"showError\" class=\"clr-validate-icon\" shape=\"exclamation-circle\" aria-hidden=\"true\"></cds-icon>\n </div>\n <ng-content select=\"clr-control-helper\" *ngIf=\"!showError\"></ng-content>\n <ng-content select=\"clr-control-error\" *ngIf=\"showError\"></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i3$1.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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ClrMultilingualSelector, selector: "clr-multilingual-selector", inputs: ["disabled", "texts", "selectedLang"], outputs: ["selectedLangChange"] }] }); }
1890
1890
  }
1891
1891
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrMultilingualTextarea, decorators: [{
1892
1892
  type: Component,
@@ -2126,7 +2126,7 @@ class ClrNotification {
2126
2126
  zonedTimer(300, this.ngZone).subscribe(() => (this.state = { value: 'currentPosition', params: { absolute: this._translate } }));
2127
2127
  }
2128
2128
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrNotification, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
2129
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrNotification, selector: "clr-notification", inputs: { timeout: "timeout", notificationType: "notificationType", dismissable: "dismissable", progressbar: "progressbar" }, outputs: { closed: "closed" }, host: { properties: { "class.notification": "true" } }, viewQueries: [{ propertyName: "clrAlert", first: true, predicate: ClrAlert, descendants: true, static: true }], ngImport: i0, template: "<div class=\"notification__wrapper\" [@slideDown] [@move]=\"state\" [@fade]=\"state\">\n <div class=\"progress top\" [ngClass]=\"notificationType\" *ngIf=\"progressbar && timeout > 0\">\n <progress class=\"progress\" [max]=\"timeout\" [value]=\"progressStatus\"></progress>\n </div>\n <clr-alert\n [clrAlertType]=\"notificationType\"\n [clrAlertAppLevel]=\"true\"\n [clrAlertClosable]=\"dismissable\"\n (clrAlertClosedChange)=\"close()\"\n >\n <div class=\"alert-item\">\n <span class=\"alert-text\">\n <ng-content select=\"[clr-notification-message]\"></ng-content>\n </span>\n </div>\n </clr-alert>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.ClrAlert, selector: "clr-alert", inputs: ["clrAlertSizeSmall", "clrAlertClosable", "clrAlertAppLevel", "clrCloseButtonAriaLabel", "clrAlertLightweight", "clrAlertType", "clrAlertIcon", "clrAlertClosed"], outputs: ["clrAlertClosedChange"] }, { kind: "directive", type: i1$1.ClrAlertText, selector: ".alert-text" }], animations: [
2129
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrNotification, selector: "clr-notification", inputs: { timeout: "timeout", notificationType: "notificationType", dismissable: "dismissable", progressbar: "progressbar" }, outputs: { closed: "closed" }, host: { properties: { "class.notification": "true" } }, viewQueries: [{ propertyName: "clrAlert", first: true, predicate: ClrAlert, descendants: true, static: true }], ngImport: i0, template: "<div class=\"notification__wrapper\" [@slideDown] [@move]=\"state\" [@fade]=\"state\">\n <div class=\"progress top\" [ngClass]=\"notificationType\" *ngIf=\"progressbar && timeout > 0\">\n <progress class=\"progress\" [max]=\"timeout\" [value]=\"progressStatus\"></progress>\n </div>\n <clr-alert\n [clrAlertType]=\"notificationType\"\n [clrAlertAppLevel]=\"true\"\n [clrAlertClosable]=\"dismissable\"\n (clrAlertClosedChange)=\"close()\"\n >\n <div class=\"alert-item\">\n <span class=\"alert-text\">\n <ng-content select=\"[clr-notification-message]\"></ng-content>\n </span>\n </div>\n </clr-alert>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ClrAlert, selector: "clr-alert", inputs: ["clrAlertSizeSmall", "clrAlertClosable", "clrAlertAppLevel", "clrCloseButtonAriaLabel", "clrAlertLightweight", "clrAlertType", "clrAlertIcon", "clrAlertClosed"], outputs: ["clrAlertClosedChange"] }, { kind: "directive", type: i2.ClrAlertText, selector: ".alert-text" }], animations: [
2130
2130
  trigger('slideDown', [
2131
2131
  transition(':enter', [
2132
2132
  style({ transform: 'translateY(-200%)' }),
@@ -2935,7 +2935,7 @@ class ClrPager {
2935
2935
  return middlePages;
2936
2936
  }
2937
2937
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrPager, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2938
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrPager, selector: "clr-pager", inputs: { pageSize: ["clrPageSize", "pageSize"], totalItems: ["clrTotalItems", "totalItems"], last: ["clrLast", "last"], page: ["clrPage", "page"] }, outputs: { pageChange: "clrPageChange" }, host: { properties: { "class.pager": "true" } }, ngImport: i0, template: "<div class=\"btn-group\" *ngIf=\"last > 1\">\n <button class=\"btn pagination-previous\" (click)=\"previous()\" [disabled]=\"page == 1\">\n <cds-icon shape=\"angle\" direction=\"left\"></cds-icon>\n </button>\n <button *ngIf=\"page > 2\" class=\"btn\" (click)=\"page = 1\">1</button>\n <button *ngIf=\"page > 3\" class=\"btn\" disabled>...</button>\n\n <ng-container *ngFor=\"let pageNum of middlePages\">\n <button *ngIf=\"pageNum !== page; else activePage\" class=\"btn\" (click)=\"page = pageNum\">{{pageNum}}</button>\n <ng-template #activePage>\n <button class=\"btn btn-primary\" type=\"button\">{{pageNum}}</button>\n </ng-template>\n </ng-container>\n\n <button *ngIf=\"page < last - 2\" class=\"btn\" disabled>...</button>\n <button *ngIf=\"page < last - 1\" class=\"btn\" (click)=\"page = last\">{{last}}</button>\n <button class=\"btn pagination-next\" (click)=\"next()\" [disabled]=\"page == last\">\n <cds-icon shape=\"angle\" direction=\"right\"></cds-icon>\n </button>\n</div>\n", dependencies: [{ 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$1.CdsIconCustomTag, selector: "cds-icon" }] }); }
2938
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrPager, selector: "clr-pager", inputs: { pageSize: ["clrPageSize", "pageSize"], totalItems: ["clrTotalItems", "totalItems"], last: ["clrLast", "last"], page: ["clrPage", "page"] }, outputs: { pageChange: "clrPageChange" }, host: { properties: { "class.pager": "true" } }, ngImport: i0, template: "<div class=\"btn-group\" *ngIf=\"last > 1\">\n <button class=\"btn pagination-previous\" (click)=\"previous()\" [disabled]=\"page == 1\">\n <cds-icon shape=\"angle\" direction=\"left\"></cds-icon>\n </button>\n <button *ngIf=\"page > 2\" class=\"btn\" (click)=\"page = 1\">1</button>\n <button *ngIf=\"page > 3\" class=\"btn\" disabled>...</button>\n\n <ng-container *ngFor=\"let pageNum of middlePages\">\n <button *ngIf=\"pageNum !== page; else activePage\" class=\"btn\" (click)=\"page = pageNum\">{{pageNum}}</button>\n <ng-template #activePage>\n <button class=\"btn btn-primary\" type=\"button\">{{pageNum}}</button>\n </ng-template>\n </ng-container>\n\n <button *ngIf=\"page < last - 2\" class=\"btn\" disabled>...</button>\n <button *ngIf=\"page < last - 1\" class=\"btn\" (click)=\"page = last\">{{last}}</button>\n <button class=\"btn pagination-next\" (click)=\"next()\" [disabled]=\"page == last\">\n <cds-icon shape=\"angle\" direction=\"right\"></cds-icon>\n </button>\n</div>\n", dependencies: [{ 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.CdsIconCustomTag, selector: "cds-icon" }] }); }
2939
2939
  }
2940
2940
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrPager, decorators: [{
2941
2941
  type: Component,
@@ -2982,7 +2982,7 @@ class ClrPagedSearchResultList {
2982
2982
  this.pageSizeChange = new EventEmitter();
2983
2983
  }
2984
2984
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrPagedSearchResultList, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2985
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrPagedSearchResultList, selector: "clr-paged-search-result-list", inputs: { pageSize: ["clrPageSize", "pageSize"], pageSizeOptions: ["clrPageSizeOptions", "pageSizeOptions"], pageSizeLabel: ["clrPageSizeLabel", "pageSizeLabel"], currentPage: ["clrPage", "currentPage"], totalItems: ["clrTotalItems", "totalItems"], items: ["clrItems", "items"], clrPagerPosition: "clrPagerPosition" }, outputs: { pageChange: "clrPageChange", pageSizeChange: "clrPageSizeChange" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: "<div *ngIf=\"clrPagerPosition === 'top' || clrPagerPosition === 'both'\">\n <ng-container [ngTemplateOutlet]=\"pager\" [ngTemplateOutletContext]=\"{ $implicit: 'top' }\"> </ng-container>\n</div>\n<ng-container *ngFor=\"let item of items\" [ngTemplateOutlet]=\"itemTemplate\" [ngTemplateOutletContext]=\"{item: item}\">\n <div *ngIf=\"!itemTemplate\">Item template input is undefined!</div>\n</ng-container>\n<div *ngIf=\"clrPagerPosition === 'bottom' || clrPagerPosition === 'both'\">\n <ng-container [ngTemplateOutlet]=\"pager\" [ngTemplateOutletContext]=\"{ $implicit: 'bottom' }\"> </ng-container>\n</div>\n<ng-template #pager let-position>\n <div class=\"clr-row\">\n <div [class.pager-top]=\"position === 'top'\" [class.pager-bottom]=\"position === 'bottom'\">\n <ng-container *ngTemplateOutlet=\"pageSizeDropdown\"></ng-container>\n <clr-pager\n [clrPage]=\"currentPage\"\n [clrPageSize]=\"pageSize\"\n [clrTotalItems]=\"totalItems\"\n (clrPageChange)=\"pageChange.emit($event)\"\n ></clr-pager>\n </div>\n </div>\n</ng-template>\n<ng-template #pageSizeDropdown>\n <div *ngIf=\"pageSizeOptions?.length > 1\">\n <clr-dropdown>\n <button type=\"button\" class=\"btn btn-link options-text-button btn-no-capitalized\" clrDropdownTrigger>\n {{pageSizeLabel}}: {{pageSize}}\n <cds-icon shape=\"angle\" direction=\"down\"></cds-icon>\n </button>\n <button type=\"button\" class=\"btn btn-link options-icon-button\" clrDropdownTrigger>\n <cds-icon shape=\"cog\"></cds-icon>\n <cds-icon shape=\"angle\" direction=\"down\"></cds-icon>\n </button>\n <clr-dropdown-menu class=\"spinner-in-front\" clrPosition=\"top-right\">\n <ng-container *ngFor=\"let sizeOption of pageSizeOptions\">\n <button type=\"button\" clrDropdownItem (click)=\"pageSizeChange.emit(sizeOption)\">{{sizeOption}}</button>\n </ng-container>\n </clr-dropdown-menu>\n </clr-dropdown>\n </div>\n</ng-template>\n", dependencies: [{ 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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: i1$1.ClrDropdown, selector: "clr-dropdown", inputs: ["clrCloseMenuOnItemClick"] }, { kind: "component", type: i1$1.ClrDropdownMenu, selector: "clr-dropdown-menu", inputs: ["clrPosition"] }, { kind: "directive", type: i1$1.ClrDropdownTrigger, selector: "[clrDropdownTrigger],[clrDropdownToggle]" }, { kind: "directive", type: i1$1.ClrDropdownItem, selector: "[clrDropdownItem]", inputs: ["clrDisabled", "id"] }, { kind: "component", type: ClrPager, selector: "clr-pager", inputs: ["clrPageSize", "clrTotalItems", "clrLast", "clrPage"], outputs: ["clrPageChange"] }] }); }
2985
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrPagedSearchResultList, selector: "clr-paged-search-result-list", inputs: { pageSize: ["clrPageSize", "pageSize"], pageSizeOptions: ["clrPageSizeOptions", "pageSizeOptions"], pageSizeLabel: ["clrPageSizeLabel", "pageSizeLabel"], currentPage: ["clrPage", "currentPage"], totalItems: ["clrTotalItems", "totalItems"], items: ["clrItems", "items"], clrPagerPosition: "clrPagerPosition" }, outputs: { pageChange: "clrPageChange", pageSizeChange: "clrPageSizeChange" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: "<div *ngIf=\"clrPagerPosition === 'top' || clrPagerPosition === 'both'\">\n <ng-container [ngTemplateOutlet]=\"pager\" [ngTemplateOutletContext]=\"{ $implicit: 'top' }\"> </ng-container>\n</div>\n<ng-container *ngFor=\"let item of items\" [ngTemplateOutlet]=\"itemTemplate\" [ngTemplateOutletContext]=\"{item: item}\">\n <div *ngIf=\"!itemTemplate\">Item template input is undefined!</div>\n</ng-container>\n<div *ngIf=\"clrPagerPosition === 'bottom' || clrPagerPosition === 'both'\">\n <ng-container [ngTemplateOutlet]=\"pager\" [ngTemplateOutletContext]=\"{ $implicit: 'bottom' }\"> </ng-container>\n</div>\n<ng-template #pager let-position>\n <div class=\"clr-row\">\n <div [class.pager-top]=\"position === 'top'\" [class.pager-bottom]=\"position === 'bottom'\">\n <ng-container *ngTemplateOutlet=\"pageSizeDropdown\"></ng-container>\n <clr-pager\n [clrPage]=\"currentPage\"\n [clrPageSize]=\"pageSize\"\n [clrTotalItems]=\"totalItems\"\n (clrPageChange)=\"pageChange.emit($event)\"\n ></clr-pager>\n </div>\n </div>\n</ng-template>\n<ng-template #pageSizeDropdown>\n <div *ngIf=\"pageSizeOptions?.length > 1\">\n <clr-dropdown>\n <button type=\"button\" class=\"btn btn-link options-text-button btn-no-capitalized\" clrDropdownTrigger>\n {{pageSizeLabel}}: {{pageSize}}\n <cds-icon shape=\"angle\" direction=\"down\"></cds-icon>\n </button>\n <button type=\"button\" class=\"btn btn-link options-icon-button\" clrDropdownTrigger>\n <cds-icon shape=\"cog\"></cds-icon>\n <cds-icon shape=\"angle\" direction=\"down\"></cds-icon>\n </button>\n <clr-dropdown-menu class=\"spinner-in-front\" clrPosition=\"top-right\">\n <ng-container *ngFor=\"let sizeOption of pageSizeOptions\">\n <button type=\"button\" clrDropdownItem (click)=\"pageSizeChange.emit(sizeOption)\">{{sizeOption}}</button>\n </ng-container>\n </clr-dropdown-menu>\n </clr-dropdown>\n </div>\n</ng-template>\n", dependencies: [{ 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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: i2.ClrDropdown, selector: "clr-dropdown", inputs: ["clrCloseMenuOnItemClick"] }, { kind: "component", type: i2.ClrDropdownMenu, selector: "clr-dropdown-menu", inputs: ["clrPosition"] }, { kind: "directive", type: i2.ClrDropdownTrigger, selector: "[clrDropdownTrigger],[clrDropdownToggle]" }, { kind: "directive", type: i2.ClrDropdownItem, selector: "[clrDropdownItem]", inputs: ["clrDisabled", "id"] }, { kind: "component", type: ClrPager, selector: "clr-pager", inputs: ["clrPageSize", "clrTotalItems", "clrLast", "clrPage"], outputs: ["clrPageChange"] }] }); }
2986
2986
  }
2987
2987
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrPagedSearchResultList, decorators: [{
2988
2988
  type: Component,
@@ -3212,7 +3212,7 @@ class ClrAddOption {
3212
3212
  !!this.select && this.select.nativeElement.focus();
3213
3213
  }
3214
3214
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAddOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3215
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrAddOption, selector: "clr-add-option", inputs: { blankOption: "blankOption", value: "value", mandatory: "mandatory", allValues: "allValues", excludedValues: "excludedValues", readonly: "readonly", disabled: "disabled", disableAddButton: "disableAddButton", showAddButton: "showAddButton" }, outputs: { valueChanged: "valueChanged", remove: "remove", add: "add" }, host: { properties: { "class.quick-list-option": "true" } }, viewQueries: [{ propertyName: "select", first: true, predicate: ["select"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"!(readonly || readonly === ''); else readonlyView\" class=\"clr-select-wrapper quick-list-input\">\n <select #select clr-select class=\"quick-list-select\" name=\"options\" [(ngModel)]=\"selectedValue\" [disabled]=\"disabled\">\n <option *ngIf=\"blankOption.id === selectedValue\" [selected]=\"true\" [disabled]=\"true\" [ngValue]=\"blankOption.id\">\n {{blankOption.label}}\n </option>\n <option *ngFor=\"let val of getValues()\" [selected]=\"val.id === selectedValue\" [ngValue]=\"val.id\">\n {{val.label}}\n </option>\n </select>\n</div>\n\n<ng-template #readonlyView>\n <span>{{value.label}}</span>\n</ng-template>\n\n<button\n *ngIf=\"!(readonly || readonly === '')\"\n type=\"button\"\n class=\"btn btn-icon btn-link quick-list-trash\"\n [ngClass]=\"{'quick-list-trash-ext': !showAddButton}\"\n [disabled]=\"trashDisabled() || disabled\"\n (click)=\"remove.emit()\"\n>\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<button\n *ngIf=\"!(readonly || readonly === '') && showAddButton\"\n type=\"button\"\n class=\"btn btn-icon btn-link quick-list-addcompact\"\n (click)=\"add.emit()\"\n [disabled]=\"disableAddButton\"\n>\n <cds-icon shape=\"plus-circle\"></cds-icon>\n</button>\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: i3$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }] }); }
3215
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrAddOption, selector: "clr-add-option", inputs: { blankOption: "blankOption", value: "value", mandatory: "mandatory", allValues: "allValues", excludedValues: "excludedValues", readonly: "readonly", disabled: "disabled", disableAddButton: "disableAddButton", showAddButton: "showAddButton" }, outputs: { valueChanged: "valueChanged", remove: "remove", add: "add" }, host: { properties: { "class.quick-list-option": "true" } }, viewQueries: [{ propertyName: "select", first: true, predicate: ["select"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"!(readonly || readonly === ''); else readonlyView\" class=\"clr-select-wrapper quick-list-input\">\n <select #select clr-select class=\"quick-list-select\" name=\"options\" [(ngModel)]=\"selectedValue\" [disabled]=\"disabled\">\n <option *ngIf=\"blankOption.id === selectedValue\" [selected]=\"true\" [disabled]=\"true\" [ngValue]=\"blankOption.id\">\n {{blankOption.label}}\n </option>\n <option *ngFor=\"let val of getValues()\" [selected]=\"val.id === selectedValue\" [ngValue]=\"val.id\">\n {{val.label}}\n </option>\n </select>\n</div>\n\n<ng-template #readonlyView>\n <span>{{value.label}}</span>\n</ng-template>\n\n<button\n *ngIf=\"!(readonly || readonly === '')\"\n type=\"button\"\n class=\"btn btn-icon btn-link quick-list-trash\"\n [ngClass]=\"{'quick-list-trash-ext': !showAddButton}\"\n [disabled]=\"trashDisabled() || disabled\"\n (click)=\"remove.emit()\"\n>\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<button\n *ngIf=\"!(readonly || readonly === '') && showAddButton\"\n type=\"button\"\n class=\"btn btn-icon btn-link quick-list-addcompact\"\n (click)=\"add.emit()\"\n [disabled]=\"disableAddButton\"\n>\n <cds-icon shape=\"plus-circle\"></cds-icon>\n</button>\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: i3$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }] }); }
3216
3216
  }
3217
3217
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAddOption, decorators: [{
3218
3218
  type: Component,
@@ -3320,7 +3320,7 @@ class ClrQuickList extends ClrAbstractFormComponent {
3320
3320
  useExisting: forwardRef(() => ClrQuickList),
3321
3321
  multi: true,
3322
3322
  },
3323
- ], viewQueries: [{ propertyName: "options", predicate: ClrAddOption, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"label\"></ng-content>\n<div class=\"clr-control-container\" [ngClass]=\"controlClasses\">\n <ng-container *ngFor=\"let value of values; index as i\">\n <clr-add-option\n [allValues]=\"allValues\"\n [excludedValues]=\"values\"\n (remove)=\"onRemoveValue(i)\"\n (add)=\"addBlankOption()\"\n [value]=\"value\"\n (valueChanged)=\"onValueChanged($event, i)\"\n [blankOption]=\"blankOption\"\n [mandatory]=\"mandatory\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [disableAddButton]=\"addNotPossible() || disabled\"\n [showAddButton]=\"compactMode && i === values.length - 1\"\n >\n </clr-add-option>\n </ng-container>\n <button\n *ngIf=\"!(readonly || readonly === '') && values.length === 0 && compactMode\"\n type=\"button\"\n class=\"btn btn-icon btn-link quick-list-addcompact\"\n (click)=\"addBlankOption()\"\n [disabled]=\"addNotPossible() || disabled\"\n >\n <cds-icon shape=\"plus-circle\"></cds-icon>\n </button>\n <button\n *ngIf=\"!(readonly || readonly === '') && !compactMode\"\n type=\"button\"\n class=\"btn btn-link btn-sm quick-list-add\"\n (click)=\"addBlankOption()\"\n [disabled]=\"addNotPossible() || disabled\"\n >\n {{addLabel}}\n </button>\n</div>\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$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: ClrAddOption, selector: "clr-add-option", inputs: ["blankOption", "value", "mandatory", "allValues", "excludedValues", "readonly", "disabled", "disableAddButton", "showAddButton"], outputs: ["valueChanged", "remove", "add"] }] }); }
3323
+ ], viewQueries: [{ propertyName: "options", predicate: ClrAddOption, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"label\"></ng-content>\n<div class=\"clr-control-container\" [ngClass]=\"controlClasses\">\n <ng-container *ngFor=\"let value of values; index as i\">\n <clr-add-option\n [allValues]=\"allValues\"\n [excludedValues]=\"values\"\n (remove)=\"onRemoveValue(i)\"\n (add)=\"addBlankOption()\"\n [value]=\"value\"\n (valueChanged)=\"onValueChanged($event, i)\"\n [blankOption]=\"blankOption\"\n [mandatory]=\"mandatory\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [disableAddButton]=\"addNotPossible() || disabled\"\n [showAddButton]=\"compactMode && i === values.length - 1\"\n >\n </clr-add-option>\n </ng-container>\n <button\n *ngIf=\"!(readonly || readonly === '') && values.length === 0 && compactMode\"\n type=\"button\"\n class=\"btn btn-icon btn-link quick-list-addcompact\"\n (click)=\"addBlankOption()\"\n [disabled]=\"addNotPossible() || disabled\"\n >\n <cds-icon shape=\"plus-circle\"></cds-icon>\n </button>\n <button\n *ngIf=\"!(readonly || readonly === '') && !compactMode\"\n type=\"button\"\n class=\"btn btn-link btn-sm quick-list-add\"\n (click)=\"addBlankOption()\"\n [disabled]=\"addNotPossible() || disabled\"\n >\n {{addLabel}}\n </button>\n</div>\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.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: ClrAddOption, selector: "clr-add-option", inputs: ["blankOption", "value", "mandatory", "allValues", "excludedValues", "readonly", "disabled", "disableAddButton", "showAddButton"], outputs: ["valueChanged", "remove", "add"] }] }); }
3324
3324
  }
3325
3325
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrQuickList, decorators: [{
3326
3326
  type: Component,
@@ -3571,7 +3571,7 @@ class ClrTreetableActionOverflow {
3571
3571
  this.destroyed$.next();
3572
3572
  this.destroyed$.complete();
3573
3573
  }
3574
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrTreetableActionOverflow, deps: [{ token: i1$1.ClrPopoverToggleService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
3574
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrTreetableActionOverflow, deps: [{ token: i2.ClrPopoverToggleService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
3575
3575
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrTreetableActionOverflow, selector: "clr-tt-action-overflow", inputs: { empty: "empty" }, host: { attributes: { "role": "cell" }, properties: { "class.treetable-row-actions": "true", "class.treetable-cell": "true" } }, providers: [ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService], ngImport: i0, template: `
3576
3576
  <ng-container *ngIf="!empty">
3577
3577
  <button class="treetable-action-trigger" clrPopoverAnchor clrPopoverOpenCloseButton>
@@ -3586,7 +3586,7 @@ class ClrTreetableActionOverflow {
3586
3586
  <ng-content></ng-content>
3587
3587
  </div>
3588
3588
  </ng-container>
3589
- `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i1$1.ClrPopoverAnchor, selector: "[clrPopoverAnchor]" }, { kind: "directive", type: i1$1.ÇlrClrPopoverOpenCloseButton, selector: "[clrPopoverOpenCloseButton]", outputs: ["clrPopoverOpenCloseChange"] }, { kind: "directive", type: i1$1.ClrPopoverContent, selector: "[clrPopoverContent]", inputs: ["clrPopoverContent", "clrPopoverContentAt", "clrPopoverContentOutsideClickToClose", "clrPopoverContentScrollToClose"] }] }); }
3589
+ `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrPopoverAnchor, selector: "[clrPopoverAnchor]" }, { kind: "directive", type: i2.ÇlrClrPopoverOpenCloseButton, selector: "[clrPopoverOpenCloseButton]", outputs: ["clrPopoverOpenCloseChange"] }, { kind: "directive", type: i2.ClrPopoverContent, selector: "[clrPopoverContent]", inputs: ["clrPopoverContent", "clrPopoverContentAt", "clrPopoverContentOutsideClickToClose", "clrPopoverContentScrollToClose"] }] }); }
3590
3590
  }
3591
3591
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrTreetableActionOverflow, decorators: [{
3592
3592
  type: Component,
@@ -3614,7 +3614,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
3614
3614
  role: 'cell',
3615
3615
  },
3616
3616
  }]
3617
- }], ctorParameters: () => [{ type: i1$1.ClrPopoverToggleService }, { type: i0.NgZone }], propDecorators: { empty: [{
3617
+ }], ctorParameters: () => [{ type: i2.ClrPopoverToggleService }, { type: i0.NgZone }], propDecorators: { empty: [{
3618
3618
  type: Input
3619
3619
  }] } });
3620
3620
 
@@ -3660,7 +3660,7 @@ class ClrTreetableRow {
3660
3660
  }
3661
3661
  }
3662
3662
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrTreetableRow, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3663
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrTreetableRow, selector: "clr-tt-row", inputs: { expanded: ["clrExpanded", "expanded"], clickable: ["clrClickable", "clickable"], expandable: ["clrExpandable", "expandable"] }, outputs: { hasActionOverflow: "hasActionOverflow", expandedChange: "clrExpandedChange" }, host: { properties: { "class.treetable-row-wrapper": "true" } }, queries: [{ propertyName: "actionOverflow", first: true, predicate: ClrTreetableActionOverflow, descendants: true }], ngImport: i0, template: "<!--\n ~ Copyright (c) 2018-2024 Porsche Informatik. All Rights Reserved.\n ~ This software is released under MIT license.\n ~ The full license information can be found in LICENSE in the root directory of this project.\n -->\n\n<div\n [ngClass]=\"{'clr-row-clickable': showClickClass}\"\n class=\"clr-tt-node-content treetable-row\"\n (click)=\"onRowClick($event)\"\n>\n <ng-content select=\"clr-tt-action-overflow\"></ng-content>\n <clr-tt-action-overflow *ngIf=\"showActionOverflow && showEmptyActionOverflow\" [empty]=\"true\"></clr-tt-action-overflow>\n <div class=\"treetable-scrolling-cells\">\n <div class=\"treetable-expandable-caret\" *ngIf=\"expandable\">\n <button type=\"button\" class=\"treetable-expandable-caret-button\" (click)=\"onCaretClick()\">\n <cds-icon\n shape=\"angle\"\n [attr.direction]=\"expanded ? 'down' : 'right'\"\n class=\"treetable-expandable-caret-icon\"\n ></cds-icon>\n </button>\n </div>\n\n <ng-content select=\"clr-tt-cell\"></ng-content>\n </div>\n</div>\n<div [@collapseExpandAnimation]=\"expanded\">\n <ng-content select=\"clr-tt-row\"></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: ClrTreetableActionOverflow, selector: "clr-tt-action-overflow", inputs: ["empty"] }], animations: [
3663
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrTreetableRow, selector: "clr-tt-row", inputs: { expanded: ["clrExpanded", "expanded"], clickable: ["clrClickable", "clickable"], expandable: ["clrExpandable", "expandable"] }, outputs: { hasActionOverflow: "hasActionOverflow", expandedChange: "clrExpandedChange" }, host: { properties: { "class.treetable-row-wrapper": "true" } }, queries: [{ propertyName: "actionOverflow", first: true, predicate: ClrTreetableActionOverflow, descendants: true }], ngImport: i0, template: "<!--\n ~ Copyright (c) 2018-2024 Porsche Informatik. All Rights Reserved.\n ~ This software is released under MIT license.\n ~ The full license information can be found in LICENSE in the root directory of this project.\n -->\n\n<div\n [ngClass]=\"{'clr-row-clickable': showClickClass}\"\n class=\"clr-tt-node-content treetable-row\"\n (click)=\"onRowClick($event)\"\n>\n <ng-content select=\"clr-tt-action-overflow\"></ng-content>\n <clr-tt-action-overflow *ngIf=\"showActionOverflow && showEmptyActionOverflow\" [empty]=\"true\"></clr-tt-action-overflow>\n <div class=\"treetable-scrolling-cells\">\n <div class=\"treetable-expandable-caret\" *ngIf=\"expandable\">\n <button type=\"button\" class=\"treetable-expandable-caret-button\" (click)=\"onCaretClick()\">\n <cds-icon\n shape=\"angle\"\n [attr.direction]=\"expanded ? 'down' : 'right'\"\n class=\"treetable-expandable-caret-icon\"\n ></cds-icon>\n </button>\n </div>\n\n <ng-content select=\"clr-tt-cell\"></ng-content>\n </div>\n</div>\n<div [@collapseExpandAnimation]=\"expanded\">\n <ng-content select=\"clr-tt-row\"></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: ClrTreetableActionOverflow, selector: "clr-tt-action-overflow", inputs: ["empty"] }], animations: [
3664
3664
  trigger('collapseExpandAnimation', [
3665
3665
  state('false', style({ display: 'none' })),
3666
3666
  state('true', style({ display: 'block' })),
@@ -4127,7 +4127,7 @@ class ClrViewEditSection {
4127
4127
  }
4128
4128
  }
4129
4129
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrViewEditSection, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4130
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrViewEditSection, selector: "clr-view-edit-section", inputs: { _title: ["clrTitle", "_title"], _saveText: ["clrSaveText", "_saveText"], _preventSave: ["clrPreventModeChangeOnSave", "_preventSave"], _cancelText: ["clrCancelText", "_cancelText"], _editable: ["clrEditable", "_editable"], _editIcon: ["clrEditIcon", "_editIcon"], _isCollapsible: ["clrIsCollapsible", "_isCollapsible"], _isCollapsed: ["clrIsCollapsed", "_isCollapsed"], viewRef: ["clrViewRef", "viewRef"], editRef: ["clrEditRef", "editRef"], editMode: ["clrEditMode", "editMode"] }, outputs: { _isCollapsedChange: "clrIsCollapsedChange", _editModeChanged: "clrEditModeChange", _submitted: "clrSectionSubmitted", _cancelled: "clrSectionEditCancelled" }, ngImport: i0, template: "<div class=\"card view-edit-section\" (keyup.escape)=\"onCancel()\">\n <div class=\"card-block\">\n <div class=\"card-title\">\n {{_title}}\n <button\n type=\"button\"\n (click)=\"onCollapseExpand()\"\n class=\"btn btn-icon btn-link ces-caret-btn\"\n *ngIf=\"_isCollapsible && !editMode\"\n >\n <cds-icon shape=\"angle\" direction=\"up\" size=\"20\" class=\"ces-caret-icon\" [@rotateIcon]=\"_isCollapsed\"></cds-icon>\n </button>\n <div class=\"ves-actions\">\n <button\n type=\"button\"\n (click)=\"onEdit()\"\n class=\"btn btn-icon btn-link ves-action\"\n *ngIf=\"_editable && !editMode && actionBlock.children.length == 0\"\n >\n <cds-icon class=\"ves-edit-icon\" [attr.shape]=\"_editIcon\" size=\"20\"></cds-icon>\n </button>\n <div #actionBlock>\n <ng-content select=\"[action-block]\"></ng-content>\n </div>\n </div>\n </div>\n <div class=\"card-text\" [@collapseExpandAnimation] *ngIf=\"!(_isCollapsed && _isCollapsible)\">\n <ng-template [ngTemplateOutlet]=\"viewRef\" *ngIf=\"!editMode\"></ng-template>\n <ng-template [ngTemplateOutlet]=\"editRef\" *ngIf=\"editMode\"></ng-template>\n <ng-container *ngIf=\"editMode\">\n <form clrForm (ngSubmit)=\"onSubmit()\" class=\"button-bar\">\n <button class=\"btn btn-primary ves-save\" type=\"submit\">{{_saveText}}</button>\n <button class=\"btn ves-cancel\" (click)=\"onCancel()\" type=\"button\">{{_cancelText}}</button>\n </form>\n </ng-container>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i1$1.ClrForm, selector: "[clrForm]", inputs: ["clrLabelSize"] }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], animations: [
4130
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrViewEditSection, selector: "clr-view-edit-section", inputs: { _title: ["clrTitle", "_title"], _saveText: ["clrSaveText", "_saveText"], _preventSave: ["clrPreventModeChangeOnSave", "_preventSave"], _cancelText: ["clrCancelText", "_cancelText"], _editable: ["clrEditable", "_editable"], _editIcon: ["clrEditIcon", "_editIcon"], _isCollapsible: ["clrIsCollapsible", "_isCollapsible"], _isCollapsed: ["clrIsCollapsed", "_isCollapsed"], viewRef: ["clrViewRef", "viewRef"], editRef: ["clrEditRef", "editRef"], editMode: ["clrEditMode", "editMode"] }, outputs: { _isCollapsedChange: "clrIsCollapsedChange", _editModeChanged: "clrEditModeChange", _submitted: "clrSectionSubmitted", _cancelled: "clrSectionEditCancelled" }, ngImport: i0, template: "<div class=\"card view-edit-section\" (keyup.escape)=\"onCancel()\">\n <div class=\"card-block\">\n <div class=\"card-title\">\n {{_title}}\n <button\n type=\"button\"\n (click)=\"onCollapseExpand()\"\n class=\"btn btn-icon btn-link ces-caret-btn\"\n *ngIf=\"_isCollapsible && !editMode\"\n >\n <cds-icon shape=\"angle\" direction=\"up\" size=\"20\" class=\"ces-caret-icon\" [@rotateIcon]=\"_isCollapsed\"></cds-icon>\n </button>\n <div class=\"ves-actions\">\n <button\n type=\"button\"\n (click)=\"onEdit()\"\n class=\"btn btn-icon btn-link ves-action\"\n *ngIf=\"_editable && !editMode && actionBlock.children.length == 0\"\n >\n <cds-icon class=\"ves-edit-icon\" [attr.shape]=\"_editIcon\" size=\"20\"></cds-icon>\n </button>\n <div #actionBlock>\n <ng-content select=\"[action-block]\"></ng-content>\n </div>\n </div>\n </div>\n <div class=\"card-text\" [@collapseExpandAnimation] *ngIf=\"!(_isCollapsed && _isCollapsible)\">\n <ng-template [ngTemplateOutlet]=\"viewRef\" *ngIf=\"!editMode\"></ng-template>\n <ng-template [ngTemplateOutlet]=\"editRef\" *ngIf=\"editMode\"></ng-template>\n <ng-container *ngIf=\"editMode\">\n <form clrForm (ngSubmit)=\"onSubmit()\" class=\"button-bar\">\n <button class=\"btn btn-primary ves-save\" type=\"submit\">{{_saveText}}</button>\n <button class=\"btn ves-cancel\" (click)=\"onCancel()\" type=\"button\">{{_cancelText}}</button>\n </form>\n </ng-container>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrForm, selector: "[clrForm]", inputs: ["clrLabelSize"] }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], animations: [
4131
4131
  trigger('collapseExpandAnimation', [
4132
4132
  transition(':enter', [
4133
4133
  style({ opacity: 0, height: 0, overflow: 'hidden' }),
@@ -4461,7 +4461,7 @@ class ClrHistoryService {
4461
4461
  };
4462
4462
  this.httpClient.post(this.historyNotificationUrl, body).subscribe();
4463
4463
  }
4464
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrHistoryService, deps: [{ token: HISTORY_NOTIFICATION_URL_PROVIDER, optional: true }, { token: i1$2.HttpClient, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
4464
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrHistoryService, deps: [{ token: HISTORY_NOTIFICATION_URL_PROVIDER, optional: true }, { token: i1$1.HttpClient, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
4465
4465
  static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrHistoryService }); }
4466
4466
  }
4467
4467
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrHistoryService, decorators: [{
@@ -4471,7 +4471,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
4471
4471
  args: [HISTORY_NOTIFICATION_URL_PROVIDER]
4472
4472
  }, {
4473
4473
  type: Optional
4474
- }] }, { type: i1$2.HttpClient, decorators: [{
4474
+ }] }, { type: i1$1.HttpClient, decorators: [{
4475
4475
  type: Optional
4476
4476
  }] }] });
4477
4477
 
@@ -4514,7 +4514,7 @@ class ClrHistory {
4514
4514
  this.historyService.setHistoryPinned(this.username, !this.pinActivated);
4515
4515
  }
4516
4516
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrHistory, deps: [{ token: ClrHistoryService }], target: i0.ɵɵFactoryTarget.Component }); }
4517
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrHistory, selector: "clr-history", inputs: { username: ["clrUsername", "username"], context: ["clrContext", "context"], pinActive: ["clrPinActive", "pinActive"], dropdownHeader: ["clrDropdownHeader", "dropdownHeader"], dropdownPin: ["clrDropdownPin", "dropdownPin"], dropdownUnpin: ["clrDropdownUnpin", "dropdownUnpin"], domain: ["clrDomain", "domain"], position: ["clrPosition", "position"] }, ngImport: i0, template: "<clr-dropdown>\n <button type=\"button\" class=\"btn btn-icon btn-link\" clrDropdownTrigger>\n <cds-icon shape=\"history\" size=\"24\"></cds-icon>\n <cds-icon shape=\"angle\" direction=\"down\" size=\"12\"></cds-icon>\n </button>\n <clr-dropdown-menu [clrPosition]=\"position\" *clrIfOpen>\n <label class=\"dropdown-header\" aria-hidden=\"true\">{{dropdownHeader}}</label>\n <button type=\"button\" clrDropdownItem *ngFor=\"let history of historyElements\" (click)=\"select(history)\">\n {{history.title}}\n </button>\n <div *ngIf=\"pinActive\" class=\"dropdown-divider\" role=\"separator\" aria-hidden=\"true\"></div>\n <button clrDropdownItem (click)=\"togglePinHistory()\">\n <span *ngIf=\"pinActive && !pinActivated\">{{dropdownPin}}</span>\n <span *ngIf=\"pinActive && pinActivated\">{{dropdownUnpin}}</span>\n </button>\n </clr-dropdown-menu>\n</clr-dropdown>\n", dependencies: [{ 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$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i1$1.ClrIfOpen, selector: "[clrIfOpen]", inputs: ["clrIfOpen"], outputs: ["clrIfOpenChange"] }, { kind: "directive", type: i1$1.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "component", type: i1$1.ClrDropdown, selector: "clr-dropdown", inputs: ["clrCloseMenuOnItemClick"] }, { kind: "component", type: i1$1.ClrDropdownMenu, selector: "clr-dropdown-menu", inputs: ["clrPosition"] }, { kind: "directive", type: i1$1.ClrDropdownTrigger, selector: "[clrDropdownTrigger],[clrDropdownToggle]" }, { kind: "directive", type: i1$1.ClrDropdownItem, selector: "[clrDropdownItem]", inputs: ["clrDisabled", "id"] }, { kind: "directive", type: ClrDropdownOverflowDirective, selector: "clr-dropdown-menu", inputs: ["clrDropdownMenuMaxHeight", "clrDropdownMenuItemMinHeight", "clrMarginBottom"] }] }); }
4517
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrHistory, selector: "clr-history", inputs: { username: ["clrUsername", "username"], context: ["clrContext", "context"], pinActive: ["clrPinActive", "pinActive"], dropdownHeader: ["clrDropdownHeader", "dropdownHeader"], dropdownPin: ["clrDropdownPin", "dropdownPin"], dropdownUnpin: ["clrDropdownUnpin", "dropdownUnpin"], domain: ["clrDomain", "domain"], position: ["clrPosition", "position"] }, ngImport: i0, template: "<clr-dropdown>\n <button type=\"button\" class=\"btn btn-icon btn-link\" clrDropdownTrigger>\n <cds-icon shape=\"history\" size=\"24\"></cds-icon>\n <cds-icon shape=\"angle\" direction=\"down\" size=\"12\"></cds-icon>\n </button>\n <clr-dropdown-menu [clrPosition]=\"position\" *clrIfOpen>\n <label class=\"dropdown-header\" aria-hidden=\"true\">{{dropdownHeader}}</label>\n <button type=\"button\" clrDropdownItem *ngFor=\"let history of historyElements\" (click)=\"select(history)\">\n {{history.title}}\n </button>\n <div *ngIf=\"pinActive\" class=\"dropdown-divider\" role=\"separator\" aria-hidden=\"true\"></div>\n <button clrDropdownItem (click)=\"togglePinHistory()\">\n <span *ngIf=\"pinActive && !pinActivated\">{{dropdownPin}}</span>\n <span *ngIf=\"pinActive && pinActivated\">{{dropdownUnpin}}</span>\n </button>\n </clr-dropdown-menu>\n</clr-dropdown>\n", dependencies: [{ 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.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrIfOpen, selector: "[clrIfOpen]", inputs: ["clrIfOpen"], outputs: ["clrIfOpenChange"] }, { kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "component", type: i2.ClrDropdown, selector: "clr-dropdown", inputs: ["clrCloseMenuOnItemClick"] }, { kind: "component", type: i2.ClrDropdownMenu, selector: "clr-dropdown-menu", inputs: ["clrPosition"] }, { kind: "directive", type: i2.ClrDropdownTrigger, selector: "[clrDropdownTrigger],[clrDropdownToggle]" }, { kind: "directive", type: i2.ClrDropdownItem, selector: "[clrDropdownItem]", inputs: ["clrDisabled", "id"] }, { kind: "directive", type: ClrDropdownOverflowDirective, selector: "clr-dropdown-menu", inputs: ["clrDropdownMenuMaxHeight", "clrDropdownMenuItemMinHeight", "clrMarginBottom"] }] }); }
4518
4518
  }
4519
4519
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrHistory, decorators: [{
4520
4520
  type: Component,
@@ -5388,7 +5388,7 @@ class ClrBrandAvatar {
5388
5388
  return output;
5389
5389
  }
5390
5390
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrBrandAvatar, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
5391
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrBrandAvatar, selector: "clr-brand-avatar", inputs: { brand: ["clrBrand", "brand"], size: ["clrSize", "size"] }, host: { properties: { "class.clr-brand-avatar": "this.avatar" } }, viewQueries: [{ propertyName: "avatarElement", first: true, predicate: ["avatar"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"brand-avatar-rectangle\">\n <div #avatar class=\"brand-avatar-icon-container\">\n <cds-icon\n [attr.size]=\"size\"\n [attr.shape]=\"getShape()\"\n [ngClass]=\"{'default-icon': getShape() === getDefaultIcon()}\"\n ></cds-icon>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }] }); }
5391
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrBrandAvatar, selector: "clr-brand-avatar", inputs: { brand: ["clrBrand", "brand"], size: ["clrSize", "size"] }, host: { properties: { "class.clr-brand-avatar": "this.avatar" } }, viewQueries: [{ propertyName: "avatarElement", first: true, predicate: ["avatar"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"brand-avatar-rectangle\">\n <div #avatar class=\"brand-avatar-icon-container\">\n <cds-icon\n [attr.size]=\"size\"\n [attr.shape]=\"getShape()\"\n [ngClass]=\"{'default-icon': getShape() === getDefaultIcon()}\"\n ></cds-icon>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }] }); }
5392
5392
  }
5393
5393
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrBrandAvatar, decorators: [{
5394
5394
  type: Component,
@@ -5502,29 +5502,146 @@ const CONTENT_PROVIDER = new InjectionToken('CONTENT_PROVIDER');
5502
5502
  * component to gather the content to be displayed.
5503
5503
  */
5504
5504
  class LocationBarContentProvider {
5505
+ /**
5506
+ * Notify users that search is performed and that nodes should be filtered.
5507
+ *
5508
+ * @param _response Search response
5509
+ */
5510
+ searchPerformed(_response) {
5511
+ // no implementation if search not enabled
5512
+ }
5513
+ }
5514
+
5515
+ class ClrAddonsLabel {
5516
+ constructor(controlIdService, renderer, el) {
5517
+ this.controlIdService = controlIdService;
5518
+ this.renderer = renderer;
5519
+ this.el = el;
5520
+ this.destroyed$ = new Subject();
5521
+ }
5522
+ ngOnInit() {
5523
+ // Only add the clr-control-label if it is inside a control container
5524
+ if (this.controlIdService) {
5525
+ this.renderer.addClass(this.el.nativeElement, 'clr-control-label');
5526
+ }
5527
+ if (this.controlIdService && !this.el.nativeElement.getAttribute('for')) {
5528
+ this.controlIdService.idChange.pipe(takeUntil$1(this.destroyed$)).subscribe(id =>
5529
+ // setTimeout needed, otherwise the ClrLabel directive of clarity will remove this via HostBinding again
5530
+ setTimeout(() => this.renderer.setAttribute(this.el.nativeElement, 'for', id)));
5531
+ }
5532
+ }
5533
+ ngOnDestroy() {
5534
+ this.destroyed$.next();
5535
+ this.destroyed$.complete();
5536
+ }
5537
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAddonsLabel, deps: [{ token: ControlIdService, optional: true }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
5538
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: ClrAddonsLabel, selector: "label", ngImport: i0 }); }
5539
+ }
5540
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAddonsLabel, decorators: [{
5541
+ type: Directive,
5542
+ args: [{ selector: 'label' }]
5543
+ }], ctorParameters: () => [{ type: ControlIdService, decorators: [{
5544
+ type: Optional
5545
+ }] }, { type: i0.Renderer2 }, { type: i0.ElementRef }] });
5546
+
5547
+ class LocationBarSearchComponent {
5548
+ constructor() {
5549
+ this.searchControl = new FormControl('');
5550
+ this.previousValue = '';
5551
+ this.displayWarning = false;
5552
+ this.MIN_CHARACTERS_DEFAULT = 3;
5553
+ this.MIM_CHARACTERS_TEXT_DEFAULT = 'Type 3+ characters to search.';
5554
+ this.searchPerformed = new EventEmitter();
5555
+ }
5556
+ ngOnInit() {
5557
+ this.searchControl.valueChanges.subscribe(text => this.onSearch(text));
5558
+ }
5559
+ onSearch(text) {
5560
+ const validatedText = this.validateSearchText(text);
5561
+ this.keepSearchFieldFocused(validatedText);
5562
+ if (validatedText !== null) {
5563
+ this.searchPerformed.emit(validatedText);
5564
+ this.displayWarning = false;
5565
+ }
5566
+ }
5567
+ validateSearchText(text) {
5568
+ const isDeletion = this.isTextDeletion(text);
5569
+ this.displayWarning = text.length < this.getMinSearchTextLength();
5570
+ if (isDeletion) {
5571
+ return text.length >= this.getMinSearchTextLength() ? text : '';
5572
+ }
5573
+ else {
5574
+ return text.length >= this.getMinSearchTextLength() ? text : null;
5575
+ }
5576
+ }
5577
+ keepSearchFieldFocused(text) {
5578
+ if (!text) {
5579
+ setTimeout(() => {
5580
+ this.searchInput.nativeElement.focus();
5581
+ });
5582
+ }
5583
+ }
5584
+ isTextDeletion(text) {
5585
+ const isDeletion = text.length < this.previousValue.length;
5586
+ this.previousValue = text;
5587
+ return isDeletion;
5588
+ }
5589
+ getMinSearchTextLength() {
5590
+ return this.searchRequest?.minCharacters !== undefined
5591
+ ? this.searchRequest.minCharacters
5592
+ : this.MIN_CHARACTERS_DEFAULT;
5593
+ }
5594
+ preventDropdownActions(event) {
5595
+ event.stopPropagation();
5596
+ }
5597
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LocationBarSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5598
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: LocationBarSearchComponent, selector: "clr-location-bar-search", inputs: { searchRequest: ["clrSearchRequest", "searchRequest"] }, outputs: { searchPerformed: "searchPerformed" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"clr-col-md-12 search-wrapper\">\n <form clrForm>\n <clr-input-container class=\"input-container\">\n <label hidden></label>\n <input\n #searchInput\n class=\"clr-col-md-12\"\n clrInput\n clrSearch\n [placeholder]=\"searchRequest?.placeholder ?? ''\"\n type=\"text\"\n name=\"search\"\n (keydown.Space)=\"preventDropdownActions($event)\"\n [formControl]=\"searchControl\"\n />\n <clr-control-helper *ngIf=\"displayWarning\" class=\"min-text-warning\">{{\n searchRequest?.minCharacterText ?? MIM_CHARACTERS_TEXT_DEFAULT\n }}</clr-control-helper>\n </clr-input-container>\n </form>\n</div>\n", styles: ["input::placeholder{font-size:.55rem}.search-wrapper{margin-bottom:.3rem}.input-container{margin-top:0}.min-text-warning{color:var(--cds-global-color-construction-800)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "component", type: i2.ClrControlHelper, selector: "clr-control-helper" }, { kind: "directive", type: i2.ClrForm, selector: "[clrForm]", inputs: ["clrLabelSize"] }, { kind: "directive", type: i2.ClrInput, selector: "[clrInput]" }, { kind: "component", type: i2.ClrInputContainer, selector: "clr-input-container" }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: ClrAutocompleteOff, selector: "input:not([autocomplete])" }, { kind: "directive", type: ClrAddonsLabel, selector: "label" }, { kind: "directive", type: ClrSearchField, selector: "[clrSearch]" }, { kind: "directive", type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5505
5599
  }
5600
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LocationBarSearchComponent, decorators: [{
5601
+ type: Component,
5602
+ args: [{ selector: 'clr-location-bar-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"clr-col-md-12 search-wrapper\">\n <form clrForm>\n <clr-input-container class=\"input-container\">\n <label hidden></label>\n <input\n #searchInput\n class=\"clr-col-md-12\"\n clrInput\n clrSearch\n [placeholder]=\"searchRequest?.placeholder ?? ''\"\n type=\"text\"\n name=\"search\"\n (keydown.Space)=\"preventDropdownActions($event)\"\n [formControl]=\"searchControl\"\n />\n <clr-control-helper *ngIf=\"displayWarning\" class=\"min-text-warning\">{{\n searchRequest?.minCharacterText ?? MIM_CHARACTERS_TEXT_DEFAULT\n }}</clr-control-helper>\n </clr-input-container>\n </form>\n</div>\n", styles: ["input::placeholder{font-size:.55rem}.search-wrapper{margin-bottom:.3rem}.input-container{margin-top:0}.min-text-warning{color:var(--cds-global-color-construction-800)}\n"] }]
5603
+ }], propDecorators: { searchRequest: [{
5604
+ type: Input,
5605
+ args: ['clrSearchRequest']
5606
+ }], searchPerformed: [{
5607
+ type: Output,
5608
+ args: ['searchPerformed']
5609
+ }], searchInput: [{
5610
+ type: ViewChild,
5611
+ args: ['searchInput', { static: true }]
5612
+ }] } });
5506
5613
 
5507
5614
  ClarityIcons.addIcons(treeViewIcon, angleIcon);
5508
5615
  /**
5509
5616
  * Component which renders a node of the location bar.
5510
5617
  */
5511
5618
  class LocationBarNodeComponent {
5619
+ /* inputs */
5620
+ set parentNode(parentNode) {
5621
+ this._parentNode = parentNode;
5622
+ if (this._parentNode) {
5623
+ const children$ = this._parentNode.getChildren() ? of(this._parentNode.getChildren()) : this.getLazyChildren();
5624
+ children$.toPromise().then(nodes => this.prepareChildren(nodes || []));
5625
+ }
5626
+ }
5512
5627
  constructor(contentProvider) {
5513
5628
  this.contentProvider = contentProvider;
5514
- /**
5515
- * Emits selection changes
5516
- */
5517
- this.selectionChanged = new EventEmitter();
5518
5629
  /**
5519
5630
  * The selectable nodes
5520
5631
  */
5521
5632
  this.selectableChilds = [];
5633
+ this.SEARCH_ITEM_STORAGE_KEY = 'searchedItem';
5634
+ this.searchResultItems = [];
5635
+ /* outputs */
5636
+ /**
5637
+ * Emits selection changes
5638
+ */
5639
+ this.selectionChanged = new EventEmitter();
5640
+ this.searchItemChanged = new EventEmitter();
5522
5641
  }
5523
- set parentNode(parentNode) {
5524
- this._parentNode = parentNode;
5525
- if (this._parentNode) {
5526
- const children$ = this._parentNode.getChildren() ? of(this._parentNode.getChildren()) : this.getLazyChildren();
5527
- children$.toPromise().then(nodes => this.prepareChildren(nodes || []));
5642
+ ngOnChanges(changes) {
5643
+ if (changes?.searchResultItems) {
5644
+ this.searchResultItems = changes.searchResultItems.currentValue;
5528
5645
  }
5529
5646
  }
5530
5647
  get parentNode() {
@@ -5557,7 +5674,6 @@ class LocationBarNodeComponent {
5557
5674
  }
5558
5675
  /**
5559
5676
  * Selects the given node
5560
- * node
5561
5677
  * @param selectedNode The selected child node.
5562
5678
  */
5563
5679
  selectNode(selectedNode) {
@@ -5574,21 +5690,54 @@ class LocationBarNodeComponent {
5574
5690
  notifySelectionChanged(selectedNode) {
5575
5691
  this.selectionChanged.emit([selectedNode.id]);
5576
5692
  }
5693
+ onSearch(text) {
5694
+ this.searchText = text;
5695
+ this.contentProvider.searchPerformed({ text: text, searchableNodes: this._parentNode.getChildren() });
5696
+ }
5697
+ displaySearchResult() {
5698
+ return this.searchResultItems.length !== 0 || !!this.searchText;
5699
+ }
5700
+ resetSearch() {
5701
+ this.searchResultItems = [];
5702
+ this.searchText = '';
5703
+ }
5704
+ onSearchItemChanged(item) {
5705
+ let searchedItem;
5706
+ if (item) {
5707
+ searchedItem = item;
5708
+ localStorage.setItem(this.SEARCH_ITEM_STORAGE_KEY, JSON.stringify(item));
5709
+ }
5710
+ else {
5711
+ const storageItem = localStorage.getItem(this.SEARCH_ITEM_STORAGE_KEY);
5712
+ if (storageItem) {
5713
+ searchedItem = JSON.parse(storageItem);
5714
+ }
5715
+ }
5716
+ this.searchItemChanged.emit(searchedItem);
5717
+ }
5577
5718
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LocationBarNodeComponent, deps: [{ token: CONTENT_PROVIDER, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
5578
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: LocationBarNodeComponent, selector: "clr-location-bar-node", inputs: { parentNode: "parentNode" }, outputs: { selectionChanged: "selectionChanged" }, host: { properties: { "class.location-bar-node": "true" } }, ngImport: i0, template: "<ng-container *ngIf=\"parentNode\">\n <ng-content *ngIf=\"parentNode.getChildren()?.length > 0\"></ng-content>\n\n <ng-container\n *ngIf=\"\n (selectableChilds.length > 0 && !parentNode.getSelectedChild()) || selectableChilds.length > 1;\n else singleSelected\n \"\n >\n <clr-dropdown>\n <button class=\"btn btn-link btn-sm\" (blur)=\"focus = false\" (focus)=\"focus = true\" clrDropdownTrigger>\n <ng-container *ngIf=\"parentNode.getSelectedChild() as node; else unselected\">\n <span\n class=\"text-truncate\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ node.label }}\"\n >\n {{ node.label }}\n </span>\n <cds-icon shape=\"angle\" direction=\"down\" size=\"xs\" class=\"caret-icon\"></cds-icon>\n </ng-container>\n <ng-template #unselected>\n <cds-icon class=\"unselected\" size=\"18\" [attr.solid]=\"focus\" shape=\"tree-view\"></cds-icon>&nbsp;...\n </ng-template>\n </button>\n <clr-dropdown-menu [clrPosition]=\"'bottom-left'\" *clrIfOpen>\n <button\n *ngFor=\"let item of selectableChilds\"\n type=\"button\"\n clrDropdownItem\n class=\"text-truncate\"\n [class.selected-child]=\"item.id === parentNode.getSelectedChild()?.id\"\n (click)=\"selectNode(item)\"\n title=\"{{ item.label }}\"\n >\n {{ item.label }}\n </button>\n </clr-dropdown-menu>\n </clr-dropdown>\n </ng-container>\n\n <ng-template #singleSelected>\n <ng-container *ngIf=\"parentNode.getSelectedChild()\">\n <ng-container *ngIf=\"parentNode.getSelectedChild().selectable; else unselectable\">\n <button\n class=\"btn btn-link btn-sm\"\n (click)=\"selectNode(parentNode.getSelectedChild())\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ parentNode.getSelectedChild().label }}\"\n >\n {{ parentNode.getSelectedChild().label }}\n </button>\n </ng-container>\n <ng-template #unselectable>\n <span\n class=\"unselectable-node text-truncate\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ parentNode.getSelectedChild().label }}\"\n >\n {{ parentNode.getSelectedChild().label }}\n </span>\n </ng-template>\n </ng-container>\n </ng-template>\n\n <clr-location-bar-node\n *ngIf=\"parentNode.getSelectedChild() && parentNode.getChildren().length > 0\"\n [parentNode]=\"parentNode.getSelectedChild()\"\n (selectionChanged)=\"onSelectionChanged($event)\"\n >\n <span>/</span>\n </clr-location-bar-node>\n</ng-container>\n", dependencies: [{ 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$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: i1$1.ClrDropdown, selector: "clr-dropdown", inputs: ["clrCloseMenuOnItemClick"] }, { kind: "component", type: i1$1.ClrDropdownMenu, selector: "clr-dropdown-menu", inputs: ["clrPosition"] }, { kind: "directive", type: i1$1.ClrDropdownTrigger, selector: "[clrDropdownTrigger],[clrDropdownToggle]" }, { kind: "directive", type: i1$1.ClrDropdownItem, selector: "[clrDropdownItem]", inputs: ["clrDisabled", "id"] }, { kind: "directive", type: i1$1.ClrIfOpen, selector: "[clrIfOpen]", inputs: ["clrIfOpen"], outputs: ["clrIfOpenChange"] }, { kind: "directive", type: ClrDropdownOverflowDirective, selector: "clr-dropdown-menu", inputs: ["clrDropdownMenuMaxHeight", "clrDropdownMenuItemMinHeight", "clrMarginBottom"] }, { kind: "component", type: LocationBarNodeComponent, selector: "clr-location-bar-node", inputs: ["parentNode"], outputs: ["selectionChanged"] }] }); }
5719
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: LocationBarNodeComponent, selector: "clr-location-bar-node", inputs: { parentNode: "parentNode", searchResultItems: ["clrSearchResultItems", "searchResultItems"], searchRequest: ["clrSearchRequest", "searchRequest"] }, outputs: { selectionChanged: "selectionChanged", searchItemChanged: "searchItemChanged" }, host: { properties: { "class.location-bar-node": "true" } }, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"parentNode\">\n <ng-content *ngIf=\"parentNode.getChildren()?.length > 0\"></ng-content>\n\n <ng-container\n *ngIf=\"\n (selectableChilds.length > 0 && !parentNode.getSelectedChild()) || selectableChilds.length > 1;\n else singleSelected\n \"\n >\n <clr-dropdown>\n <button\n class=\"btn btn-link btn-sm\"\n (blur)=\"focus = false\"\n (focus)=\"focus = true\"\n (click)=\"resetSearch()\"\n clrDropdownTrigger\n >\n <ng-container *ngIf=\"parentNode.getSelectedChild() as node; else unselected\">\n <span\n (click)=\"resetSearch()\"\n class=\"text-truncate\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ node.label }}\"\n >\n {{ node.label }}\n </span>\n <cds-icon shape=\"angle\" direction=\"down\" size=\"xs\" class=\"caret-icon\"></cds-icon>\n </ng-container>\n <ng-template #unselected>\n <cds-icon class=\"unselected\" size=\"18\" [attr.solid]=\"focus\" shape=\"tree-view\"></cds-icon>&nbsp;...\n </ng-template>\n </button>\n <clr-dropdown-menu [clrPosition]=\"'bottom-left'\" *clrIfOpen>\n <clr-location-bar-search\n *ngIf=\"searchRequest\"\n [clrSearchRequest]=\"searchRequest\"\n (searchPerformed)=\"onSearch($event)\"\n ></clr-location-bar-search>\n <span *ngIf=\"displaySearchResult(); else displaySelectableChilds\">\n <span *ngIf=\"searchResultItems.length !== 0; else displayNotFound\">\n <span *ngFor=\"let searchResultItem of searchResultItems\">\n <button\n type=\"button\"\n clrDropdownItem\n class=\"text-truncate\"\n (click)=\"onSearchItemChanged(searchResultItem)\"\n >\n <ng-container\n *ngTemplateOutlet=\"searchRequest?.searchResultItemRef; context: { $implicit: searchResultItem }\"\n ></ng-container>\n </button>\n </span>\n </span>\n <ng-template #displayNotFound>\n <span class=\"no-result-text\">\n {{ searchRequest?.noResultsText ?? 'No search result found.' }}\n </span>\n </ng-template>\n </span>\n\n <ng-template #displaySelectableChilds>\n <button\n *ngFor=\"let item of selectableChilds\"\n type=\"button\"\n clrDropdownItem\n class=\"text-truncate\"\n [class.selected-child]=\"item.id === parentNode.getSelectedChild()?.id\"\n (click)=\"selectNode(item)\"\n title=\"{{ item.label }}\"\n >\n {{ item.label }}\n </button>\n </ng-template>\n </clr-dropdown-menu>\n </clr-dropdown>\n </ng-container>\n\n <ng-template #singleSelected>\n <ng-container *ngIf=\"parentNode.getSelectedChild()\">\n <ng-container *ngIf=\"parentNode.getSelectedChild().selectable; else unselectable\">\n <button\n class=\"btn btn-link btn-sm\"\n (click)=\"selectNode(parentNode.getSelectedChild())\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ parentNode.getSelectedChild().label }}\"\n >\n {{ parentNode.getSelectedChild().label }}\n </button>\n </ng-container>\n <ng-template #unselectable>\n <span\n class=\"unselectable-node text-truncate\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ parentNode.getSelectedChild().label }}\"\n >\n {{ parentNode.getSelectedChild().label }}\n </span>\n </ng-template>\n </ng-container>\n </ng-template>\n\n <clr-location-bar-node\n *ngIf=\"parentNode.getSelectedChild() && parentNode.getChildren().length > 0\"\n [parentNode]=\"parentNode.getSelectedChild()\"\n [clrSearchRequest]=\"searchRequest\"\n [clrSearchResultItems]=\"searchResultItems\"\n (selectionChanged)=\"onSelectionChanged($event)\"\n (searchItemChanged)=\"onSearchItemChanged(null)\"\n >\n <span>/</span>\n </clr-location-bar-node>\n</ng-container>\n", dependencies: [{ 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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: i2.ClrDropdown, selector: "clr-dropdown", inputs: ["clrCloseMenuOnItemClick"] }, { kind: "component", type: i2.ClrDropdownMenu, selector: "clr-dropdown-menu", inputs: ["clrPosition"] }, { kind: "directive", type: i2.ClrDropdownTrigger, selector: "[clrDropdownTrigger],[clrDropdownToggle]" }, { kind: "directive", type: i2.ClrDropdownItem, selector: "[clrDropdownItem]", inputs: ["clrDisabled", "id"] }, { kind: "directive", type: i2.ClrIfOpen, selector: "[clrIfOpen]", inputs: ["clrIfOpen"], outputs: ["clrIfOpenChange"] }, { kind: "directive", type: ClrDropdownOverflowDirective, selector: "clr-dropdown-menu", inputs: ["clrDropdownMenuMaxHeight", "clrDropdownMenuItemMinHeight", "clrMarginBottom"] }, { kind: "component", type: LocationBarNodeComponent, selector: "clr-location-bar-node", inputs: ["parentNode", "clrSearchResultItems", "clrSearchRequest"], outputs: ["selectionChanged", "searchItemChanged"] }, { kind: "component", type: LocationBarSearchComponent, selector: "clr-location-bar-search", inputs: ["clrSearchRequest"], outputs: ["searchPerformed"] }] }); }
5579
5720
  }
5580
5721
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LocationBarNodeComponent, decorators: [{
5581
5722
  type: Component,
5582
- args: [{ selector: 'clr-location-bar-node', host: { '[class.location-bar-node]': 'true' }, template: "<ng-container *ngIf=\"parentNode\">\n <ng-content *ngIf=\"parentNode.getChildren()?.length > 0\"></ng-content>\n\n <ng-container\n *ngIf=\"\n (selectableChilds.length > 0 && !parentNode.getSelectedChild()) || selectableChilds.length > 1;\n else singleSelected\n \"\n >\n <clr-dropdown>\n <button class=\"btn btn-link btn-sm\" (blur)=\"focus = false\" (focus)=\"focus = true\" clrDropdownTrigger>\n <ng-container *ngIf=\"parentNode.getSelectedChild() as node; else unselected\">\n <span\n class=\"text-truncate\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ node.label }}\"\n >\n {{ node.label }}\n </span>\n <cds-icon shape=\"angle\" direction=\"down\" size=\"xs\" class=\"caret-icon\"></cds-icon>\n </ng-container>\n <ng-template #unselected>\n <cds-icon class=\"unselected\" size=\"18\" [attr.solid]=\"focus\" shape=\"tree-view\"></cds-icon>&nbsp;...\n </ng-template>\n </button>\n <clr-dropdown-menu [clrPosition]=\"'bottom-left'\" *clrIfOpen>\n <button\n *ngFor=\"let item of selectableChilds\"\n type=\"button\"\n clrDropdownItem\n class=\"text-truncate\"\n [class.selected-child]=\"item.id === parentNode.getSelectedChild()?.id\"\n (click)=\"selectNode(item)\"\n title=\"{{ item.label }}\"\n >\n {{ item.label }}\n </button>\n </clr-dropdown-menu>\n </clr-dropdown>\n </ng-container>\n\n <ng-template #singleSelected>\n <ng-container *ngIf=\"parentNode.getSelectedChild()\">\n <ng-container *ngIf=\"parentNode.getSelectedChild().selectable; else unselectable\">\n <button\n class=\"btn btn-link btn-sm\"\n (click)=\"selectNode(parentNode.getSelectedChild())\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ parentNode.getSelectedChild().label }}\"\n >\n {{ parentNode.getSelectedChild().label }}\n </button>\n </ng-container>\n <ng-template #unselectable>\n <span\n class=\"unselectable-node text-truncate\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ parentNode.getSelectedChild().label }}\"\n >\n {{ parentNode.getSelectedChild().label }}\n </span>\n </ng-template>\n </ng-container>\n </ng-template>\n\n <clr-location-bar-node\n *ngIf=\"parentNode.getSelectedChild() && parentNode.getChildren().length > 0\"\n [parentNode]=\"parentNode.getSelectedChild()\"\n (selectionChanged)=\"onSelectionChanged($event)\"\n >\n <span>/</span>\n </clr-location-bar-node>\n</ng-container>\n" }]
5723
+ args: [{ selector: 'clr-location-bar-node', host: { '[class.location-bar-node]': 'true' }, template: "<ng-container *ngIf=\"parentNode\">\n <ng-content *ngIf=\"parentNode.getChildren()?.length > 0\"></ng-content>\n\n <ng-container\n *ngIf=\"\n (selectableChilds.length > 0 && !parentNode.getSelectedChild()) || selectableChilds.length > 1;\n else singleSelected\n \"\n >\n <clr-dropdown>\n <button\n class=\"btn btn-link btn-sm\"\n (blur)=\"focus = false\"\n (focus)=\"focus = true\"\n (click)=\"resetSearch()\"\n clrDropdownTrigger\n >\n <ng-container *ngIf=\"parentNode.getSelectedChild() as node; else unselected\">\n <span\n (click)=\"resetSearch()\"\n class=\"text-truncate\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ node.label }}\"\n >\n {{ node.label }}\n </span>\n <cds-icon shape=\"angle\" direction=\"down\" size=\"xs\" class=\"caret-icon\"></cds-icon>\n </ng-container>\n <ng-template #unselected>\n <cds-icon class=\"unselected\" size=\"18\" [attr.solid]=\"focus\" shape=\"tree-view\"></cds-icon>&nbsp;...\n </ng-template>\n </button>\n <clr-dropdown-menu [clrPosition]=\"'bottom-left'\" *clrIfOpen>\n <clr-location-bar-search\n *ngIf=\"searchRequest\"\n [clrSearchRequest]=\"searchRequest\"\n (searchPerformed)=\"onSearch($event)\"\n ></clr-location-bar-search>\n <span *ngIf=\"displaySearchResult(); else displaySelectableChilds\">\n <span *ngIf=\"searchResultItems.length !== 0; else displayNotFound\">\n <span *ngFor=\"let searchResultItem of searchResultItems\">\n <button\n type=\"button\"\n clrDropdownItem\n class=\"text-truncate\"\n (click)=\"onSearchItemChanged(searchResultItem)\"\n >\n <ng-container\n *ngTemplateOutlet=\"searchRequest?.searchResultItemRef; context: { $implicit: searchResultItem }\"\n ></ng-container>\n </button>\n </span>\n </span>\n <ng-template #displayNotFound>\n <span class=\"no-result-text\">\n {{ searchRequest?.noResultsText ?? 'No search result found.' }}\n </span>\n </ng-template>\n </span>\n\n <ng-template #displaySelectableChilds>\n <button\n *ngFor=\"let item of selectableChilds\"\n type=\"button\"\n clrDropdownItem\n class=\"text-truncate\"\n [class.selected-child]=\"item.id === parentNode.getSelectedChild()?.id\"\n (click)=\"selectNode(item)\"\n title=\"{{ item.label }}\"\n >\n {{ item.label }}\n </button>\n </ng-template>\n </clr-dropdown-menu>\n </clr-dropdown>\n </ng-container>\n\n <ng-template #singleSelected>\n <ng-container *ngIf=\"parentNode.getSelectedChild()\">\n <ng-container *ngIf=\"parentNode.getSelectedChild().selectable; else unselectable\">\n <button\n class=\"btn btn-link btn-sm\"\n (click)=\"selectNode(parentNode.getSelectedChild())\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ parentNode.getSelectedChild().label }}\"\n >\n {{ parentNode.getSelectedChild().label }}\n </button>\n </ng-container>\n <ng-template #unselectable>\n <span\n class=\"unselectable-node text-truncate\"\n [class.last-level]=\"!parentNode.getSelectedChild().getSelectedChild()\"\n title=\"{{ parentNode.getSelectedChild().label }}\"\n >\n {{ parentNode.getSelectedChild().label }}\n </span>\n </ng-template>\n </ng-container>\n </ng-template>\n\n <clr-location-bar-node\n *ngIf=\"parentNode.getSelectedChild() && parentNode.getChildren().length > 0\"\n [parentNode]=\"parentNode.getSelectedChild()\"\n [clrSearchRequest]=\"searchRequest\"\n [clrSearchResultItems]=\"searchResultItems\"\n (selectionChanged)=\"onSelectionChanged($event)\"\n (searchItemChanged)=\"onSearchItemChanged(null)\"\n >\n <span>/</span>\n </clr-location-bar-node>\n</ng-container>\n" }]
5583
5724
  }], ctorParameters: () => [{ type: LocationBarContentProvider, decorators: [{
5584
5725
  type: Inject,
5585
5726
  args: [CONTENT_PROVIDER]
5586
5727
  }, {
5587
5728
  type: Optional
5588
- }] }], propDecorators: { selectionChanged: [{
5589
- type: Output
5590
- }], parentNode: [{
5729
+ }] }], propDecorators: { parentNode: [{
5591
5730
  type: Input
5731
+ }], searchResultItems: [{
5732
+ type: Input,
5733
+ args: ['clrSearchResultItems']
5734
+ }], searchRequest: [{
5735
+ type: Input,
5736
+ args: ['clrSearchRequest']
5737
+ }], selectionChanged: [{
5738
+ type: Output
5739
+ }], searchItemChanged: [{
5740
+ type: Output
5592
5741
  }] } });
5593
5742
 
5594
5743
  ClarityIcons.addIcons(organizationIcon);
@@ -5597,7 +5746,9 @@ class LocationBarComponent {
5597
5746
  this.root$ = new ReplaySubject();
5598
5747
  this.iconShape = 'organization';
5599
5748
  this.iconTitle = '';
5749
+ this.searchResultItems = [];
5600
5750
  this.selectionChanged = new EventEmitter();
5751
+ this.searchItemChanged = new EventEmitter();
5601
5752
  }
5602
5753
  set roots(roots) {
5603
5754
  const internalRoot = new LocationBarNode(null, null, false);
@@ -5607,75 +5758,43 @@ class LocationBarComponent {
5607
5758
  }
5608
5759
  this.root$.next(internalRoot);
5609
5760
  }
5761
+ ngOnChanges(changes) {
5762
+ if (changes?.searchResultItems) {
5763
+ this.searchResultItems = changes.searchResultItems.currentValue;
5764
+ }
5765
+ }
5610
5766
  onSelectionChanged(selection) {
5611
5767
  this.selectionChanged.emit(selection);
5612
5768
  }
5613
5769
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LocationBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5614
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: LocationBarComponent, selector: "clr-location-bar", inputs: { iconShape: ["clrIconShape", "iconShape"], iconTitle: ["clrIconTitle", "iconTitle"], roots: ["clrRoots", "roots"] }, outputs: { selectionChanged: "clrSelectionChanged" }, ngImport: i0, template: "<cds-icon *ngIf=\"iconShape\" [attr.shape]=\"iconShape\" [title]=\"iconTitle\"></cds-icon>\n<clr-location-bar-node (selectionChanged)=\"onSelectionChanged($event)\" [parentNode]=\"root$ | async\">\n</clr-location-bar-node>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: LocationBarNodeComponent, selector: "clr-location-bar-node", inputs: ["parentNode"], outputs: ["selectionChanged"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
5770
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: LocationBarComponent, selector: "clr-location-bar", inputs: { iconShape: ["clrIconShape", "iconShape"], iconTitle: ["clrIconTitle", "iconTitle"], searchRequest: ["clrSearchRequest", "searchRequest"], searchResultItems: ["clrSearchResultItems", "searchResultItems"], roots: ["clrRoots", "roots"] }, outputs: { selectionChanged: "clrSelectionChanged", searchItemChanged: "clrSearchItemChanged" }, usesOnChanges: true, ngImport: i0, template: "<cds-icon *ngIf=\"iconShape\" [attr.shape]=\"iconShape\" [title]=\"iconTitle\"></cds-icon>\n<clr-location-bar-node\n (selectionChanged)=\"onSelectionChanged($event)\"\n (searchItemChanged)=\"searchItemChanged.emit($event)\"\n [parentNode]=\"root$ | async\"\n [clrSearchRequest]=\"searchRequest\"\n [clrSearchResultItems]=\"searchResultItems\"\n>\n</clr-location-bar-node>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: LocationBarNodeComponent, selector: "clr-location-bar-node", inputs: ["parentNode", "clrSearchResultItems", "clrSearchRequest"], outputs: ["selectionChanged", "searchItemChanged"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
5615
5771
  }
5616
5772
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LocationBarComponent, decorators: [{
5617
5773
  type: Component,
5618
- args: [{ selector: 'clr-location-bar', template: "<cds-icon *ngIf=\"iconShape\" [attr.shape]=\"iconShape\" [title]=\"iconTitle\"></cds-icon>\n<clr-location-bar-node (selectionChanged)=\"onSelectionChanged($event)\" [parentNode]=\"root$ | async\">\n</clr-location-bar-node>\n" }]
5774
+ args: [{ selector: 'clr-location-bar', template: "<cds-icon *ngIf=\"iconShape\" [attr.shape]=\"iconShape\" [title]=\"iconTitle\"></cds-icon>\n<clr-location-bar-node\n (selectionChanged)=\"onSelectionChanged($event)\"\n (searchItemChanged)=\"searchItemChanged.emit($event)\"\n [parentNode]=\"root$ | async\"\n [clrSearchRequest]=\"searchRequest\"\n [clrSearchResultItems]=\"searchResultItems\"\n>\n</clr-location-bar-node>\n" }]
5619
5775
  }], propDecorators: { iconShape: [{
5620
5776
  type: Input,
5621
5777
  args: ['clrIconShape']
5622
5778
  }], iconTitle: [{
5623
5779
  type: Input,
5624
5780
  args: ['clrIconTitle']
5781
+ }], searchRequest: [{
5782
+ type: Input,
5783
+ args: ['clrSearchRequest']
5784
+ }], searchResultItems: [{
5785
+ type: Input,
5786
+ args: ['clrSearchResultItems']
5625
5787
  }], roots: [{
5626
5788
  type: Input,
5627
5789
  args: ['clrRoots']
5628
5790
  }], selectionChanged: [{
5629
5791
  type: Output,
5630
5792
  args: ['clrSelectionChanged']
5793
+ }], searchItemChanged: [{
5794
+ type: Output,
5795
+ args: ['clrSearchItemChanged']
5631
5796
  }] } });
5632
5797
 
5633
- class ClrLocationBarModule {
5634
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
5635
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, declarations: [LocationBarComponent, LocationBarNodeComponent], imports: [CommonModule, ClrIconModule, ClrDropdownModule, ClrDropdownOverflowModule], exports: [LocationBarComponent] }); }
5636
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, imports: [CommonModule, ClrIconModule, ClrDropdownModule, ClrDropdownOverflowModule] }); }
5637
- }
5638
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, decorators: [{
5639
- type: NgModule,
5640
- args: [{
5641
- declarations: [LocationBarComponent, LocationBarNodeComponent],
5642
- imports: [CommonModule, ClrIconModule, ClrDropdownModule, ClrDropdownOverflowModule],
5643
- exports: [LocationBarComponent],
5644
- }]
5645
- }] });
5646
-
5647
- class ClrAddonsLabel {
5648
- constructor(controlIdService, renderer, el) {
5649
- this.controlIdService = controlIdService;
5650
- this.renderer = renderer;
5651
- this.el = el;
5652
- this.destroyed$ = new Subject();
5653
- }
5654
- ngOnInit() {
5655
- // Only add the clr-control-label if it is inside a control container
5656
- if (this.controlIdService) {
5657
- this.renderer.addClass(this.el.nativeElement, 'clr-control-label');
5658
- }
5659
- if (this.controlIdService && !this.el.nativeElement.getAttribute('for')) {
5660
- this.controlIdService.idChange.pipe(takeUntil$1(this.destroyed$)).subscribe(id =>
5661
- // setTimeout needed, otherwise the ClrLabel directive of clarity will remove this via HostBinding again
5662
- setTimeout(() => this.renderer.setAttribute(this.el.nativeElement, 'for', id)));
5663
- }
5664
- }
5665
- ngOnDestroy() {
5666
- this.destroyed$.next();
5667
- this.destroyed$.complete();
5668
- }
5669
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAddonsLabel, deps: [{ token: ControlIdService, optional: true }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
5670
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: ClrAddonsLabel, selector: "label", ngImport: i0 }); }
5671
- }
5672
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAddonsLabel, decorators: [{
5673
- type: Directive,
5674
- args: [{ selector: 'label' }]
5675
- }], ctorParameters: () => [{ type: ControlIdService, decorators: [{
5676
- type: Optional
5677
- }] }, { type: i0.Renderer2 }, { type: i0.ElementRef }] });
5678
-
5679
5798
  /*
5680
5799
  * Copyright (c) 2018-2022 Porsche Informatik. All Rights Reserved.
5681
5800
  * This software is released under MIT license.
@@ -5694,6 +5813,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
5694
5813
  }]
5695
5814
  }] });
5696
5815
 
5816
+ class ClrLocationBarModule {
5817
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
5818
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, declarations: [LocationBarComponent, LocationBarNodeComponent, LocationBarSearchComponent], imports: [CommonModule,
5819
+ ClrIconModule,
5820
+ ClrDropdownModule,
5821
+ ClrDropdownOverflowModule,
5822
+ ClarityModule,
5823
+ FormsModule,
5824
+ ClrAutocompleteOffModule,
5825
+ ClrFormModule,
5826
+ ClrSearchFieldModule,
5827
+ ReactiveFormsModule], exports: [LocationBarComponent] }); }
5828
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, imports: [CommonModule,
5829
+ ClrIconModule,
5830
+ ClrDropdownModule,
5831
+ ClrDropdownOverflowModule,
5832
+ ClarityModule,
5833
+ FormsModule,
5834
+ ClrAutocompleteOffModule,
5835
+ ClrFormModule,
5836
+ ClrSearchFieldModule,
5837
+ ReactiveFormsModule] }); }
5838
+ }
5839
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, decorators: [{
5840
+ type: NgModule,
5841
+ args: [{
5842
+ declarations: [LocationBarComponent, LocationBarNodeComponent, LocationBarSearchComponent],
5843
+ imports: [
5844
+ CommonModule,
5845
+ ClrIconModule,
5846
+ ClrDropdownModule,
5847
+ ClrDropdownOverflowModule,
5848
+ ClarityModule,
5849
+ FormsModule,
5850
+ ClrAutocompleteOffModule,
5851
+ ClrFormModule,
5852
+ ClrSearchFieldModule,
5853
+ ReactiveFormsModule,
5854
+ ],
5855
+ exports: [LocationBarComponent],
5856
+ }]
5857
+ }] });
5858
+
5697
5859
  class DatagridFieldDirective {
5698
5860
  getFieldName() {
5699
5861
  return this.clrDgField ?? this.clrDgFieldKey;
@@ -5927,7 +6089,7 @@ class StatePersistenceKeyDirective {
5927
6089
  this.destroy$.next();
5928
6090
  this.destroy$.complete();
5929
6091
  }
5930
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: StatePersistenceKeyDirective, deps: [{ token: i1$1.ClrDatagrid }], target: i0.ɵɵFactoryTarget.Directive }); }
6092
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: StatePersistenceKeyDirective, deps: [{ token: i2.ClrDatagrid }], target: i0.ɵɵFactoryTarget.Directive }); }
5931
6093
  static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: StatePersistenceKeyDirective, selector: "[clrStatePersistenceKey]", inputs: { options: ["clrStatePersistenceKey", "options"], useLocalStoreOnly: ["clrUseLocalStoreOnly", "useLocalStoreOnly"], paginationDescription: ["clrPaginationDescription", "paginationDescription"] }, queries: [{ propertyName: "pagination", first: true, predicate: ClrDatagridPagination, descendants: true }, { propertyName: "paginationElem", first: true, predicate: ClrDatagridPagination, descendants: true, read: ElementRef }, { propertyName: "customFilters", predicate: ClrDatagridFilter, descendants: true }], ngImport: i0 }); }
5932
6094
  }
5933
6095
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: StatePersistenceKeyDirective, decorators: [{
@@ -5935,7 +6097,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
5935
6097
  args: [{
5936
6098
  selector: '[clrStatePersistenceKey]',
5937
6099
  }]
5938
- }], ctorParameters: () => [{ type: i1$1.ClrDatagrid }], propDecorators: { options: [{
6100
+ }], ctorParameters: () => [{ type: i2.ClrDatagrid }], propDecorators: { options: [{
5939
6101
  type: Input,
5940
6102
  args: ['clrStatePersistenceKey']
5941
6103
  }], useLocalStoreOnly: [{
@@ -6011,7 +6173,7 @@ class ColumnHiddenStatePersistenceDirective {
6011
6173
  this.destroy$.next();
6012
6174
  this.destroy$.complete();
6013
6175
  }
6014
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ColumnHiddenStatePersistenceDirective, deps: [{ token: DatagridFieldDirective, optional: true }, { token: StatePersistenceKeyDirective, optional: true }, { token: i1$1.ClrDatagrid }, { token: i1$1.ClrDatagridHideableColumn }], target: i0.ɵɵFactoryTarget.Directive }); }
6176
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ColumnHiddenStatePersistenceDirective, deps: [{ token: DatagridFieldDirective, optional: true }, { token: StatePersistenceKeyDirective, optional: true }, { token: i2.ClrDatagrid }, { token: i2.ClrDatagridHideableColumn }], target: i0.ɵɵFactoryTarget.Directive }); }
6015
6177
  static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: ColumnHiddenStatePersistenceDirective, selector: "[clrDgHideableColumn]", ngImport: i0 }); }
6016
6178
  }
6017
6179
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ColumnHiddenStatePersistenceDirective, decorators: [{
@@ -6023,7 +6185,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
6023
6185
  type: Optional
6024
6186
  }] }, { type: StatePersistenceKeyDirective, decorators: [{
6025
6187
  type: Optional
6026
- }] }, { type: i1$1.ClrDatagrid }, { type: i1$1.ClrDatagridHideableColumn }] });
6188
+ }] }, { type: i2.ClrDatagrid }, { type: i2.ClrDatagridHideableColumn }] });
6027
6189
 
6028
6190
  class ClrDatagridStatePersistenceModule {
6029
6191
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDatagridStatePersistenceModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
@@ -6157,13 +6319,13 @@ class ClrEnumFilterComponent {
6157
6319
  }
6158
6320
  return value ? { value: value, displayValue: value } : { value: '', displayValue: this.emptyValue };
6159
6321
  }
6160
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrEnumFilterComponent, deps: [{ token: i1$1.ClrDatagridFilter }, { token: i1$1.ClrDatagrid }], target: i0.ɵɵFactoryTarget.Component }); }
6161
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrEnumFilterComponent, selector: "clr-enum-filter", inputs: { property: ["clrProperty", "property"], setEmptyValuesTranslation: ["clrEmptyValuesTranslation", "setEmptyValuesTranslation"], value: ["clrFilterValues", "value"], clrPossibleValues: "clrPossibleValues" }, outputs: { clrFilterValuesChange: "clrFilterValuesChange" }, ngImport: i0, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilters()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<clr-checkbox-container class=\"filter-selection\">\n <clr-checkbox-wrapper *ngFor=\"let possibleValue of possibleValues\">\n <input\n type=\"checkbox\"\n clrCheckbox\n value=\"{{ possibleValue.displayValue ?? possibleValue }}\"\n name=\"possibleValue\"\n [ngModel]=\"containsFilterValue(filteredValues, possibleValue)\"\n (ngModelChange)=\"onChange(possibleValue, $event)\"\n />\n <label>{{ possibleValue.displayValue ?? possibleValue }}</label>\n </clr-checkbox-wrapper>\n</clr-checkbox-container>\n", styles: [".filter-selection{margin-top:0}.btn-trash{position:absolute;top:15px;right:40px;padding:0}\n"], dependencies: [{ kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i1$1.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i1$1.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i1$1.ClrCheckboxContainer, selector: "clr-checkbox-container,clr-toggle-container", inputs: ["clrInline"] }, { kind: "component", type: i1$1.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
6322
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrEnumFilterComponent, deps: [{ token: i2.ClrDatagridFilter }, { token: i2.ClrDatagrid }], target: i0.ɵɵFactoryTarget.Component }); }
6323
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrEnumFilterComponent, selector: "clr-enum-filter", inputs: { property: ["clrProperty", "property"], setEmptyValuesTranslation: ["clrEmptyValuesTranslation", "setEmptyValuesTranslation"], value: ["clrFilterValues", "value"], clrPossibleValues: "clrPossibleValues" }, outputs: { clrFilterValuesChange: "clrFilterValuesChange" }, ngImport: i0, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilters()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<clr-checkbox-container class=\"filter-selection\">\n <clr-checkbox-wrapper *ngFor=\"let possibleValue of possibleValues\">\n <input\n type=\"checkbox\"\n clrCheckbox\n value=\"{{ possibleValue.displayValue ?? possibleValue }}\"\n name=\"possibleValue\"\n [ngModel]=\"containsFilterValue(filteredValues, possibleValue)\"\n (ngModelChange)=\"onChange(possibleValue, $event)\"\n />\n <label>{{ possibleValue.displayValue ?? possibleValue }}</label>\n </clr-checkbox-wrapper>\n</clr-checkbox-container>\n", styles: [".filter-selection{margin-top:0}.btn-trash{position:absolute;top:15px;right:40px;padding:0}\n"], dependencies: [{ kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i2.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i2.ClrCheckboxContainer, selector: "clr-checkbox-container,clr-toggle-container", inputs: ["clrInline"] }, { kind: "component", type: i2.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
6162
6324
  }
6163
6325
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrEnumFilterComponent, decorators: [{
6164
6326
  type: Component,
6165
6327
  args: [{ selector: 'clr-enum-filter', template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilters()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<clr-checkbox-container class=\"filter-selection\">\n <clr-checkbox-wrapper *ngFor=\"let possibleValue of possibleValues\">\n <input\n type=\"checkbox\"\n clrCheckbox\n value=\"{{ possibleValue.displayValue ?? possibleValue }}\"\n name=\"possibleValue\"\n [ngModel]=\"containsFilterValue(filteredValues, possibleValue)\"\n (ngModelChange)=\"onChange(possibleValue, $event)\"\n />\n <label>{{ possibleValue.displayValue ?? possibleValue }}</label>\n </clr-checkbox-wrapper>\n</clr-checkbox-container>\n", styles: [".filter-selection{margin-top:0}.btn-trash{position:absolute;top:15px;right:40px;padding:0}\n"] }]
6166
- }], ctorParameters: () => [{ type: i1$1.ClrDatagridFilter }, { type: i1$1.ClrDatagrid }], propDecorators: { property: [{
6328
+ }], ctorParameters: () => [{ type: i2.ClrDatagridFilter }, { type: i2.ClrDatagrid }], propDecorators: { property: [{
6167
6329
  type: Input,
6168
6330
  args: ['clrProperty']
6169
6331
  }], setEmptyValuesTranslation: [{
@@ -6348,13 +6510,13 @@ class ClrDateFilterComponent {
6348
6510
  equals(other) {
6349
6511
  return other === this;
6350
6512
  }
6351
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDateFilterComponent, deps: [{ token: i1$1.ClrCommonStringsService }, { token: i1$1.ClrPopoverEventsService }, { token: i1$1.ClrDatagridFilter }], target: i0.ɵɵFactoryTarget.Component }); }
6352
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrDateFilterComponent, selector: "clr-date-filter", inputs: { property: ["clrProperty", "property"], maxPlaceholder: ["clrFilterMaxPlaceholder", "maxPlaceholder"], minPlaceholder: ["clrFilterMinPlaceholder", "minPlaceholder"], value: ["clrFilterValue", "value"] }, outputs: { filterValueChange: "clrFilterValueChange" }, ngImport: i0, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilter()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<clr-date-container>\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n</clr-date-container>\n<clr-date-container>\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n</clr-date-container>\n", styles: [".btn-trash{position:absolute;top:15px;right:40px;padding:0}\n"], dependencies: [{ kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: i1$1.ClrDateContainer, selector: "clr-date-container", inputs: ["clrPosition"] }, { kind: "directive", type: i1$1.ClrDateInput, selector: "[clrDate]", inputs: ["placeholder", "clrDate", "min", "max", "disabled"], outputs: ["clrDateChange"] }, { kind: "directive", type: i1$1.ClrDateInputValidator, selector: "[clrDate]" }] }); }
6513
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDateFilterComponent, deps: [{ token: i2.ClrCommonStringsService }, { token: i2.ClrPopoverEventsService }, { token: i2.ClrDatagridFilter }], target: i0.ɵɵFactoryTarget.Component }); }
6514
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrDateFilterComponent, selector: "clr-date-filter", inputs: { property: ["clrProperty", "property"], maxPlaceholder: ["clrFilterMaxPlaceholder", "maxPlaceholder"], minPlaceholder: ["clrFilterMinPlaceholder", "minPlaceholder"], value: ["clrFilterValue", "value"] }, outputs: { filterValueChange: "clrFilterValueChange" }, ngImport: i0, template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilter()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<clr-date-container>\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n</clr-date-container>\n<clr-date-container>\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n</clr-date-container>\n", styles: [".btn-trash{position:absolute;top:15px;right:40px;padding:0}\n"], dependencies: [{ kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: i2.ClrDateContainer, selector: "clr-date-container", inputs: ["clrPosition"] }, { kind: "directive", type: i2.ClrDateInput, selector: "[clrDate]", inputs: ["placeholder", "clrDate", "min", "max", "disabled"], outputs: ["clrDateChange"] }, { kind: "directive", type: i2.ClrDateInputValidator, selector: "[clrDate]" }] }); }
6353
6515
  }
6354
6516
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDateFilterComponent, decorators: [{
6355
6517
  type: Component,
6356
6518
  args: [{ selector: 'clr-date-filter', template: "<button class=\"btn btn-sm btn-icon btn-link btn-trash\" (click)=\"clearFilter()\">\n <cds-icon shape=\"trash\"></cds-icon>\n</button>\n<clr-date-container>\n <input\n #input_from\n type=\"date\"\n name=\"from\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"from\"\n [placeholder]=\"minPlaceholderValue\"\n [attr.aria-label]=\"minPlaceholderValue\"\n />\n</clr-date-container>\n<clr-date-container>\n <input\n type=\"date\"\n name=\"to\"\n class=\"datagrid-date-filter-input\"\n [(clrDate)]=\"to\"\n [placeholder]=\"maxPlaceholderValue\"\n [attr.aria-label]=\"maxPlaceholderValue\"\n />\n</clr-date-container>\n", styles: [".btn-trash{position:absolute;top:15px;right:40px;padding:0}\n"] }]
6357
- }], ctorParameters: () => [{ type: i1$1.ClrCommonStringsService }, { type: i1$1.ClrPopoverEventsService }, { type: i1$1.ClrDatagridFilter }], propDecorators: { property: [{
6519
+ }], ctorParameters: () => [{ type: i2.ClrCommonStringsService }, { type: i2.ClrPopoverEventsService }, { type: i2.ClrDatagridFilter }], propDecorators: { property: [{
6358
6520
  type: Input,
6359
6521
  args: ['clrProperty']
6360
6522
  }], maxPlaceholder: [{
@@ -6612,7 +6774,7 @@ class ClrDatepickerComponent {
6612
6774
  this.inputElm.nativeElement.focus();
6613
6775
  }
6614
6776
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDatepickerComponent, deps: [{ token: OpenedDatepickersTrackerService }], target: i0.ɵɵFactoryTarget.Component }); }
6615
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrDatepickerComponent, selector: "clr-datepicker", inputs: { value: "value", label: "label", minDate: "minDate", maxDate: "maxDate" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "inputElm", first: true, predicate: ["inputElm"], descendants: true }, { propertyName: "clrDateContainer", first: true, predicate: ClrDateContainer, descendants: true }], ngImport: i0, template: "<clr-date-container>\n <label>{{ this.label }}</label>\n <input #inputElm clrDate [(clrDate)]=\"this.date\" [min]=\"this.minDateAttr\" [max]=\"this.maxDateAttr\" />\n</clr-date-container>\n", dependencies: [{ kind: "directive", type: i1$1.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "component", type: i1$1.ClrDateContainer, selector: "clr-date-container", inputs: ["clrPosition"] }, { kind: "directive", type: i1$1.ClrDateInput, selector: "[clrDate]", inputs: ["placeholder", "clrDate", "min", "max", "disabled"], outputs: ["clrDateChange"] }, { kind: "directive", type: i1$1.ClrDateInputValidator, selector: "[clrDate]" }] }); }
6777
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrDatepickerComponent, selector: "clr-datepicker", inputs: { value: "value", label: "label", minDate: "minDate", maxDate: "maxDate" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "inputElm", first: true, predicate: ["inputElm"], descendants: true }, { propertyName: "clrDateContainer", first: true, predicate: ClrDateContainer, descendants: true }], ngImport: i0, template: "<clr-date-container>\n <label>{{ this.label }}</label>\n <input #inputElm clrDate [(clrDate)]=\"this.date\" [min]=\"this.minDateAttr\" [max]=\"this.maxDateAttr\" />\n</clr-date-container>\n", dependencies: [{ kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "component", type: i2.ClrDateContainer, selector: "clr-date-container", inputs: ["clrPosition"] }, { kind: "directive", type: i2.ClrDateInput, selector: "[clrDate]", inputs: ["placeholder", "clrDate", "min", "max", "disabled"], outputs: ["clrDateChange"] }, { kind: "directive", type: i2.ClrDateInputValidator, selector: "[clrDate]" }] }); }
6616
6778
  }
6617
6779
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDatepickerComponent, decorators: [{
6618
6780
  type: Component,
@@ -7084,12 +7246,12 @@ class ClrAbstractContainer {
7084
7246
  this.daterangeControlStateService = daterangeControlStateService;
7085
7247
  this.isFormControl = true;
7086
7248
  }
7087
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAbstractContainer, deps: [{ token: i1$1.ClrLayout, optional: true }, { token: DaterangeControlStateService }], target: i0.ɵɵFactoryTarget.Directive }); }
7249
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAbstractContainer, deps: [{ token: i2.ClrLayout, optional: true }, { token: DaterangeControlStateService }], target: i0.ɵɵFactoryTarget.Directive }); }
7088
7250
  static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: ClrAbstractContainer, host: { properties: { "class.clr-form-control": "this.isFormControl", "class.clr-row": "this.addLayoutGrid" } }, queries: [{ propertyName: "labelComponent", first: true, predicate: ClrLabel, descendants: true }, { propertyName: "controlHelperComponent", first: true, predicate: ClrControlHelper, descendants: true }, { propertyName: "controlErrorComponent", first: true, predicate: ClrControlError, descendants: true }, { propertyName: "controlSuccessComponent", first: true, predicate: ClrControlSuccess, descendants: true }], ngImport: i0 }); }
7089
7251
  }
7090
7252
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAbstractContainer, decorators: [{
7091
7253
  type: Directive
7092
- }], ctorParameters: () => [{ type: i1$1.ClrLayout, decorators: [{
7254
+ }], ctorParameters: () => [{ type: i2.ClrLayout, decorators: [{
7093
7255
  type: Optional
7094
7256
  }] }, { type: DaterangeControlStateService }], propDecorators: { isFormControl: [{
7095
7257
  type: HostBinding,
@@ -7538,7 +7700,7 @@ class ClrDaterangepickerContainerComponent extends ClrAbstractContainer {
7538
7700
  this.clrPopoverToggleService.open = false;
7539
7701
  }
7540
7702
  }
7541
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDaterangepickerContainerComponent, deps: [{ token: i1$1.ClrPopoverEventsService }, { token: i1$1.ClrPopoverToggleService }, { token: i1$1.ClrCommonStringsService }, { token: i1$1.ClrLayout, optional: true }, { token: DaterangeControlStateService }, { token: OpenedDatepickersTrackerService }, { token: DaterangeService }, { token: DaterangeParsingService }], target: i0.ɵɵFactoryTarget.Component }); }
7703
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDaterangepickerContainerComponent, deps: [{ token: i2.ClrPopoverEventsService }, { token: i2.ClrPopoverToggleService }, { token: i2.ClrCommonStringsService }, { token: i2.ClrLayout, optional: true }, { token: DaterangeControlStateService }, { token: OpenedDatepickersTrackerService }, { token: DaterangeService }, { token: DaterangeParsingService }], target: i0.ɵɵFactoryTarget.Component }); }
7542
7704
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: ClrDaterangepickerContainerComponent, selector: "clr-daterangepicker-container", inputs: { presets: "presets", clrPosition: "clrPosition", labelFrom: "labelFrom", labelTo: "labelTo" }, host: { properties: { "class": "this.classes" } }, providers: [
7543
7705
  ClrPopoverToggleService,
7544
7706
  ClrPopoverEventsService,
@@ -7547,7 +7709,7 @@ class ClrDaterangepickerContainerComponent extends ClrAbstractContainer {
7547
7709
  DaterangeService,
7548
7710
  OpenedDatepickersTrackerService,
7549
7711
  ControlIdService,
7550
- ], queries: [{ propertyName: "daterangepickerDirective", first: true, predicate: ClrDaterangepickerDirective, descendants: true }], viewQueries: [{ propertyName: "datepickerComponents", predicate: ClrDatepickerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"label\"></ng-content>\n<label *ngIf=\"!this.labelComponent && this.addLayoutGrid\"></label>\n<div\n class=\"clr-control-container\"\n [class.clr-error]=\"this.isInvalid\"\n [class.clr-col-12]=\"this.addLayoutGrid\"\n [class.clr-col-md-10]=\"this.addLayoutGrid\"\n>\n <div class=\"clr-input-wrapper\" clrPopoverAnchor>\n <div class=\"clr-input-group\" [class.clr-focus]=\"this.focus\">\n <ng-content select=\"[clrDaterangepicker]\"></ng-content>\n <button\n type=\"button\"\n class=\"clr-input-group-icon-action\"\n [disabled]=\"this.disabled\"\n [title]=\"this.friendlyDaterange\"\n [attr.aria-label]=\"this.friendlyDaterange\"\n clrPopoverOpenCloseButton\n >\n <cds-icon status=\"info\" shape=\"calendar\"></cds-icon>\n </button>\n </div>\n <cds-icon\n *ngIf=\"this.isInvalid\"\n class=\"clr-validate-icon\"\n shape=\"exclamation-circle\"\n status=\"danger\"\n aria-hidden=\"true\"\n ></cds-icon>\n <cds-icon\n *ngIf=\"!this.isInvalid\"\n class=\"clr-validate-icon\"\n shape=\"check-circle\"\n status=\"success\"\n aria-hidden=\"true\"\n ></cds-icon>\n </div>\n <ng-content select=\"clr-control-helper\" *ngIf=\"this.showHelper\"></ng-content>\n <ng-content select=\"clr-control-error\" *ngIf=\"this.showInvalid\"></ng-content>\n <ng-content select=\"clr-control-success\" *ngIf=\"this.showValid\"></ng-content>\n\n <div\n class=\"clr-daterangepicker-container-popup datepicker\"\n *clrPopoverContent=\"this.open; at: this.popoverPosition; outsideClickToClose: true; scrollToClose: true\"\n >\n <button\n class=\"btn btn-sm btn-link close\"\n clrPopoverCloseButton\n type=\"button\"\n [attr.aria-label]=\"this.commonStrings.close\"\n >\n <cds-icon shape=\"window-close\" aria-hidden=\"true\" [attr.title]=\"this.commonStrings.close\"></cds-icon>\n <span class=\"clr-sr-only\">{{ this.commonStrings.close }}</span>\n </button>\n <div class=\"clr-daterangepicker-container-popup-content\">\n <form clrForm [clrLayout]=\"'vertical'\">\n <clr-datepicker\n class=\"clr-datepicker\"\n [label]=\"this.labelFrom\"\n [value]=\"this.dateFrom\"\n [minDate]=\"this.minDate\"\n [maxDate]=\"this.maxDate\"\n (valueChange)=\"this.onDateFromChange($event)\"\n >\n </clr-datepicker>\n <clr-datepicker\n class=\"clr-datepicker\"\n [label]=\"this.labelTo\"\n [value]=\"this.dateTo\"\n [minDate]=\"this.minDate\"\n [maxDate]=\"this.maxDate\"\n (valueChange)=\"this.onDateToChange($event)\"\n >\n </clr-datepicker>\n </form>\n <div class=\"clr-daterangepicker-container-popup-content-presets\" *ngIf=\"this.presets?.length > 0\">\n <ng-container *ngFor=\"let preset of this.presets\">\n <button class=\"btn btn-outline btn-sm btn-block\" type=\"button\" (click)=\"this.applyPreset(preset)\">\n {{ preset.text }}\n </button>\n </ng-container>\n </div>\n </div>\n </div>\n</div>\n", styles: [".clr-input-wrapper>.clr-input-group{max-width:fit-content;padding-right:1.5rem}.clr-input-wrapper>.clr-input-group ::ng-deep>.clr-input{width:100%;padding:0 .3rem}.clr-daterangepicker-container-popup.datepicker{padding:0;width:auto;height:auto;display:block}.clr-daterangepicker-container-popup.datepicker .clr-smart-close-button{min-width:1.2rem;margin:0;padding:0;position:absolute;right:0}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content{padding:.6rem;display:flex;flex-direction:row}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content .clr-form ::ng-deep clr-datepicker:first-of-type ::ng-deep clr-date-container{margin-top:0}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content .clr-daterangepicker-container-popup-content-presets{margin-left:.6rem;padding:.3rem}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content .clr-daterangepicker-container-popup-content-presets .btn{margin-right:0}\n"], dependencies: [{ 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: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i1$1.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i1$1.ClrForm, selector: "[clrForm]", inputs: ["clrLabelSize"] }, { kind: "directive", type: i1$1.ClrLayout, selector: "[clrForm][clrLayout]", inputs: ["clrLayout"] }, { kind: "directive", type: i1$1.ClrPopoverAnchor, selector: "[clrPopoverAnchor]" }, { kind: "directive", type: i1$1.ÇlrClrPopoverCloseButton, selector: "[clrPopoverCloseButton]", outputs: ["clrPopoverOnCloseChange"] }, { kind: "directive", type: i1$1.ÇlrClrPopoverOpenCloseButton, selector: "[clrPopoverOpenCloseButton]", outputs: ["clrPopoverOpenCloseChange"] }, { kind: "directive", type: i1$1.ClrPopoverContent, selector: "[clrPopoverContent]", inputs: ["clrPopoverContent", "clrPopoverContentAt", "clrPopoverContentOutsideClickToClose", "clrPopoverContentScrollToClose"] }, { kind: "component", type: ClrDatepickerComponent, selector: "clr-datepicker", inputs: ["value", "label", "minDate", "maxDate"], outputs: ["valueChange"] }] }); }
7712
+ ], queries: [{ propertyName: "daterangepickerDirective", first: true, predicate: ClrDaterangepickerDirective, descendants: true }], viewQueries: [{ propertyName: "datepickerComponents", predicate: ClrDatepickerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"label\"></ng-content>\n<label *ngIf=\"!this.labelComponent && this.addLayoutGrid\"></label>\n<div\n class=\"clr-control-container\"\n [class.clr-error]=\"this.isInvalid\"\n [class.clr-col-12]=\"this.addLayoutGrid\"\n [class.clr-col-md-10]=\"this.addLayoutGrid\"\n>\n <div class=\"clr-input-wrapper\" clrPopoverAnchor>\n <div class=\"clr-input-group\" [class.clr-focus]=\"this.focus\">\n <ng-content select=\"[clrDaterangepicker]\"></ng-content>\n <button\n type=\"button\"\n class=\"clr-input-group-icon-action\"\n [disabled]=\"this.disabled\"\n [title]=\"this.friendlyDaterange\"\n [attr.aria-label]=\"this.friendlyDaterange\"\n clrPopoverOpenCloseButton\n >\n <cds-icon status=\"info\" shape=\"calendar\"></cds-icon>\n </button>\n </div>\n <cds-icon\n *ngIf=\"this.isInvalid\"\n class=\"clr-validate-icon\"\n shape=\"exclamation-circle\"\n status=\"danger\"\n aria-hidden=\"true\"\n ></cds-icon>\n <cds-icon\n *ngIf=\"!this.isInvalid\"\n class=\"clr-validate-icon\"\n shape=\"check-circle\"\n status=\"success\"\n aria-hidden=\"true\"\n ></cds-icon>\n </div>\n <ng-content select=\"clr-control-helper\" *ngIf=\"this.showHelper\"></ng-content>\n <ng-content select=\"clr-control-error\" *ngIf=\"this.showInvalid\"></ng-content>\n <ng-content select=\"clr-control-success\" *ngIf=\"this.showValid\"></ng-content>\n\n <div\n class=\"clr-daterangepicker-container-popup datepicker\"\n *clrPopoverContent=\"this.open; at: this.popoverPosition; outsideClickToClose: true; scrollToClose: true\"\n >\n <button\n class=\"btn btn-sm btn-link close\"\n clrPopoverCloseButton\n type=\"button\"\n [attr.aria-label]=\"this.commonStrings.close\"\n >\n <cds-icon shape=\"window-close\" aria-hidden=\"true\" [attr.title]=\"this.commonStrings.close\"></cds-icon>\n <span class=\"clr-sr-only\">{{ this.commonStrings.close }}</span>\n </button>\n <div class=\"clr-daterangepicker-container-popup-content\">\n <form clrForm [clrLayout]=\"'vertical'\">\n <clr-datepicker\n class=\"clr-datepicker\"\n [label]=\"this.labelFrom\"\n [value]=\"this.dateFrom\"\n [minDate]=\"this.minDate\"\n [maxDate]=\"this.maxDate\"\n (valueChange)=\"this.onDateFromChange($event)\"\n >\n </clr-datepicker>\n <clr-datepicker\n class=\"clr-datepicker\"\n [label]=\"this.labelTo\"\n [value]=\"this.dateTo\"\n [minDate]=\"this.minDate\"\n [maxDate]=\"this.maxDate\"\n (valueChange)=\"this.onDateToChange($event)\"\n >\n </clr-datepicker>\n </form>\n <div class=\"clr-daterangepicker-container-popup-content-presets\" *ngIf=\"this.presets?.length > 0\">\n <ng-container *ngFor=\"let preset of this.presets\">\n <button class=\"btn btn-outline btn-sm btn-block\" type=\"button\" (click)=\"this.applyPreset(preset)\">\n {{ preset.text }}\n </button>\n </ng-container>\n </div>\n </div>\n </div>\n</div>\n", styles: [".clr-input-wrapper>.clr-input-group{max-width:fit-content;padding-right:1.5rem}.clr-input-wrapper>.clr-input-group ::ng-deep>.clr-input{width:100%;padding:0 .3rem}.clr-daterangepicker-container-popup.datepicker{padding:0;width:auto;height:auto;display:block}.clr-daterangepicker-container-popup.datepicker .clr-smart-close-button{min-width:1.2rem;margin:0;padding:0;position:absolute;right:0}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content{padding:.6rem;display:flex;flex-direction:row}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content .clr-form ::ng-deep clr-datepicker:first-of-type ::ng-deep clr-date-container{margin-top:0}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content .clr-daterangepicker-container-popup-content-presets{margin-left:.6rem;padding:.3rem}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content .clr-daterangepicker-container-popup-content-presets .btn{margin-right:0}\n"], dependencies: [{ 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: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i2.ClrForm, selector: "[clrForm]", inputs: ["clrLabelSize"] }, { kind: "directive", type: i2.ClrLayout, selector: "[clrForm][clrLayout]", inputs: ["clrLayout"] }, { kind: "directive", type: i2.ClrPopoverAnchor, selector: "[clrPopoverAnchor]" }, { kind: "directive", type: i2.ÇlrClrPopoverCloseButton, selector: "[clrPopoverCloseButton]", outputs: ["clrPopoverOnCloseChange"] }, { kind: "directive", type: i2.ÇlrClrPopoverOpenCloseButton, selector: "[clrPopoverOpenCloseButton]", outputs: ["clrPopoverOpenCloseChange"] }, { kind: "directive", type: i2.ClrPopoverContent, selector: "[clrPopoverContent]", inputs: ["clrPopoverContent", "clrPopoverContentAt", "clrPopoverContentOutsideClickToClose", "clrPopoverContentScrollToClose"] }, { kind: "component", type: ClrDatepickerComponent, selector: "clr-datepicker", inputs: ["value", "label", "minDate", "maxDate"], outputs: ["valueChange"] }] }); }
7551
7713
  }
7552
7714
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDaterangepickerContainerComponent, decorators: [{
7553
7715
  type: Component,
@@ -7560,7 +7722,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
7560
7722
  OpenedDatepickersTrackerService,
7561
7723
  ControlIdService,
7562
7724
  ], template: "<ng-content select=\"label\"></ng-content>\n<label *ngIf=\"!this.labelComponent && this.addLayoutGrid\"></label>\n<div\n class=\"clr-control-container\"\n [class.clr-error]=\"this.isInvalid\"\n [class.clr-col-12]=\"this.addLayoutGrid\"\n [class.clr-col-md-10]=\"this.addLayoutGrid\"\n>\n <div class=\"clr-input-wrapper\" clrPopoverAnchor>\n <div class=\"clr-input-group\" [class.clr-focus]=\"this.focus\">\n <ng-content select=\"[clrDaterangepicker]\"></ng-content>\n <button\n type=\"button\"\n class=\"clr-input-group-icon-action\"\n [disabled]=\"this.disabled\"\n [title]=\"this.friendlyDaterange\"\n [attr.aria-label]=\"this.friendlyDaterange\"\n clrPopoverOpenCloseButton\n >\n <cds-icon status=\"info\" shape=\"calendar\"></cds-icon>\n </button>\n </div>\n <cds-icon\n *ngIf=\"this.isInvalid\"\n class=\"clr-validate-icon\"\n shape=\"exclamation-circle\"\n status=\"danger\"\n aria-hidden=\"true\"\n ></cds-icon>\n <cds-icon\n *ngIf=\"!this.isInvalid\"\n class=\"clr-validate-icon\"\n shape=\"check-circle\"\n status=\"success\"\n aria-hidden=\"true\"\n ></cds-icon>\n </div>\n <ng-content select=\"clr-control-helper\" *ngIf=\"this.showHelper\"></ng-content>\n <ng-content select=\"clr-control-error\" *ngIf=\"this.showInvalid\"></ng-content>\n <ng-content select=\"clr-control-success\" *ngIf=\"this.showValid\"></ng-content>\n\n <div\n class=\"clr-daterangepicker-container-popup datepicker\"\n *clrPopoverContent=\"this.open; at: this.popoverPosition; outsideClickToClose: true; scrollToClose: true\"\n >\n <button\n class=\"btn btn-sm btn-link close\"\n clrPopoverCloseButton\n type=\"button\"\n [attr.aria-label]=\"this.commonStrings.close\"\n >\n <cds-icon shape=\"window-close\" aria-hidden=\"true\" [attr.title]=\"this.commonStrings.close\"></cds-icon>\n <span class=\"clr-sr-only\">{{ this.commonStrings.close }}</span>\n </button>\n <div class=\"clr-daterangepicker-container-popup-content\">\n <form clrForm [clrLayout]=\"'vertical'\">\n <clr-datepicker\n class=\"clr-datepicker\"\n [label]=\"this.labelFrom\"\n [value]=\"this.dateFrom\"\n [minDate]=\"this.minDate\"\n [maxDate]=\"this.maxDate\"\n (valueChange)=\"this.onDateFromChange($event)\"\n >\n </clr-datepicker>\n <clr-datepicker\n class=\"clr-datepicker\"\n [label]=\"this.labelTo\"\n [value]=\"this.dateTo\"\n [minDate]=\"this.minDate\"\n [maxDate]=\"this.maxDate\"\n (valueChange)=\"this.onDateToChange($event)\"\n >\n </clr-datepicker>\n </form>\n <div class=\"clr-daterangepicker-container-popup-content-presets\" *ngIf=\"this.presets?.length > 0\">\n <ng-container *ngFor=\"let preset of this.presets\">\n <button class=\"btn btn-outline btn-sm btn-block\" type=\"button\" (click)=\"this.applyPreset(preset)\">\n {{ preset.text }}\n </button>\n </ng-container>\n </div>\n </div>\n </div>\n</div>\n", styles: [".clr-input-wrapper>.clr-input-group{max-width:fit-content;padding-right:1.5rem}.clr-input-wrapper>.clr-input-group ::ng-deep>.clr-input{width:100%;padding:0 .3rem}.clr-daterangepicker-container-popup.datepicker{padding:0;width:auto;height:auto;display:block}.clr-daterangepicker-container-popup.datepicker .clr-smart-close-button{min-width:1.2rem;margin:0;padding:0;position:absolute;right:0}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content{padding:.6rem;display:flex;flex-direction:row}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content .clr-form ::ng-deep clr-datepicker:first-of-type ::ng-deep clr-date-container{margin-top:0}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content .clr-daterangepicker-container-popup-content-presets{margin-left:.6rem;padding:.3rem}.clr-daterangepicker-container-popup.datepicker .clr-daterangepicker-container-popup-content .clr-daterangepicker-container-popup-content-presets .btn{margin-right:0}\n"] }]
7563
- }], ctorParameters: () => [{ type: i1$1.ClrPopoverEventsService }, { type: i1$1.ClrPopoverToggleService }, { type: i1$1.ClrCommonStringsService }, { type: i1$1.ClrLayout, decorators: [{
7725
+ }], ctorParameters: () => [{ type: i2.ClrPopoverEventsService }, { type: i2.ClrPopoverToggleService }, { type: i2.ClrCommonStringsService }, { type: i2.ClrLayout, decorators: [{
7564
7726
  type: Optional
7565
7727
  }] }, { type: DaterangeControlStateService }, { type: OpenedDatepickersTrackerService }, { type: DaterangeService }, { type: DaterangeParsingService }], propDecorators: { presets: [{
7566
7728
  type: Input