@porscheinformatik/clr-addons 17.4.2 → 17.5.0

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,
@@ -5504,27 +5504,136 @@ const CONTENT_PROVIDER = new InjectionToken('CONTENT_PROVIDER');
5504
5504
  class LocationBarContentProvider {
5505
5505
  }
5506
5506
 
5507
+ class ClrAddonsLabel {
5508
+ constructor(controlIdService, renderer, el) {
5509
+ this.controlIdService = controlIdService;
5510
+ this.renderer = renderer;
5511
+ this.el = el;
5512
+ this.destroyed$ = new Subject();
5513
+ }
5514
+ ngOnInit() {
5515
+ // Only add the clr-control-label if it is inside a control container
5516
+ if (this.controlIdService) {
5517
+ this.renderer.addClass(this.el.nativeElement, 'clr-control-label');
5518
+ }
5519
+ if (this.controlIdService && !this.el.nativeElement.getAttribute('for')) {
5520
+ this.controlIdService.idChange.pipe(takeUntil$1(this.destroyed$)).subscribe(id =>
5521
+ // setTimeout needed, otherwise the ClrLabel directive of clarity will remove this via HostBinding again
5522
+ setTimeout(() => this.renderer.setAttribute(this.el.nativeElement, 'for', id)));
5523
+ }
5524
+ }
5525
+ ngOnDestroy() {
5526
+ this.destroyed$.next();
5527
+ this.destroyed$.complete();
5528
+ }
5529
+ 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 }); }
5530
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: ClrAddonsLabel, selector: "label", ngImport: i0 }); }
5531
+ }
5532
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAddonsLabel, decorators: [{
5533
+ type: Directive,
5534
+ args: [{ selector: 'label' }]
5535
+ }], ctorParameters: () => [{ type: ControlIdService, decorators: [{
5536
+ type: Optional
5537
+ }] }, { type: i0.Renderer2 }, { type: i0.ElementRef }] });
5538
+
5539
+ class LocationBarSearchComponent {
5540
+ constructor() {
5541
+ this.searchControl = new FormControl('');
5542
+ this.previousValue = '';
5543
+ this.displayWarning = false;
5544
+ this.MIN_CHARACTERS_DEFAULT = 3;
5545
+ this.MIM_CHARACTERS_TEXT_DEFAULT = 'Type 3+ characters to search.';
5546
+ this.searchPerformed = new EventEmitter();
5547
+ }
5548
+ ngOnInit() {
5549
+ this.searchControl.valueChanges.subscribe(text => this.onSearch(text));
5550
+ }
5551
+ onSearch(text) {
5552
+ const validatedText = this.validateSearchText(text);
5553
+ this.keepSearchFieldFocused(validatedText);
5554
+ if (validatedText !== null) {
5555
+ this.searchPerformed.emit(validatedText);
5556
+ this.displayWarning = false;
5557
+ }
5558
+ }
5559
+ validateSearchText(text) {
5560
+ const isDeletion = this.isTextDeletion(text);
5561
+ this.displayWarning = text.length < this.getMinSearchTextLength();
5562
+ if (isDeletion) {
5563
+ return text.length >= this.getMinSearchTextLength() ? text : '';
5564
+ }
5565
+ else {
5566
+ return text.length >= this.getMinSearchTextLength() ? text : null;
5567
+ }
5568
+ }
5569
+ keepSearchFieldFocused(text) {
5570
+ if (text.length === 0) {
5571
+ setTimeout(() => {
5572
+ this.searchInput.nativeElement.focus();
5573
+ });
5574
+ }
5575
+ }
5576
+ isTextDeletion(text) {
5577
+ const isDeletion = text.length < this.previousValue.length;
5578
+ this.previousValue = text;
5579
+ return isDeletion;
5580
+ }
5581
+ getMinSearchTextLength() {
5582
+ return this.searchRequest?.minCharacters !== undefined
5583
+ ? this.searchRequest.minCharacters
5584
+ : this.MIN_CHARACTERS_DEFAULT;
5585
+ }
5586
+ preventDropdownActions(event) {
5587
+ event.stopPropagation();
5588
+ }
5589
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LocationBarSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5590
+ 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 }); }
5591
+ }
5592
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LocationBarSearchComponent, decorators: [{
5593
+ type: Component,
5594
+ 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"] }]
5595
+ }], propDecorators: { searchRequest: [{
5596
+ type: Input,
5597
+ args: ['clrSearchRequest']
5598
+ }], searchPerformed: [{
5599
+ type: Output,
5600
+ args: ['searchPerformed']
5601
+ }], searchInput: [{
5602
+ type: ViewChild,
5603
+ args: ['searchInput', { static: true }]
5604
+ }] } });
5605
+
5507
5606
  ClarityIcons.addIcons(treeViewIcon, angleIcon);
5508
5607
  /**
5509
5608
  * Component which renders a node of the location bar.
5510
5609
  */
5511
5610
  class LocationBarNodeComponent {
5611
+ /* inputs */
5612
+ set parentNode(parentNode) {
5613
+ this._parentNode = parentNode;
5614
+ if (this._parentNode) {
5615
+ const children$ = this._parentNode.getChildren() ? of(this._parentNode.getChildren()) : this.getLazyChildren();
5616
+ children$.toPromise().then(nodes => this.prepareChildren(nodes || []));
5617
+ }
5618
+ }
5512
5619
  constructor(contentProvider) {
5513
5620
  this.contentProvider = contentProvider;
5514
- /**
5515
- * Emits selection changes
5516
- */
5517
- this.selectionChanged = new EventEmitter();
5518
5621
  /**
5519
5622
  * The selectable nodes
5520
5623
  */
5521
5624
  this.selectableChilds = [];
5625
+ this.SEARCH_ITEM_STORAGE_KEY = 'searchedItem';
5626
+ this.searchResultItems = [];
5627
+ /* outputs */
5628
+ /**
5629
+ * Emits selection changes
5630
+ */
5631
+ this.selectionChanged = new EventEmitter();
5632
+ this.searchItemChanged = new EventEmitter();
5522
5633
  }
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 || []));
5634
+ ngOnChanges(changes) {
5635
+ if (changes?.searchResultItems) {
5636
+ this.searchResultItems = changes.searchResultItems.currentValue;
5528
5637
  }
5529
5638
  }
5530
5639
  get parentNode() {
@@ -5557,7 +5666,6 @@ class LocationBarNodeComponent {
5557
5666
  }
5558
5667
  /**
5559
5668
  * Selects the given node
5560
- * node
5561
5669
  * @param selectedNode The selected child node.
5562
5670
  */
5563
5671
  selectNode(selectedNode) {
@@ -5574,21 +5682,54 @@ class LocationBarNodeComponent {
5574
5682
  notifySelectionChanged(selectedNode) {
5575
5683
  this.selectionChanged.emit([selectedNode.id]);
5576
5684
  }
5685
+ onSearch(text) {
5686
+ this.searchText = text;
5687
+ this.contentProvider.searchPerformed({ text: text, searchableNodes: this._parentNode.getChildren() });
5688
+ }
5689
+ displaySearchResult() {
5690
+ return this.searchResultItems.length !== 0 || !!this.searchText;
5691
+ }
5692
+ resetSearch() {
5693
+ this.searchResultItems = [];
5694
+ this.searchText = '';
5695
+ }
5696
+ onSearchItemChanged(item) {
5697
+ let searchedItem;
5698
+ if (item) {
5699
+ searchedItem = item;
5700
+ localStorage.setItem(this.SEARCH_ITEM_STORAGE_KEY, JSON.stringify(item));
5701
+ }
5702
+ else {
5703
+ const storageItem = localStorage.getItem(this.SEARCH_ITEM_STORAGE_KEY);
5704
+ if (storageItem) {
5705
+ searchedItem = JSON.parse(storageItem);
5706
+ }
5707
+ }
5708
+ this.searchItemChanged.emit(searchedItem);
5709
+ }
5577
5710
  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"] }] }); }
5711
+ 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
5712
  }
5580
5713
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LocationBarNodeComponent, decorators: [{
5581
5714
  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" }]
5715
+ 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
5716
  }], ctorParameters: () => [{ type: LocationBarContentProvider, decorators: [{
5584
5717
  type: Inject,
5585
5718
  args: [CONTENT_PROVIDER]
5586
5719
  }, {
5587
5720
  type: Optional
5588
- }] }], propDecorators: { selectionChanged: [{
5589
- type: Output
5590
- }], parentNode: [{
5721
+ }] }], propDecorators: { parentNode: [{
5591
5722
  type: Input
5723
+ }], searchResultItems: [{
5724
+ type: Input,
5725
+ args: ['clrSearchResultItems']
5726
+ }], searchRequest: [{
5727
+ type: Input,
5728
+ args: ['clrSearchRequest']
5729
+ }], selectionChanged: [{
5730
+ type: Output
5731
+ }], searchItemChanged: [{
5732
+ type: Output
5592
5733
  }] } });
5593
5734
 
5594
5735
  ClarityIcons.addIcons(organizationIcon);
@@ -5597,7 +5738,9 @@ class LocationBarComponent {
5597
5738
  this.root$ = new ReplaySubject();
5598
5739
  this.iconShape = 'organization';
5599
5740
  this.iconTitle = '';
5741
+ this.searchResultItems = [];
5600
5742
  this.selectionChanged = new EventEmitter();
5743
+ this.searchItemChanged = new EventEmitter();
5601
5744
  }
5602
5745
  set roots(roots) {
5603
5746
  const internalRoot = new LocationBarNode(null, null, false);
@@ -5607,75 +5750,43 @@ class LocationBarComponent {
5607
5750
  }
5608
5751
  this.root$.next(internalRoot);
5609
5752
  }
5753
+ ngOnChanges(changes) {
5754
+ if (changes?.searchResultItems) {
5755
+ this.searchResultItems = changes.searchResultItems.currentValue;
5756
+ }
5757
+ }
5610
5758
  onSelectionChanged(selection) {
5611
5759
  this.selectionChanged.emit(selection);
5612
5760
  }
5613
5761
  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" }] }); }
5762
+ 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
5763
  }
5616
5764
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: LocationBarComponent, decorators: [{
5617
5765
  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" }]
5766
+ 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
5767
  }], propDecorators: { iconShape: [{
5620
5768
  type: Input,
5621
5769
  args: ['clrIconShape']
5622
5770
  }], iconTitle: [{
5623
5771
  type: Input,
5624
5772
  args: ['clrIconTitle']
5773
+ }], searchRequest: [{
5774
+ type: Input,
5775
+ args: ['clrSearchRequest']
5776
+ }], searchResultItems: [{
5777
+ type: Input,
5778
+ args: ['clrSearchResultItems']
5625
5779
  }], roots: [{
5626
5780
  type: Input,
5627
5781
  args: ['clrRoots']
5628
5782
  }], selectionChanged: [{
5629
5783
  type: Output,
5630
5784
  args: ['clrSelectionChanged']
5785
+ }], searchItemChanged: [{
5786
+ type: Output,
5787
+ args: ['clrSearchItemChanged']
5631
5788
  }] } });
5632
5789
 
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
5790
  /*
5680
5791
  * Copyright (c) 2018-2022 Porsche Informatik. All Rights Reserved.
5681
5792
  * This software is released under MIT license.
@@ -5694,6 +5805,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
5694
5805
  }]
5695
5806
  }] });
5696
5807
 
5808
+ class ClrLocationBarModule {
5809
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
5810
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, declarations: [LocationBarComponent, LocationBarNodeComponent, LocationBarSearchComponent], imports: [CommonModule,
5811
+ ClrIconModule,
5812
+ ClrDropdownModule,
5813
+ ClrDropdownOverflowModule,
5814
+ ClarityModule,
5815
+ FormsModule,
5816
+ ClrAutocompleteOffModule,
5817
+ ClrFormModule,
5818
+ ClrSearchFieldModule,
5819
+ ReactiveFormsModule], exports: [LocationBarComponent] }); }
5820
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, imports: [CommonModule,
5821
+ ClrIconModule,
5822
+ ClrDropdownModule,
5823
+ ClrDropdownOverflowModule,
5824
+ ClarityModule,
5825
+ FormsModule,
5826
+ ClrAutocompleteOffModule,
5827
+ ClrFormModule,
5828
+ ClrSearchFieldModule,
5829
+ ReactiveFormsModule] }); }
5830
+ }
5831
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrLocationBarModule, decorators: [{
5832
+ type: NgModule,
5833
+ args: [{
5834
+ declarations: [LocationBarComponent, LocationBarNodeComponent, LocationBarSearchComponent],
5835
+ imports: [
5836
+ CommonModule,
5837
+ ClrIconModule,
5838
+ ClrDropdownModule,
5839
+ ClrDropdownOverflowModule,
5840
+ ClarityModule,
5841
+ FormsModule,
5842
+ ClrAutocompleteOffModule,
5843
+ ClrFormModule,
5844
+ ClrSearchFieldModule,
5845
+ ReactiveFormsModule,
5846
+ ],
5847
+ exports: [LocationBarComponent],
5848
+ }]
5849
+ }] });
5850
+
5697
5851
  class DatagridFieldDirective {
5698
5852
  getFieldName() {
5699
5853
  return this.clrDgField ?? this.clrDgFieldKey;
@@ -5927,7 +6081,7 @@ class StatePersistenceKeyDirective {
5927
6081
  this.destroy$.next();
5928
6082
  this.destroy$.complete();
5929
6083
  }
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 }); }
6084
+ 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
6085
  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
6086
  }
5933
6087
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: StatePersistenceKeyDirective, decorators: [{
@@ -5935,7 +6089,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
5935
6089
  args: [{
5936
6090
  selector: '[clrStatePersistenceKey]',
5937
6091
  }]
5938
- }], ctorParameters: () => [{ type: i1$1.ClrDatagrid }], propDecorators: { options: [{
6092
+ }], ctorParameters: () => [{ type: i2.ClrDatagrid }], propDecorators: { options: [{
5939
6093
  type: Input,
5940
6094
  args: ['clrStatePersistenceKey']
5941
6095
  }], useLocalStoreOnly: [{
@@ -6011,7 +6165,7 @@ class ColumnHiddenStatePersistenceDirective {
6011
6165
  this.destroy$.next();
6012
6166
  this.destroy$.complete();
6013
6167
  }
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 }); }
6168
+ 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
6169
  static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: ColumnHiddenStatePersistenceDirective, selector: "[clrDgHideableColumn]", ngImport: i0 }); }
6016
6170
  }
6017
6171
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ColumnHiddenStatePersistenceDirective, decorators: [{
@@ -6023,7 +6177,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
6023
6177
  type: Optional
6024
6178
  }] }, { type: StatePersistenceKeyDirective, decorators: [{
6025
6179
  type: Optional
6026
- }] }, { type: i1$1.ClrDatagrid }, { type: i1$1.ClrDatagridHideableColumn }] });
6180
+ }] }, { type: i2.ClrDatagrid }, { type: i2.ClrDatagridHideableColumn }] });
6027
6181
 
6028
6182
  class ClrDatagridStatePersistenceModule {
6029
6183
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDatagridStatePersistenceModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
@@ -6045,7 +6199,7 @@ class ClrEnumFilterComponent {
6045
6199
  this.emptyValue = translatedValue;
6046
6200
  /* update values if translation set */
6047
6201
  this.setFilteredValues(this.filteredValues);
6048
- if (this.possibleValues.length !== 0) {
6202
+ if (this.possibleValues?.length !== 0) {
6049
6203
  this.setPossibleValues(this.possibleValues);
6050
6204
  }
6051
6205
  }
@@ -6146,7 +6300,7 @@ class ClrEnumFilterComponent {
6146
6300
  return entries.map(entry => entry.value);
6147
6301
  }
6148
6302
  mapValues(values) {
6149
- if (values === null || values.length === 0) {
6303
+ if (!values) {
6150
6304
  return [];
6151
6305
  }
6152
6306
  return values.map(value => this.mapValue(value));
@@ -6157,13 +6311,13 @@ class ClrEnumFilterComponent {
6157
6311
  }
6158
6312
  return value ? { value: value, displayValue: value } : { value: '', displayValue: this.emptyValue };
6159
6313
  }
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"] }] }); }
6314
+ 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 }); }
6315
+ 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
6316
  }
6163
6317
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrEnumFilterComponent, decorators: [{
6164
6318
  type: Component,
6165
6319
  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: [{
6320
+ }], ctorParameters: () => [{ type: i2.ClrDatagridFilter }, { type: i2.ClrDatagrid }], propDecorators: { property: [{
6167
6321
  type: Input,
6168
6322
  args: ['clrProperty']
6169
6323
  }], setEmptyValuesTranslation: [{
@@ -6348,13 +6502,13 @@ class ClrDateFilterComponent {
6348
6502
  equals(other) {
6349
6503
  return other === this;
6350
6504
  }
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]" }] }); }
6505
+ 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 }); }
6506
+ 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
6507
  }
6354
6508
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDateFilterComponent, decorators: [{
6355
6509
  type: Component,
6356
6510
  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: [{
6511
+ }], ctorParameters: () => [{ type: i2.ClrCommonStringsService }, { type: i2.ClrPopoverEventsService }, { type: i2.ClrDatagridFilter }], propDecorators: { property: [{
6358
6512
  type: Input,
6359
6513
  args: ['clrProperty']
6360
6514
  }], maxPlaceholder: [{
@@ -6612,7 +6766,7 @@ class ClrDatepickerComponent {
6612
6766
  this.inputElm.nativeElement.focus();
6613
6767
  }
6614
6768
  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]" }] }); }
6769
+ 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
6770
  }
6617
6771
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDatepickerComponent, decorators: [{
6618
6772
  type: Component,
@@ -7084,12 +7238,12 @@ class ClrAbstractContainer {
7084
7238
  this.daterangeControlStateService = daterangeControlStateService;
7085
7239
  this.isFormControl = true;
7086
7240
  }
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 }); }
7241
+ 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
7242
  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
7243
  }
7090
7244
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrAbstractContainer, decorators: [{
7091
7245
  type: Directive
7092
- }], ctorParameters: () => [{ type: i1$1.ClrLayout, decorators: [{
7246
+ }], ctorParameters: () => [{ type: i2.ClrLayout, decorators: [{
7093
7247
  type: Optional
7094
7248
  }] }, { type: DaterangeControlStateService }], propDecorators: { isFormControl: [{
7095
7249
  type: HostBinding,
@@ -7538,7 +7692,7 @@ class ClrDaterangepickerContainerComponent extends ClrAbstractContainer {
7538
7692
  this.clrPopoverToggleService.open = false;
7539
7693
  }
7540
7694
  }
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 }); }
7695
+ 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
7696
  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
7697
  ClrPopoverToggleService,
7544
7698
  ClrPopoverEventsService,
@@ -7547,7 +7701,7 @@ class ClrDaterangepickerContainerComponent extends ClrAbstractContainer {
7547
7701
  DaterangeService,
7548
7702
  OpenedDatepickersTrackerService,
7549
7703
  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"] }] }); }
7704
+ ], 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
7705
  }
7552
7706
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: ClrDaterangepickerContainerComponent, decorators: [{
7553
7707
  type: Component,
@@ -7560,7 +7714,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
7560
7714
  OpenedDatepickersTrackerService,
7561
7715
  ControlIdService,
7562
7716
  ], 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: [{
7717
+ }], ctorParameters: () => [{ type: i2.ClrPopoverEventsService }, { type: i2.ClrPopoverToggleService }, { type: i2.ClrCommonStringsService }, { type: i2.ClrLayout, decorators: [{
7564
7718
  type: Optional
7565
7719
  }] }, { type: DaterangeControlStateService }, { type: OpenedDatepickersTrackerService }, { type: DaterangeService }, { type: DaterangeParsingService }], propDecorators: { presets: [{
7566
7720
  type: Input