@porscheinformatik/clr-addons 15.0.1 → 15.2.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.
Files changed (49) hide show
  1. package/clr-addons.module.d.ts +2 -1
  2. package/daterangepicker/daterange.constants.d.ts +21 -0
  3. package/daterangepicker/daterangepicker.module.d.ts +17 -0
  4. package/daterangepicker/directives/abstract-container.component.d.ts +53 -0
  5. package/daterangepicker/directives/datepicker/datepicker.component.d.ts +65 -0
  6. package/daterangepicker/directives/daterangepicker/daterangepicker.directive.d.ts +127 -0
  7. package/daterangepicker/directives/daterangepicker-container/daterangepicker-container.component.d.ts +118 -0
  8. package/daterangepicker/directives/if-daterange-error.directive.d.ts +40 -0
  9. package/daterangepicker/index.d.ts +13 -0
  10. package/daterangepicker/interfaces/daterange-preset.interface.d.ts +8 -0
  11. package/daterangepicker/interfaces/daterange.interface.d.ts +12 -0
  12. package/daterangepicker/models/day.model.d.ts +80 -0
  13. package/daterangepicker/models/popover-positions.model.d.ts +20 -0
  14. package/daterangepicker/providers/daterange-control-state.service.d.ts +42 -0
  15. package/daterangepicker/providers/daterange-parsing.service.d.ts +66 -0
  16. package/daterangepicker/providers/daterange.service.d.ts +38 -0
  17. package/daterangepicker/providers/opened-datepickers-tracker.service.d.ts +20 -0
  18. package/daterangepicker/validators/daterange-max.validator.d.ts +32 -0
  19. package/daterangepicker/validators/daterange-min.validator.d.ts +32 -0
  20. package/daterangepicker/validators/daterange-order.validator.d.ts +29 -0
  21. package/daterangepicker/validators/daterange-required.validator.d.ts +29 -0
  22. package/esm2020/clr-addons.module.mjs +8 -4
  23. package/esm2020/daterangepicker/daterange.constants.mjs +27 -0
  24. package/esm2020/daterangepicker/daterangepicker.module.mjs +58 -0
  25. package/esm2020/daterangepicker/directives/abstract-container.component.mjs +104 -0
  26. package/esm2020/daterangepicker/directives/datepicker/datepicker.component.mjs +97 -0
  27. package/esm2020/daterangepicker/directives/daterangepicker/daterangepicker.directive.mjs +256 -0
  28. package/esm2020/daterangepicker/directives/daterangepicker-container/daterangepicker-container.component.mjs +251 -0
  29. package/esm2020/daterangepicker/directives/if-daterange-error.directive.mjs +94 -0
  30. package/esm2020/daterangepicker/index.mjs +14 -0
  31. package/esm2020/daterangepicker/interfaces/daterange-preset.interface.mjs +2 -0
  32. package/esm2020/daterangepicker/interfaces/daterange.interface.mjs +2 -0
  33. package/esm2020/daterangepicker/models/day.model.mjs +99 -0
  34. package/esm2020/daterangepicker/models/popover-positions.model.mjs +66 -0
  35. package/esm2020/daterangepicker/providers/daterange-control-state.service.mjs +62 -0
  36. package/esm2020/daterangepicker/providers/daterange-parsing.service.mjs +206 -0
  37. package/esm2020/daterangepicker/providers/daterange.service.mjs +54 -0
  38. package/esm2020/daterangepicker/providers/opened-datepickers-tracker.service.mjs +36 -0
  39. package/esm2020/daterangepicker/validators/daterange-max.validator.mjs +85 -0
  40. package/esm2020/daterangepicker/validators/daterange-min.validator.mjs +85 -0
  41. package/esm2020/daterangepicker/validators/daterange-order.validator.mjs +75 -0
  42. package/esm2020/daterangepicker/validators/daterange-required.validator.mjs +71 -0
  43. package/esm2020/index.mjs +3 -2
  44. package/fesm2015/clr-addons.mjs +1694 -42
  45. package/fesm2015/clr-addons.mjs.map +1 -1
  46. package/fesm2020/clr-addons.mjs +1674 -42
  47. package/fesm2020/clr-addons.mjs.map +1 -1
  48. package/index.d.ts +1 -0
  49. package/package.json +3 -3
@@ -1,17 +1,17 @@
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, ContentChild, Optional, HostListener, InjectionToken, Inject } from '@angular/core';
2
+ import { Component, NgModule, Injectable, EventEmitter, Input, Output, Directive, ViewChild, ContentChildren, TemplateRef, ViewChildren, HostBinding, ElementRef, Renderer2, forwardRef, ContentChild, Optional, HostListener, InjectionToken, Inject, LOCALE_ID, Self } from '@angular/core';
3
3
  import * as i1 from '@angular/common';
4
- import { CommonModule, DOCUMENT } from '@angular/common';
4
+ import { CommonModule, getLocaleDateFormat, FormatWidth, DOCUMENT } from '@angular/common';
5
5
  import * as i3$1 from '@angular/forms';
6
6
  import { FormsModule, NG_VALIDATORS, NgControl, NG_VALUE_ACCESSOR } from '@angular/forms';
7
- import * as i2 from '@clr/angular';
8
- import { ClarityModule, ClrFormsModule, ClrDropdown, ClrForm, ClrAlert, ClrAxis, ClrSide, ClrAlignment, ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService, ClrIconModule, ClrDropdownModule, ClrDatagridSortOrder, DatagridPropertyComparator, ClrDatagridPagination, ClrDatagridFilter } from '@clr/angular';
7
+ import * as i1$1 from '@clr/angular';
8
+ 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';
9
9
  import { Subject, BehaviorSubject, timer, asyncScheduler, interval, of, ReplaySubject, takeUntil as takeUntil$1, delay } from 'rxjs';
10
10
  import { takeUntil, observeOn, take } from 'rxjs/operators';
11
11
  import * as i3 from '@angular/router';
12
12
  import { RouterModule } from '@angular/router';
13
13
  import { trigger, transition, style, animate, state } from '@angular/animations';
14
- import { ClarityIcons, treeViewIcon, angleIcon, organizationIcon } from '@cds/core/icon';
14
+ import { ClarityIcons, treeViewIcon, angleIcon, organizationIcon, calendarIcon, exclamationCircleIcon, checkCircleIcon, windowCloseIcon } from '@cds/core/icon';
15
15
  import '@cds/core/icon/register.js';
16
16
 
17
17
  /*
@@ -28,7 +28,7 @@ class ClrBackButton {
28
28
  }
29
29
  }
30
30
  ClrBackButton.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrBackButton, deps: [{ token: i1.Location }], target: i0.ɵɵFactoryTarget.Component });
31
- ClrBackButton.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrBackButton, selector: "clr-back-button", ngImport: i0, template: "<button type=\"button\" class=\"btn btn-icon btn-link back-button\" (click)=\"back()\">\n <clr-icon shape=\"arrow\" dir=\"left\" size=\"36\"></clr-icon>\n</button>\n", dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-icon" }] });
31
+ ClrBackButton.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrBackButton, selector: "clr-back-button", ngImport: i0, template: "<button type=\"button\" class=\"btn btn-icon btn-link back-button\" (click)=\"back()\">\n <clr-icon shape=\"arrow\" dir=\"left\" size=\"36\"></clr-icon>\n</button>\n", dependencies: [{ kind: "directive", type: i1$1.ClrIconCustomTag, selector: "clr-icon" }] });
32
32
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrBackButton, decorators: [{
33
33
  type: Component,
34
34
  args: [{ selector: 'clr-back-button', template: "<button type=\"button\" class=\"btn btn-icon btn-link back-button\" (click)=\"back()\">\n <clr-icon shape=\"arrow\" dir=\"left\" size=\"36\"></clr-icon>\n</button>\n" }]
@@ -147,7 +147,7 @@ class ClrCollapseExpandSection {
147
147
  }
148
148
  }
149
149
  ClrCollapseExpandSection.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrCollapseExpandSection, deps: [], target: i0.ɵɵFactoryTarget.Component });
150
- ClrCollapseExpandSection.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrCollapseExpandSection, selector: "clr-collapse-expand-section", inputs: { isCollapsed: ["clrIsCollapsed", "isCollapsed"], disableHeaderStyles: ["clrDisableHeaderStyles", "disableHeaderStyles"] }, 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 <clr-icon shape=\"caret up\" size=\"28\" class=\"ces-caret-icon\" [@rotateIcon]=\"isCollapsed\"></clr-icon>\n </button>\n </ng-template>\n </div>\n <div class=\"ces-subtitle\">\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.ClrIconCustomTag, selector: "clr-icon" }], animations: [
150
+ ClrCollapseExpandSection.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrCollapseExpandSection, selector: "clr-collapse-expand-section", inputs: { isCollapsed: ["clrIsCollapsed", "isCollapsed"], disableHeaderStyles: ["clrDisableHeaderStyles", "disableHeaderStyles"] }, 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 <clr-icon shape=\"caret up\" size=\"28\" class=\"ces-caret-icon\" [@rotateIcon]=\"isCollapsed\"></clr-icon>\n </button>\n </ng-template>\n </div>\n <div class=\"ces-subtitle\">\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.ClrIconCustomTag, selector: "clr-icon" }], animations: [
151
151
  trigger('collapseExpandAnimation', [
152
152
  transition(':enter', [
153
153
  style({ opacity: 0, height: 0, overflow: 'hidden' }),
@@ -260,7 +260,7 @@ class ClrContentPanel {
260
260
  }
261
261
  }
262
262
  ClrContentPanel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrContentPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
263
- ClrContentPanel.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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 <clr-icon class=\"content-panel-close-icon\" shape=\"close\" size=\"36\"></clr-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.ClrIconCustomTag, selector: "clr-icon" }], animations: [
263
+ ClrContentPanel.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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 <clr-icon class=\"content-panel-close-icon\" shape=\"close\" size=\"36\"></clr-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.ClrIconCustomTag, selector: "clr-icon" }], animations: [
264
264
  trigger('slideIn', [
265
265
  transition(':enter', [style({ opacity: 0, width: 0 }), animate('0.2s', style({ opacity: 1, width: '*' }))]),
266
266
  transition(':leave', [style({ opacity: 1, width: '*' }), animate('0.2s', style({ opacity: 0, width: 0 }))]),
@@ -601,7 +601,7 @@ class ClrDotPager {
601
601
  }
602
602
  }
603
603
  ClrDotPager.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDotPager, deps: [], target: i0.ɵɵFactoryTarget.Component });
604
- ClrDotPager.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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"] }] });
604
+ ClrDotPager.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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"] }] });
605
605
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDotPager, decorators: [{
606
606
  type: Component,
607
607
  args: [{ selector: 'clr-dot-pager', host: { '[class.dot-pager]': 'true' }, 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" }]
@@ -878,7 +878,7 @@ class ClrFlowBar {
878
878
  }
879
879
  }
880
880
  ClrFlowBar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrFlowBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
881
- ClrFlowBar.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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 <clr-icon shape=\"caret right\" *ngIf=\"!last\"></clr-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 <clr-icon shape=\"caret down\"></clr-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.ClrIconCustomTag, selector: "clr-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"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
881
+ ClrFlowBar.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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 <clr-icon shape=\"caret right\" *ngIf=\"!last\"></clr-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 <clr-icon shape=\"caret down\"></clr-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.ClrIconCustomTag, selector: "clr-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"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
882
882
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrFlowBar, decorators: [{
883
883
  type: Component,
884
884
  args: [{ selector: 'clr-flow-bar', host: {
@@ -989,7 +989,7 @@ class ClrGenericQuickList {
989
989
  }
990
990
  }
991
991
  ClrGenericQuickList.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrGenericQuickList, deps: [], target: i0.ɵɵFactoryTarget.Component });
992
- ClrGenericQuickList.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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" }, 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\">\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 [disabled]=\"required && allItems.length === 1\"\n (click)=\"removeItem(item)\"\n >\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </ng-container>\n\n <button\n *ngIf=\"!(readonly || readonly === '')\"\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.ClrIconCustomTag, selector: "clr-icon" }] });
992
+ ClrGenericQuickList.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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" }, 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\">\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 [disabled]=\"required && allItems.length === 1\"\n (click)=\"removeItem(item)\"\n >\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </ng-container>\n\n <button\n *ngIf=\"!(readonly || readonly === '')\"\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.ClrIconCustomTag, selector: "clr-icon" }] });
993
993
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrGenericQuickList, decorators: [{
994
994
  type: Component,
995
995
  args: [{ selector: 'clr-generic-quick-list', host: { '[class.generic-quick-list]': 'true', '[class.clr-form-control]': 'true' }, 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\">\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 [disabled]=\"required && allItems.length === 1\"\n (click)=\"removeItem(item)\"\n >\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </ng-container>\n\n <button\n *ngIf=\"!(readonly || readonly === '')\"\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" }]
@@ -1277,7 +1277,7 @@ class ClrMainNavGroup {
1277
1277
  }
1278
1278
  }
1279
1279
  ClrMainNavGroup.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrMainNavGroup, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
1280
- ClrMainNavGroup.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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}}\">{{title}}<clr-icon shape=\"caret down\"></clr-icon></label>\n <div class=\"nav-list dropdown-menu\">\n <ng-content></ng-content>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }] });
1280
+ ClrMainNavGroup.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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}}\">{{title}}<clr-icon shape=\"caret down\"></clr-icon></label>\n <div class=\"nav-list dropdown-menu\">\n <ng-content></ng-content>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1$1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i1$1.ClrLabel, selector: "label", inputs: ["for"] }] });
1281
1281
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrMainNavGroup, decorators: [{
1282
1282
  type: Component,
1283
1283
  args: [{ selector: 'clr-main-nav-group', host: { '[class.main-nav-group]': 'true' }, 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}}\">{{title}}<clr-icon shape=\"caret down\"></clr-icon></label>\n <div class=\"nav-list dropdown-menu\">\n <ng-content></ng-content>\n </div>\n</section>\n" }]
@@ -1694,7 +1694,7 @@ ClrMultilingualSelector.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
1694
1694
  </clr-dropdown-menu>
1695
1695
  </clr-dropdown>
1696
1696
  </div>
1697
- `, 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.ClrIconCustomTag, selector: "clr-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"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] });
1697
+ `, 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.ClrIconCustomTag, selector: "clr-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"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] });
1698
1698
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrMultilingualSelector, decorators: [{
1699
1699
  type: Component,
1700
1700
  args: [{
@@ -1756,7 +1756,7 @@ ClrMultilingualInput.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
1756
1756
  multi: true,
1757
1757
  },
1758
1758
  ControlIdService,
1759
- ], 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 <clr-icon *ngIf=\"showError\" class=\"clr-validate-icon\" shape=\"exclamation-circle\" aria-hidden=\"true\"></clr-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.ClrIconCustomTag, selector: "clr-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"] }] });
1759
+ ], 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 <clr-icon *ngIf=\"showError\" class=\"clr-validate-icon\" shape=\"exclamation-circle\" aria-hidden=\"true\"></clr-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.ClrIconCustomTag, selector: "clr-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"] }] });
1760
1760
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrMultilingualInput, decorators: [{
1761
1761
  type: Component,
1762
1762
  args: [{ selector: 'clr-multilingual-input', providers: [
@@ -1787,7 +1787,7 @@ ClrMultilingualTextarea.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
1787
1787
  multi: true,
1788
1788
  },
1789
1789
  ControlIdService,
1790
- ], 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 <clr-icon *ngIf=\"showError\" class=\"clr-validate-icon\" shape=\"exclamation-circle\" aria-hidden=\"true\"></clr-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.ClrIconCustomTag, selector: "clr-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"] }] });
1790
+ ], 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 <clr-icon *ngIf=\"showError\" class=\"clr-validate-icon\" shape=\"exclamation-circle\" aria-hidden=\"true\"></clr-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.ClrIconCustomTag, selector: "clr-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"] }] });
1791
1791
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrMultilingualTextarea, decorators: [{
1792
1792
  type: Component,
1793
1793
  args: [{ selector: 'clr-multilingual-textarea', providers: [
@@ -1961,7 +1961,7 @@ class ClrNotification {
1961
1961
  }
1962
1962
  }
1963
1963
  ClrNotification.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrNotification, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
1964
- ClrNotification.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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", "clrAlertClosed", "clrAlertType", "clrAlertIcon"], outputs: ["clrAlertClosedChange"] }, { kind: "directive", type: i2.ClrAlertText, selector: ".alert-text" }], animations: [
1964
+ ClrNotification.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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", "clrAlertClosed", "clrAlertType", "clrAlertIcon"], outputs: ["clrAlertClosedChange"] }, { kind: "directive", type: i1$1.ClrAlertText, selector: ".alert-text" }], animations: [
1965
1965
  trigger('slideDown', [
1966
1966
  transition(':enter', [
1967
1967
  style({ transform: 'translateY(-200%)' }),
@@ -2671,7 +2671,7 @@ class ClrPager {
2671
2671
  }
2672
2672
  }
2673
2673
  ClrPager.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrPager, deps: [], target: i0.ɵɵFactoryTarget.Component });
2674
- ClrPager.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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 <clr-icon shape=\"angle left\"></clr-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 <clr-icon shape=\"angle right\"></clr-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.ClrIconCustomTag, selector: "clr-icon" }] });
2674
+ ClrPager.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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 <clr-icon shape=\"angle left\"></clr-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 <clr-icon shape=\"angle right\"></clr-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.ClrIconCustomTag, selector: "clr-icon" }] });
2675
2675
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrPager, decorators: [{
2676
2676
  type: Component,
2677
2677
  args: [{ selector: 'clr-pager', host: { '[class.pager]': 'true' }, template: "<div class=\"btn-group\" *ngIf=\"last > 1\">\n <button class=\"btn pagination-previous\" (click)=\"previous()\" [disabled]=\"page == 1\">\n <clr-icon shape=\"angle left\"></clr-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 <clr-icon shape=\"angle right\"></clr-icon>\n </button>\n</div>\n" }]
@@ -2909,7 +2909,7 @@ class ClrAddOption {
2909
2909
  }
2910
2910
  }
2911
2911
  ClrAddOption.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrAddOption, deps: [], target: i0.ɵɵFactoryTarget.Component });
2912
- ClrAddOption.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrAddOption, selector: "clr-add-option", inputs: { blankOption: "blankOption", value: "value", mandatory: "mandatory", allValues: "allValues", excludedValues: "excludedValues", readonly: "readonly", disabled: "disabled" }, outputs: { valueChanged: "valueChanged", remove: "remove" }, 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 [disabled]=\"trashDisabled() || disabled\"\n (click)=\"remove.emit()\"\n>\n <clr-icon shape=\"trash\"></clr-icon>\n</button>\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.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.ClrIconCustomTag, selector: "clr-icon" }] });
2912
+ ClrAddOption.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrAddOption, selector: "clr-add-option", inputs: { blankOption: "blankOption", value: "value", mandatory: "mandatory", allValues: "allValues", excludedValues: "excludedValues", readonly: "readonly", disabled: "disabled" }, outputs: { valueChanged: "valueChanged", remove: "remove" }, 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 [disabled]=\"trashDisabled() || disabled\"\n (click)=\"remove.emit()\"\n>\n <clr-icon shape=\"trash\"></clr-icon>\n</button>\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.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.ClrIconCustomTag, selector: "clr-icon" }] });
2913
2913
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrAddOption, decorators: [{
2914
2914
  type: Component,
2915
2915
  args: [{ selector: 'clr-add-option', host: { '[class.quick-list-option]': 'true' }, 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 [disabled]=\"trashDisabled() || disabled\"\n (click)=\"remove.emit()\"\n>\n <clr-icon shape=\"trash\"></clr-icon>\n</button>\n" }]
@@ -3225,7 +3225,7 @@ class ClrTreetableActionOverflow {
3225
3225
  this.destroyed$.complete();
3226
3226
  }
3227
3227
  }
3228
- ClrTreetableActionOverflow.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrTreetableActionOverflow, deps: [{ token: i2.ClrPopoverToggleService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
3228
+ ClrTreetableActionOverflow.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrTreetableActionOverflow, deps: [{ token: i1$1.ClrPopoverToggleService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
3229
3229
  ClrTreetableActionOverflow.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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: `
3230
3230
  <ng-container *ngIf="!empty">
3231
3231
  <button class="treetable-action-trigger" clrPopoverAnchor clrPopoverOpenCloseButton>
@@ -3240,7 +3240,7 @@ ClrTreetableActionOverflow.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0
3240
3240
  <ng-content></ng-content>
3241
3241
  </div>
3242
3242
  </ng-container>
3243
- `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-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"] }] });
3243
+ `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ClrIconCustomTag, selector: "clr-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"] }] });
3244
3244
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrTreetableActionOverflow, decorators: [{
3245
3245
  type: Component,
3246
3246
  args: [{
@@ -3267,7 +3267,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImpor
3267
3267
  role: 'cell',
3268
3268
  },
3269
3269
  }]
3270
- }], ctorParameters: function () { return [{ type: i2.ClrPopoverToggleService }, { type: i0.NgZone }]; }, propDecorators: { empty: [{
3270
+ }], ctorParameters: function () { return [{ type: i1$1.ClrPopoverToggleService }, { type: i0.NgZone }]; }, propDecorators: { empty: [{
3271
3271
  type: Input
3272
3272
  }] } });
3273
3273
 
@@ -3319,7 +3319,7 @@ class ClrTreetableRow {
3319
3319
  }
3320
3320
  }
3321
3321
  ClrTreetableRow.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrTreetableRow, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
3322
- ClrTreetableRow.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrTreetableRow, selector: "clr-tt-row", inputs: { expanded: ["clrExpanded", "expanded"], clickable: ["clrClickable", "clickable"], clrExpandable: "clrExpandable" }, 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-2021 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': clickable && expandable}\"\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=\"isExpandable()\">\n <button type=\"button\" class=\"treetable-expandable-caret-button\" (click)=\"onCaretClick()\">\n <clr-icon\n shape=\"caret\"\n [attr.dir]=\"expanded ? 'down' : 'right'\"\n class=\"treetable-expandable-caret-icon\"\n ></clr-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.ClrIconCustomTag, selector: "clr-icon" }, { kind: "component", type: ClrTreetableActionOverflow, selector: "clr-tt-action-overflow", inputs: ["empty"] }], animations: [
3322
+ ClrTreetableRow.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrTreetableRow, selector: "clr-tt-row", inputs: { expanded: ["clrExpanded", "expanded"], clickable: ["clrClickable", "clickable"], clrExpandable: "clrExpandable" }, 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-2021 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': clickable && expandable}\"\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=\"isExpandable()\">\n <button type=\"button\" class=\"treetable-expandable-caret-button\" (click)=\"onCaretClick()\">\n <clr-icon\n shape=\"caret\"\n [attr.dir]=\"expanded ? 'down' : 'right'\"\n class=\"treetable-expandable-caret-icon\"\n ></clr-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.ClrIconCustomTag, selector: "clr-icon" }, { kind: "component", type: ClrTreetableActionOverflow, selector: "clr-tt-action-overflow", inputs: ["empty"] }], animations: [
3323
3323
  trigger('collapseExpandAnimation', [
3324
3324
  state('false', style({ display: 'none' })),
3325
3325
  state('true', style({ display: 'block' })),
@@ -3800,7 +3800,7 @@ class ClrViewEditSection {
3800
3800
  }
3801
3801
  }
3802
3802
  ClrViewEditSection.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrViewEditSection, deps: [], target: i0.ɵɵFactoryTarget.Component });
3803
- ClrViewEditSection.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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 <clr-icon shape=\"caret up\" size=\"20\" class=\"ces-caret-icon\" [@rotateIcon]=\"_isCollapsed\"></clr-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 <clr-icon class=\"ves-edit-icon\" [attr.shape]=\"_editIcon\" size=\"20\"></clr-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.ClrIconCustomTag, selector: "clr-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: [
3803
+ ClrViewEditSection.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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 <clr-icon shape=\"caret up\" size=\"20\" class=\"ces-caret-icon\" [@rotateIcon]=\"_isCollapsed\"></clr-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 <clr-icon class=\"ves-edit-icon\" [attr.shape]=\"_editIcon\" size=\"20\"></clr-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.ClrIconCustomTag, selector: "clr-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: [
3804
3804
  trigger('collapseExpandAnimation', [
3805
3805
  transition(':enter', [
3806
3806
  style({ opacity: 0, height: 0, overflow: 'hidden' }),
@@ -4150,7 +4150,7 @@ class ClrHistory {
4150
4150
  }
4151
4151
  }
4152
4152
  ClrHistory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrHistory, deps: [{ token: ClrHistoryService }], target: i0.ɵɵFactoryTarget.Component });
4153
- ClrHistory.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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 <clr-icon shape=\"history\" size=\"24\"></clr-icon>\n <clr-icon shape=\"caret down\" size=\"12\"></clr-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.ClrIconCustomTag, selector: "clr-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"] }] });
4153
+ ClrHistory.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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 <clr-icon shape=\"history\" size=\"24\"></clr-icon>\n <clr-icon shape=\"caret down\" size=\"12\"></clr-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.ClrIconCustomTag, selector: "clr-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"] }] });
4154
4154
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrHistory, decorators: [{
4155
4155
  type: Component,
4156
4156
  args: [{ selector: 'clr-history', template: "<clr-dropdown>\n <button type=\"button\" class=\"btn btn-icon btn-link\" clrDropdownTrigger>\n <clr-icon shape=\"history\" size=\"24\"></clr-icon>\n <clr-icon shape=\"caret down\" size=\"12\"></clr-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" }]
@@ -4322,7 +4322,7 @@ class ClrBrandAvatar {
4322
4322
  }
4323
4323
  ClrBrandAvatar.DEFAULT_ICON_SHAPE = 'new-car-private';
4324
4324
  ClrBrandAvatar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrBrandAvatar, deps: [], target: i0.ɵɵFactoryTarget.Component });
4325
- ClrBrandAvatar.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrBrandAvatar, selector: "clr-brand-avatar", inputs: { brand: ["clrBrand", "brand"] }, 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 <clr-icon [attr.size]=\"23\" [attr.shape]=\"getShape()\"></clr-icon>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-icon" }] });
4325
+ ClrBrandAvatar.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrBrandAvatar, selector: "clr-brand-avatar", inputs: { brand: ["clrBrand", "brand"] }, 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 <clr-icon [attr.size]=\"23\" [attr.shape]=\"getShape()\"></clr-icon>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ClrIconCustomTag, selector: "clr-icon" }] });
4326
4326
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrBrandAvatar, decorators: [{
4327
4327
  type: Component,
4328
4328
  args: [{ selector: 'clr-brand-avatar', template: "<div class=\"brand-avatar-rectangle\">\n <div #avatar class=\"brand-avatar-icon-container\">\n <clr-icon [attr.size]=\"23\" [attr.shape]=\"getShape()\"></clr-icon>\n </div>\n</div>\n" }]
@@ -4500,7 +4500,7 @@ class LocationBarNodeComponent {
4500
4500
  }
4501
4501
  }
4502
4502
  LocationBarNodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: LocationBarNodeComponent, deps: [{ token: CONTENT_PROVIDER, optional: true }], target: i0.ɵɵFactoryTarget.Component });
4503
- LocationBarNodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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: 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"] }, { kind: "component", type: LocationBarNodeComponent, selector: "clr-location-bar-node", inputs: ["parentNode"], outputs: ["selectionChanged"] }] });
4503
+ LocationBarNodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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"] }, { kind: "component", type: LocationBarNodeComponent, selector: "clr-location-bar-node", inputs: ["parentNode"], outputs: ["selectionChanged"] }] });
4504
4504
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: LocationBarNodeComponent, decorators: [{
4505
4505
  type: Component,
4506
4506
  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" }]
@@ -4538,7 +4538,7 @@ class LocationBarComponent {
4538
4538
  }
4539
4539
  }
4540
4540
  LocationBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: LocationBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4541
- LocationBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: LocationBarNodeComponent, selector: "clr-location-bar-node", inputs: ["parentNode"], outputs: ["selectionChanged"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
4541
+ LocationBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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" }] });
4542
4542
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: LocationBarComponent, decorators: [{
4543
4543
  type: Component,
4544
4544
  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" }]
@@ -4853,14 +4853,14 @@ class StatePersistenceKeyDirective {
4853
4853
  this.destroy$.complete();
4854
4854
  }
4855
4855
  }
4856
- StatePersistenceKeyDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: StatePersistenceKeyDirective, deps: [{ token: i2.ClrDatagrid }], target: i0.ɵɵFactoryTarget.Directive });
4856
+ StatePersistenceKeyDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: StatePersistenceKeyDirective, deps: [{ token: i1$1.ClrDatagrid }], target: i0.ɵɵFactoryTarget.Directive });
4857
4857
  StatePersistenceKeyDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", 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 });
4858
4858
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: StatePersistenceKeyDirective, decorators: [{
4859
4859
  type: Directive,
4860
4860
  args: [{
4861
4861
  selector: '[clrStatePersistenceKey]',
4862
4862
  }]
4863
- }], ctorParameters: function () { return [{ type: i2.ClrDatagrid }]; }, propDecorators: { options: [{
4863
+ }], ctorParameters: function () { return [{ type: i1$1.ClrDatagrid }]; }, propDecorators: { options: [{
4864
4864
  type: Input,
4865
4865
  args: ['clrStatePersistenceKey']
4866
4866
  }], useLocalStoreOnly: [{
@@ -4940,7 +4940,7 @@ class ColumnHiddenStatePersistenceDirective {
4940
4940
  this.destroy$.complete();
4941
4941
  }
4942
4942
  }
4943
- ColumnHiddenStatePersistenceDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ColumnHiddenStatePersistenceDirective, deps: [{ token: DatagridFieldDirective, optional: true }, { token: StatePersistenceKeyDirective, optional: true }, { token: i2.ClrDatagrid }, { token: i2.ClrDatagridHideableColumn }], target: i0.ɵɵFactoryTarget.Directive });
4943
+ ColumnHiddenStatePersistenceDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", 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 });
4944
4944
  ColumnHiddenStatePersistenceDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: ColumnHiddenStatePersistenceDirective, selector: "[clrDgHideableColumn]", ngImport: i0 });
4945
4945
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ColumnHiddenStatePersistenceDirective, decorators: [{
4946
4946
  type: Directive,
@@ -4952,7 +4952,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImpor
4952
4952
  type: Optional
4953
4953
  }] }, { type: StatePersistenceKeyDirective, decorators: [{
4954
4954
  type: Optional
4955
- }] }, { type: i2.ClrDatagrid }, { type: i2.ClrDatagridHideableColumn }];
4955
+ }] }, { type: i1$1.ClrDatagrid }, { type: i1$1.ClrDatagridHideableColumn }];
4956
4956
  } });
4957
4957
 
4958
4958
  class ClrDatagridStatePersistenceModule {
@@ -5023,12 +5023,12 @@ class ClrEnumFilterComponent {
5023
5023
  this.destroyed$.complete();
5024
5024
  }
5025
5025
  }
5026
- ClrEnumFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrEnumFilterComponent, deps: [{ token: i2.ClrDatagridFilter }, { token: i2.ClrDatagrid }], target: i0.ɵɵFactoryTarget.Component });
5027
- ClrEnumFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrEnumFilterComponent, selector: "clr-enum-filter", inputs: { property: ["clrProperty", "property"], value: ["clrFilterValues", "value"], clrPossibleValues: "clrPossibleValues" }, outputs: { clrFilterValuesChange: "clrFilterValuesChange" }, ngImport: i0, template: "<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 }}\"\n name=\"possibleValue\"\n [ngModel]=\"filteredValues.includes(possibleValue)\"\n (ngModelChange)=\"onChange(possibleValue, $event)\"\n />\n <label>{{ possibleValue }}</label>\n </clr-checkbox-wrapper>\n</clr-checkbox-container>\n", styles: [".filter-selection{margin-top:0}\n"], dependencies: [{ 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"] }] });
5026
+ ClrEnumFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrEnumFilterComponent, deps: [{ token: i1$1.ClrDatagridFilter }, { token: i1$1.ClrDatagrid }], target: i0.ɵɵFactoryTarget.Component });
5027
+ ClrEnumFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrEnumFilterComponent, selector: "clr-enum-filter", inputs: { property: ["clrProperty", "property"], value: ["clrFilterValues", "value"], clrPossibleValues: "clrPossibleValues" }, outputs: { clrFilterValuesChange: "clrFilterValuesChange" }, ngImport: i0, template: "<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 }}\"\n name=\"possibleValue\"\n [ngModel]=\"filteredValues.includes(possibleValue)\"\n (ngModelChange)=\"onChange(possibleValue, $event)\"\n />\n <label>{{ possibleValue }}</label>\n </clr-checkbox-wrapper>\n</clr-checkbox-container>\n", styles: [".filter-selection{margin-top:0}\n"], dependencies: [{ 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"] }] });
5028
5028
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrEnumFilterComponent, decorators: [{
5029
5029
  type: Component,
5030
5030
  args: [{ selector: 'clr-enum-filter', template: "<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 }}\"\n name=\"possibleValue\"\n [ngModel]=\"filteredValues.includes(possibleValue)\"\n (ngModelChange)=\"onChange(possibleValue, $event)\"\n />\n <label>{{ possibleValue }}</label>\n </clr-checkbox-wrapper>\n</clr-checkbox-container>\n", styles: [".filter-selection{margin-top:0}\n"] }]
5031
- }], ctorParameters: function () { return [{ type: i2.ClrDatagridFilter }, { type: i2.ClrDatagrid }]; }, propDecorators: { property: [{
5031
+ }], ctorParameters: function () { return [{ type: i1$1.ClrDatagridFilter }, { type: i1$1.ClrDatagrid }]; }, propDecorators: { property: [{
5032
5032
  type: Input,
5033
5033
  args: ['clrProperty']
5034
5034
  }], value: [{
@@ -5204,12 +5204,12 @@ class ClrDateFilterComponent {
5204
5204
  return other === this;
5205
5205
  }
5206
5206
  }
5207
- ClrDateFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDateFilterComponent, deps: [{ token: i2.ClrCommonStringsService }, { token: i2.ClrPopoverEventsService }, { token: i2.ClrDatagridFilter }], target: i0.ɵɵFactoryTarget.Component });
5208
- ClrDateFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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: "<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: [""], dependencies: [{ 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]" }] });
5207
+ ClrDateFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDateFilterComponent, deps: [{ token: i1$1.ClrCommonStringsService }, { token: i1$1.ClrPopoverEventsService }, { token: i1$1.ClrDatagridFilter }], target: i0.ɵɵFactoryTarget.Component });
5208
+ ClrDateFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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: "<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: [""], dependencies: [{ 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]" }] });
5209
5209
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDateFilterComponent, decorators: [{
5210
5210
  type: Component,
5211
5211
  args: [{ selector: 'clr-date-filter', template: "<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" }]
5212
- }], ctorParameters: function () { return [{ type: i2.ClrCommonStringsService }, { type: i2.ClrPopoverEventsService }, { type: i2.ClrDatagridFilter }]; }, propDecorators: { property: [{
5212
+ }], ctorParameters: function () { return [{ type: i1$1.ClrCommonStringsService }, { type: i1$1.ClrPopoverEventsService }, { type: i1$1.ClrDatagridFilter }]; }, propDecorators: { property: [{
5213
5213
  type: Input,
5214
5214
  args: ['clrProperty']
5215
5215
  }], maxPlaceholder: [{
@@ -5240,8 +5240,1657 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImpor
5240
5240
  }]
5241
5241
  }] });
5242
5242
 
5243
+ /**
5244
+ * Day model.
5245
+ * Takes care of keeping records of full days, without the times & timezone issues.
5246
+ */
5247
+ class DayModel {
5248
+ constructor(...args) {
5249
+ if (args[0] instanceof Date) {
5250
+ const date = args[0];
5251
+ this.year = date.getFullYear();
5252
+ this.month = date.getMonth();
5253
+ this.date = date.getDate();
5254
+ }
5255
+ else if (typeof args[0] === 'string') {
5256
+ const [year, month, day] = args[0].split('-').map(n => parseInt(n, 10));
5257
+ this.year = year;
5258
+ this.month = month - 1;
5259
+ this.date = day;
5260
+ }
5261
+ else {
5262
+ this.year = args[0];
5263
+ this.month = args[1];
5264
+ this.date = args[2];
5265
+ }
5266
+ }
5267
+ /**
5268
+ * Checks if the passed value is equal to current day model.
5269
+ * @param value - Day model.
5270
+ * @returns Wether value is equal to current day model.
5271
+ */
5272
+ isEqual(value) {
5273
+ if (value) {
5274
+ return this.year === value.year && this.month === value.month && this.date === value.date;
5275
+ }
5276
+ return false;
5277
+ }
5278
+ /**
5279
+ * Increment day model with date value.
5280
+ * @param value - Incremental date value.
5281
+ * @returns Updated day model with incremented date value.
5282
+ */
5283
+ incrementBy(value) {
5284
+ // Creating new Javascript Date object to increment because
5285
+ // it will automatically take care of switching to next or previous
5286
+ // months & years without we having to worry about it.
5287
+ const date = new Date(this.year, this.month, this.date + value);
5288
+ this.year = date.getFullYear();
5289
+ this.month = date.getMonth();
5290
+ this.date = date.getDate();
5291
+ return this;
5292
+ }
5293
+ /**
5294
+ * Checks if current day model is after value.
5295
+ * @param value - Day model.
5296
+ * @returns Wether current day model is after value.
5297
+ */
5298
+ isAfter(value) {
5299
+ return this.toDate() > value.toDate();
5300
+ }
5301
+ /**
5302
+ * Checks if current day model is before value.
5303
+ * @param value - Day model.
5304
+ * @returns Wether current day model is before value.
5305
+ */
5306
+ isBefore(value) {
5307
+ return this.toDate() < value.toDate();
5308
+ }
5309
+ /**
5310
+ * Clones the current day model.
5311
+ * @returns Cloned day model.
5312
+ */
5313
+ clone() {
5314
+ return new DayModel(this.year, this.month, this.date);
5315
+ }
5316
+ /**
5317
+ * Convert to Javascript Date object.
5318
+ * @returns Javascript Date object.
5319
+ */
5320
+ toDate() {
5321
+ return new Date(this.year, this.month, this.date);
5322
+ }
5323
+ /**
5324
+ * To HTML5 date spec string.
5325
+ * See https://clarity.design/documentation/datepicker
5326
+ * @returns Date as HTML5 spec string.
5327
+ */
5328
+ toHTML5SpecDateString() {
5329
+ // The clarity date picker uses the format 'YYYY-MM-DD'.
5330
+ return `${this.year}-${this.pad(this.month + 1)}-${this.pad(this.date)}`;
5331
+ }
5332
+ /**
5333
+ * String padding with zeros.
5334
+ * @param num - Number to pad.
5335
+ * @returns Padded string.
5336
+ */
5337
+ pad(num) {
5338
+ return num < 10 ? `0${num}` : `${num}`;
5339
+ }
5340
+ }
5341
+
5342
+ /**
5343
+ * Keeps track of how many Clarity Datepicker there are open.
5344
+ * This is needed for the ClrDaterangepickerContainerComponent, to know when to close the popover.
5345
+ */
5346
+ class OpenedDatepickersTrackerService {
5347
+ constructor() {
5348
+ this.openedDatepickersCount = 0;
5349
+ /**
5350
+ * Event triggered when value changes.
5351
+ */
5352
+ this.valueChange = new EventEmitter();
5353
+ }
5354
+ /**
5355
+ * Tracks an opened datepicker.
5356
+ * @param opened - Opened state.
5357
+ */
5358
+ track(opened) {
5359
+ if (opened) {
5360
+ this.openedDatepickersCount++;
5361
+ }
5362
+ else {
5363
+ this.openedDatepickersCount--;
5364
+ }
5365
+ this.openedDatepickersCount = Math.max(0, this.openedDatepickersCount);
5366
+ this.valueChange.emit(this.openedDatepickersCount !== 0);
5367
+ }
5368
+ }
5369
+ OpenedDatepickersTrackerService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: OpenedDatepickersTrackerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
5370
+ OpenedDatepickersTrackerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: OpenedDatepickersTrackerService, providedIn: 'root' });
5371
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: OpenedDatepickersTrackerService, decorators: [{
5372
+ type: Injectable,
5373
+ args: [{ providedIn: 'root' }]
5374
+ }] });
5375
+
5376
+ class ClrDatepickerComponent {
5377
+ constructor(openedDatepickersTrackerService) {
5378
+ this.openedDatepickersTrackerService = openedDatepickersTrackerService;
5379
+ /**
5380
+ * Text label.
5381
+ */
5382
+ this.label = 'Date';
5383
+ /**
5384
+ * Minimum date that can be selected.
5385
+ */
5386
+ this.minDate = undefined;
5387
+ /**
5388
+ * Maximum date that can be selected.
5389
+ */
5390
+ this.maxDate = undefined;
5391
+ /**
5392
+ * Event triggered when value changes.
5393
+ */
5394
+ this.valueChange = new EventEmitter();
5395
+ /** List of subscriptions to later destroy. */
5396
+ this.subscriptions = [];
5397
+ }
5398
+ /**
5399
+ * Get date.
5400
+ * @returns JavaScript Date object.
5401
+ */
5402
+ get date() {
5403
+ var _a;
5404
+ return (_a = this.value) === null || _a === void 0 ? void 0 : _a.toDate();
5405
+ }
5406
+ /**
5407
+ * Set date.
5408
+ */
5409
+ set date(val) {
5410
+ this.value = val == null ? null : new DayModel(val);
5411
+ this.valueChange.emit(this.value);
5412
+ }
5413
+ /**
5414
+ * Minimum date as attribute string.
5415
+ * @returns Minimum date as attribute string.
5416
+ */
5417
+ get minDateAttr() {
5418
+ var _a;
5419
+ return (_a = this.minDate) === null || _a === void 0 ? void 0 : _a.toHTML5SpecDateString();
5420
+ }
5421
+ /**
5422
+ * Maximum date as attribute string.
5423
+ * @returns Maximum date as attribute string.
5424
+ */
5425
+ get maxDateAttr() {
5426
+ var _a;
5427
+ return (_a = this.maxDate) === null || _a === void 0 ? void 0 : _a.toHTML5SpecDateString();
5428
+ }
5429
+ ngAfterViewInit() {
5430
+ // eslint-disable-next-line dot-notation -- Need access to this private property.
5431
+ const toggleService = this.clrDateContainer['toggleService'];
5432
+ this.subscriptions.push(toggleService.openChange.subscribe(openState => {
5433
+ this.openedDatepickersTrackerService.track(openState);
5434
+ }));
5435
+ }
5436
+ ngOnDestroy() {
5437
+ this.subscriptions.forEach(subscription => subscription.unsubscribe());
5438
+ }
5439
+ /**
5440
+ * Focus input.
5441
+ */
5442
+ focus() {
5443
+ this.inputElm.nativeElement.focus();
5444
+ }
5445
+ }
5446
+ ClrDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDatepickerComponent, deps: [{ token: OpenedDatepickersTrackerService }], target: i0.ɵɵFactoryTarget.Component });
5447
+ ClrDatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", 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]" }] });
5448
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDatepickerComponent, decorators: [{
5449
+ type: Component,
5450
+ args: [{ selector: 'clr-datepicker', 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" }]
5451
+ }], ctorParameters: function () { return [{ type: OpenedDatepickersTrackerService }]; }, propDecorators: { value: [{
5452
+ type: Input
5453
+ }], label: [{
5454
+ type: Input
5455
+ }], minDate: [{
5456
+ type: Input
5457
+ }], maxDate: [{
5458
+ type: Input
5459
+ }], inputElm: [{
5460
+ type: ViewChild,
5461
+ args: ['inputElm']
5462
+ }], clrDateContainer: [{
5463
+ type: ViewChild,
5464
+ args: [ClrDateContainer]
5465
+ }], valueChange: [{
5466
+ type: Output
5467
+ }] } });
5468
+
5469
+ const USER_INPUT_REGEX = /\d+/g;
5470
+ // https://en.wikipedia.org/wiki/Date_format_by_country
5471
+ const LITTLE_ENDIAN_REGEX = /d+.+m+.+y+/i;
5472
+ const MIDDLE_ENDIAN_REGEX = /m+.+d+.+y+/i;
5473
+ const DELIMITER_REGEX = /d+|m+|y+/i;
5474
+ const YEAR = 'YYYY';
5475
+ const MONTH = 'MM';
5476
+ const DATE = 'DD';
5477
+ const LITTLE_ENDIAN = {
5478
+ name: 'LITTLE_ENDIAN',
5479
+ format: [DATE, MONTH, YEAR],
5480
+ };
5481
+ const MIDDLE_ENDIAN = {
5482
+ name: 'MIDDLE_ENDIAN',
5483
+ format: [MONTH, DATE, YEAR],
5484
+ };
5485
+ const BIG_ENDIAN = {
5486
+ name: 'BIG_ENDIAN',
5487
+ format: [YEAR, MONTH, DATE],
5488
+ };
5489
+ /** Default separator text. */
5490
+ const SEPARATOR_TEXT_DEFAULT = ' - ';
5491
+ const TRANSLATIONS = {
5492
+ from: 'From',
5493
+ to: 'To',
5494
+ };
5495
+
5496
+ /**
5497
+ * Popover positions.
5498
+ * https://github.com/vmware-clarity/ng-clarity/blob/f1a668086bf88bcf5ef1cd36b0d150e45e88def7/projects/angular/src/utils/popover/enums/positions.enum.ts
5499
+ */
5500
+ class PopoverPositions {
5501
+ }
5502
+ PopoverPositions.options = [
5503
+ 'bottom-left',
5504
+ 'bottom-right',
5505
+ 'left-bottom',
5506
+ 'left-top',
5507
+ 'right-bottom',
5508
+ 'right-top',
5509
+ 'top-left',
5510
+ 'top-right',
5511
+ ];
5512
+ PopoverPositions['bottom-left'] = {
5513
+ axis: ClrAxis.VERTICAL,
5514
+ side: ClrSide.AFTER,
5515
+ anchor: ClrAlignment.START,
5516
+ content: ClrAlignment.START,
5517
+ };
5518
+ PopoverPositions['bottom-right'] = {
5519
+ axis: ClrAxis.VERTICAL,
5520
+ side: ClrSide.AFTER,
5521
+ anchor: ClrAlignment.END,
5522
+ content: ClrAlignment.END,
5523
+ };
5524
+ PopoverPositions['left-bottom'] = {
5525
+ axis: ClrAxis.HORIZONTAL,
5526
+ side: ClrSide.BEFORE,
5527
+ anchor: ClrAlignment.START,
5528
+ content: ClrAlignment.START,
5529
+ };
5530
+ PopoverPositions['left-top'] = {
5531
+ axis: ClrAxis.HORIZONTAL,
5532
+ side: ClrSide.BEFORE,
5533
+ anchor: ClrAlignment.CENTER,
5534
+ content: ClrAlignment.END,
5535
+ };
5536
+ PopoverPositions['right-bottom'] = {
5537
+ axis: ClrAxis.HORIZONTAL,
5538
+ side: ClrSide.AFTER,
5539
+ anchor: ClrAlignment.START,
5540
+ content: ClrAlignment.START,
5541
+ };
5542
+ PopoverPositions['right-top'] = {
5543
+ axis: ClrAxis.HORIZONTAL,
5544
+ side: ClrSide.AFTER,
5545
+ anchor: ClrAlignment.CENTER,
5546
+ content: ClrAlignment.END,
5547
+ };
5548
+ PopoverPositions['top-left'] = {
5549
+ axis: ClrAxis.VERTICAL,
5550
+ side: ClrSide.BEFORE,
5551
+ anchor: ClrAlignment.START,
5552
+ content: ClrAlignment.START,
5553
+ };
5554
+ PopoverPositions['top-right'] = {
5555
+ axis: ClrAxis.VERTICAL,
5556
+ side: ClrSide.BEFORE,
5557
+ anchor: ClrAlignment.END,
5558
+ content: ClrAlignment.END,
5559
+ };
5560
+
5561
+ /**
5562
+ * Daterange control state service.
5563
+ * Stores data for communication between daterange container and input.
5564
+ */
5565
+ class DaterangeControlStateService {
5566
+ constructor() {
5567
+ /** Disabled control state. */
5568
+ this.disabled = false;
5569
+ /** Focused. */
5570
+ this.focused = false;
5571
+ /** List of validation errors. */
5572
+ this.errors = null;
5573
+ this._invalid = false;
5574
+ this._touched = false;
5575
+ /**
5576
+ * Event triggered when status changes.
5577
+ */
5578
+ this.statusChange = new EventEmitter();
5579
+ }
5580
+ /**
5581
+ * Control invalid status.
5582
+ * @returns Control invalid status.
5583
+ */
5584
+ get invalid() {
5585
+ return this._invalid;
5586
+ }
5587
+ /**
5588
+ * Touched.
5589
+ * @returns Touched.
5590
+ */
5591
+ get touched() {
5592
+ return this._touched;
5593
+ }
5594
+ /**
5595
+ * Update status.
5596
+ * Only for valid & invalid status changes.
5597
+ * And only if there was a real change.
5598
+ * Also updates errors list.
5599
+ * Emits `statusChange` event.
5600
+ * @param control
5601
+ */
5602
+ updateStatus(control) {
5603
+ this._touched = control.touched;
5604
+ // We only care about valid & invalid status changes.
5605
+ // There is an bug where `ClrDaterangepickerDirective.writeValue` is called twice with same value (`null`).
5606
+ // Setting ` && (control.touched || control.dirty)` in next if-statement will hide the errors,
5607
+ // but the control will still be invalid with errors (just hidden).
5608
+ if (['VALID', 'INVALID'].includes(control.status)) {
5609
+ this.errors = control.errors;
5610
+ this._invalid = control.invalid;
5611
+ this.statusChange.emit(this._invalid);
5612
+ }
5613
+ }
5614
+ }
5615
+ DaterangeControlStateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DaterangeControlStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
5616
+ DaterangeControlStateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DaterangeControlStateService });
5617
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DaterangeControlStateService, decorators: [{
5618
+ type: Injectable
5619
+ }] });
5620
+
5621
+ /**
5622
+ * Daterange service.
5623
+ * Keeps track of daterange related values.
5624
+ */
5625
+ class DaterangeService {
5626
+ constructor() {
5627
+ /** Minimum date that can be selected. */
5628
+ this.minDate = null;
5629
+ /** Maximum date that can be selected. */
5630
+ this.maxDate = null;
5631
+ this._selectedDaterange = null;
5632
+ /**
5633
+ * Event triggered when value changes.
5634
+ */
5635
+ this.valueChange = new EventEmitter();
5636
+ }
5637
+ /**
5638
+ * Selected daterange value.
5639
+ * @returns Selected daterange value.
5640
+ */
5641
+ get selectedDaterange() {
5642
+ return this._selectedDaterange;
5643
+ }
5644
+ /**
5645
+ * Set selected daterange value.
5646
+ * @param value - New selected daterange value.
5647
+ * @param triggerEvent - Trigger change event (default true).
5648
+ */
5649
+ updateSelectedDaterange(value, triggerEvent = true) {
5650
+ this._selectedDaterange = value;
5651
+ if (triggerEvent) {
5652
+ this.valueChange.emit(value);
5653
+ }
5654
+ }
5655
+ /**
5656
+ * Checks if daterange is valid.
5657
+ * Daterange is considered invalid when it's empty, or when one of it's properties is absent.
5658
+ * @returns Wether daterange is valid.
5659
+ */
5660
+ isValid() {
5661
+ if (this._selectedDaterange == null || this._selectedDaterange.from == null || this._selectedDaterange.to == null) {
5662
+ return false;
5663
+ }
5664
+ return true;
5665
+ }
5666
+ }
5667
+ DaterangeService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DaterangeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
5668
+ DaterangeService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DaterangeService });
5669
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DaterangeService, decorators: [{
5670
+ type: Injectable
5671
+ }] });
5672
+
5673
+ class ClrAbstractContainer {
5674
+ constructor(clrLayout, daterangeControlStateService) {
5675
+ this.clrLayout = clrLayout;
5676
+ this.daterangeControlStateService = daterangeControlStateService;
5677
+ this.isFormControl = true;
5678
+ }
5679
+ /**
5680
+ * Detect if container is not part of an vertical form to apply correct grid classes.
5681
+ */
5682
+ get addLayoutGrid() {
5683
+ var _a, _b;
5684
+ return !((_b = (_a = this.clrLayout) === null || _a === void 0 ? void 0 : _a.layoutService) === null || _b === void 0 ? void 0 : _b.isVertical());
5685
+ }
5686
+ /**
5687
+ * Wether to show the helper control.
5688
+ * @returns Wether to show the helper control.
5689
+ */
5690
+ get showHelper() {
5691
+ if (this.controlHelperComponent == null) {
5692
+ return false;
5693
+ }
5694
+ // Helper Component exist and the state of the form is NONE (not touched).
5695
+ if (!this.daterangeControlStateService.touched) {
5696
+ return true;
5697
+ }
5698
+ // Or there is no success component but the state of the form is VALID - show helper information.
5699
+ if (this.controlSuccessComponent == null &&
5700
+ this.daterangeControlStateService.touched &&
5701
+ !this.daterangeControlStateService.invalid) {
5702
+ return true;
5703
+ }
5704
+ // Or there is no error component but the state of the form is INVALID - show helper information.
5705
+ if (this.controlErrorComponent == null && this.daterangeControlStateService.invalid) {
5706
+ return true;
5707
+ }
5708
+ return false;
5709
+ }
5710
+ /**
5711
+ * Wether to show the valid control.
5712
+ * @returns Wether to show the valid control.
5713
+ */
5714
+ get showValid() {
5715
+ return !this.daterangeControlStateService.invalid && !!this.controlSuccessComponent;
5716
+ }
5717
+ /**
5718
+ * Wether to show the invalid control.
5719
+ * @returns Wether to show the invalid control.
5720
+ */
5721
+ get showInvalid() {
5722
+ return this.daterangeControlStateService.invalid && !!this.controlErrorComponent;
5723
+ }
5724
+ /**
5725
+ * Disabled state.
5726
+ * @returns Disabled state.
5727
+ */
5728
+ get disabled() {
5729
+ return this.daterangeControlStateService.disabled;
5730
+ }
5731
+ /**
5732
+ * If control is focused.
5733
+ * @returns Wether control is focused.
5734
+ */
5735
+ get focus() {
5736
+ return this.daterangeControlStateService.focused;
5737
+ }
5738
+ /**
5739
+ * Wether control is invalid.
5740
+ * @returns Wether control is invalid.
5741
+ */
5742
+ get isInvalid() {
5743
+ return this.daterangeControlStateService.invalid;
5744
+ }
5745
+ }
5746
+ ClrAbstractContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrAbstractContainer, deps: [{ token: i1$1.ClrLayout, optional: true }, { token: DaterangeControlStateService }], target: i0.ɵɵFactoryTarget.Directive });
5747
+ ClrAbstractContainer.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", 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 });
5748
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrAbstractContainer, decorators: [{
5749
+ type: Directive
5750
+ }], ctorParameters: function () {
5751
+ return [{ type: i1$1.ClrLayout, decorators: [{
5752
+ type: Optional
5753
+ }] }, { type: DaterangeControlStateService }];
5754
+ }, propDecorators: { isFormControl: [{
5755
+ type: HostBinding,
5756
+ args: ['class.clr-form-control']
5757
+ }], addLayoutGrid: [{
5758
+ type: HostBinding,
5759
+ args: ['class.clr-row']
5760
+ }], labelComponent: [{
5761
+ type: ContentChild,
5762
+ args: [ClrLabel]
5763
+ }], controlHelperComponent: [{
5764
+ type: ContentChild,
5765
+ args: [ClrControlHelper]
5766
+ }], controlErrorComponent: [{
5767
+ type: ContentChild,
5768
+ args: [ClrControlError]
5769
+ }], controlSuccessComponent: [{
5770
+ type: ContentChild,
5771
+ args: [ClrControlSuccess]
5772
+ }] } });
5773
+
5774
+ /**
5775
+ * Daterange parsing service.
5776
+ * Heavy inspired by `date-io.service.ts` from Clarity.
5777
+ * https://github.com/vmware-clarity/ng-clarity/blob/a21fe726fe91ae3c929b8f016359afe354bb89c6/projects/angular/src/forms/datepicker/providers/date-io.service.ts
5778
+ */
5779
+ class DaterangeParsingService {
5780
+ constructor(locale) {
5781
+ this.locale = locale;
5782
+ this.localeDelimiter = [];
5783
+ const localeFormat = getLocaleDateFormat(this.locale, FormatWidth.Short);
5784
+ const format = localeFormat.toLocaleLowerCase();
5785
+ if (LITTLE_ENDIAN_REGEX.test(format)) {
5786
+ this.localeDisplayFormat = LITTLE_ENDIAN;
5787
+ }
5788
+ else if (MIDDLE_ENDIAN_REGEX.test(format)) {
5789
+ this.localeDisplayFormat = MIDDLE_ENDIAN;
5790
+ }
5791
+ else {
5792
+ this.localeDisplayFormat = BIG_ENDIAN;
5793
+ }
5794
+ // Splitting it by date, month and year, leaves us with the delimiters.
5795
+ // E.g. `"dd/MM/y".split(/d+|m+|y+/i)` results in `["", "/", "/", ""]`.
5796
+ const delimiters = localeFormat.split(DELIMITER_REGEX);
5797
+ this.localeDelimiter = [delimiters[1], delimiters[2]];
5798
+ }
5799
+ /** Locale format. */
5800
+ get localeFormat() {
5801
+ return (this.localeDisplayFormat.format[0] +
5802
+ this.localeDelimiter[0] +
5803
+ this.localeDisplayFormat.format[1] +
5804
+ this.localeDelimiter[1] +
5805
+ this.localeDisplayFormat.format[2]);
5806
+ }
5807
+ /**
5808
+ * Convert daterange to locale friendly text.
5809
+ * @param daterange - Daterange.
5810
+ * @param separator - Separator between 'from' and 'to' dates.
5811
+ * @returns Friendly daterange text.
5812
+ */
5813
+ toLocaleString(daterange, separator = SEPARATOR_TEXT_DEFAULT) {
5814
+ if (daterange == null) {
5815
+ return '';
5816
+ }
5817
+ const { from, to } = daterange;
5818
+ if (from == null || to == null) {
5819
+ return '';
5820
+ }
5821
+ const fromDate = from.toDate();
5822
+ const toDate = to.toDate();
5823
+ const fromDateStr = this.toLocaleDisplayFormatString(fromDate);
5824
+ const toDateStr = this.toLocaleDisplayFormatString(toDate);
5825
+ return fromDateStr + separator + toDateStr;
5826
+ }
5827
+ /**
5828
+ * Convert date to locale display format string.
5829
+ * @param date - Javascript Date object.
5830
+ * @returns Locale display format string.
5831
+ */
5832
+ toLocaleDisplayFormatString(date) {
5833
+ const dateNo = date.getDate();
5834
+ const monthNo = date.getMonth() + 1;
5835
+ const yearNo = date.getFullYear();
5836
+ const dateStr = this.pad(dateNo);
5837
+ const monthStr = this.pad(monthNo);
5838
+ const delim1 = this.localeDelimiter[0];
5839
+ const delim2 = this.localeDelimiter[1];
5840
+ if (this.localeDisplayFormat === LITTLE_ENDIAN) {
5841
+ return dateStr + delim1 + monthStr + delim2 + yearNo;
5842
+ }
5843
+ else if (this.localeDisplayFormat === MIDDLE_ENDIAN) {
5844
+ return monthStr + delim1 + dateStr + delim2 + yearNo;
5845
+ }
5846
+ else {
5847
+ return yearNo + delim1 + monthStr + delim2 + dateStr;
5848
+ }
5849
+ }
5850
+ /**
5851
+ * String padding with zeros.
5852
+ * @param num - Number to pad.
5853
+ * @returns Padded string.
5854
+ */
5855
+ pad(num) {
5856
+ return num < 10 ? `0${num}` : `${num}`;
5857
+ }
5858
+ /**
5859
+ * Parse daterange string to daterange object.
5860
+ * @param daterangeString - Daterange string.
5861
+ * @param separator - Separator text.
5862
+ * @returns Daterange object.
5863
+ */
5864
+ parse(daterangeString, separator = SEPARATOR_TEXT_DEFAULT) {
5865
+ if (daterangeString == null || daterangeString === '') {
5866
+ return null;
5867
+ }
5868
+ const [fromString, toString] = daterangeString.split(separator);
5869
+ const from = this.getDayModelFromDateString(fromString);
5870
+ const to = this.getDayModelFromDateString(toString);
5871
+ if (from == null && to == null) {
5872
+ return null;
5873
+ }
5874
+ return { from, to };
5875
+ }
5876
+ /**
5877
+ * Get `DayModel` from date string.
5878
+ * @param dateString - Date string.
5879
+ * @returns DayModel.
5880
+ */
5881
+ getDayModelFromDateString(dateString) {
5882
+ if (dateString == null || dateString === '') {
5883
+ return null;
5884
+ }
5885
+ const dateParts = dateString.match(USER_INPUT_REGEX);
5886
+ if (dateParts == null || dateParts.length !== 3) {
5887
+ return null;
5888
+ }
5889
+ const [firstPart, secondPart, thirdPart] = dateParts;
5890
+ if (this.localeDisplayFormat === LITTLE_ENDIAN) {
5891
+ // secondPart is month && firstPart is date.
5892
+ return this.getDayModelFromDateParts(thirdPart, secondPart, firstPart);
5893
+ }
5894
+ else if (this.localeDisplayFormat === MIDDLE_ENDIAN) {
5895
+ // firstPart is month && secondPart is date.
5896
+ return this.getDayModelFromDateParts(thirdPart, firstPart, secondPart);
5897
+ }
5898
+ else {
5899
+ // secondPart is month && thirdPart is date.
5900
+ return this.getDayModelFromDateParts(firstPart, secondPart, thirdPart);
5901
+ }
5902
+ }
5903
+ /**
5904
+ * Get `DayModel` from date string parts.
5905
+ * @param yearString - Year string.
5906
+ * @param monthString - Month string.
5907
+ * @param dateString - Date string.
5908
+ * @returns DayModel.
5909
+ */
5910
+ getDayModelFromDateParts(yearString, monthString, dateString) {
5911
+ // Check for valid date part strings.
5912
+ let year = parseInt(yearString);
5913
+ if (isNaN(year)) {
5914
+ return null;
5915
+ }
5916
+ let month = parseInt(monthString);
5917
+ if (isNaN(month)) {
5918
+ return null;
5919
+ }
5920
+ const date = parseInt(dateString);
5921
+ if (isNaN(date)) {
5922
+ return null;
5923
+ }
5924
+ // Convert year to 4 digit year.
5925
+ year = this.parseToFourDigitYear(year);
5926
+ if (year == null) {
5927
+ return null;
5928
+ }
5929
+ // Month is zero-indexed.
5930
+ month -= 1;
5931
+ // Creating new Javascript Date object, because it will automatically take care of
5932
+ // switching to next or previous months & years without we having to worry about it.
5933
+ const parsedDate = new Date(year, month, date);
5934
+ if (isNaN(parsedDate.getTime())) {
5935
+ return null;
5936
+ }
5937
+ return new DayModel(parsedDate);
5938
+ }
5939
+ /**
5940
+ * Takes in a year and if it is a 2 digit year, returns the corresponding 4 digit year.
5941
+ * Window of 80 years before and 20 years after the present year.
5942
+ * Credit: https://github.com/globalizejs/globalize/blob/e1b31cd6a4f1cff75b185b68b7a32220aac5196f/src/date/parse.js
5943
+ * @param year - Year.
5944
+ * @returns Four-digit year.
5945
+ */
5946
+ parseToFourDigitYear(year) {
5947
+ // Impossible years.
5948
+ if (year > 9999 || (year > 100 && year < 999) || year < 10) {
5949
+ return null;
5950
+ }
5951
+ if (year > 999) {
5952
+ return year;
5953
+ }
5954
+ const currYear = new Date().getFullYear();
5955
+ const century = Math.floor(currYear / 100) * 100;
5956
+ let result = year + century;
5957
+ if (result > currYear + 20) {
5958
+ result = result - 100;
5959
+ }
5960
+ return result;
5961
+ }
5962
+ }
5963
+ DaterangeParsingService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DaterangeParsingService, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable });
5964
+ DaterangeParsingService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DaterangeParsingService, providedIn: 'root' });
5965
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: DaterangeParsingService, decorators: [{
5966
+ type: Injectable,
5967
+ args: [{
5968
+ providedIn: 'root',
5969
+ }]
5970
+ }], ctorParameters: function () {
5971
+ return [{ type: undefined, decorators: [{
5972
+ type: Inject,
5973
+ args: [LOCALE_ID]
5974
+ }] }];
5975
+ } });
5976
+
5977
+ /**
5978
+ * Daterangepicker.
5979
+ */
5980
+ class ClrDaterangepickerDirective {
5981
+ constructor(control, element, renderer, daterangeControlStateService, controlIdService, daterangeService, daterangeParsingService) {
5982
+ this.control = control;
5983
+ this.element = element;
5984
+ this.renderer = renderer;
5985
+ this.daterangeControlStateService = daterangeControlStateService;
5986
+ this.controlIdService = controlIdService;
5987
+ this.daterangeService = daterangeService;
5988
+ this.daterangeParsingService = daterangeParsingService;
5989
+ /**
5990
+ * Locale text between 'from' and 'to' dateranges.
5991
+ */
5992
+ this.separatorText = SEPARATOR_TEXT_DEFAULT;
5993
+ /**
5994
+ * Event that is triggered when value changes.
5995
+ */
5996
+ this.valueChange = new EventEmitter();
5997
+ /** Set the `type` attribute always to "text", to not get the native datepicker. */
5998
+ this.inputType = 'text';
5999
+ this.inputClass = true;
6000
+ /** List of subscriptions to later destroy. */
6001
+ this.subscriptions = [];
6002
+ this.onChanged = (_value) => undefined;
6003
+ this.onTouched = (_value) => undefined;
6004
+ // To get access to the NgControl, we had to remove the `NG_VALUE_ACCESSOR`
6005
+ // provider and set them manually, while still keeping the interfaces.
6006
+ this.control.valueAccessor = this;
6007
+ }
6008
+ /**
6009
+ * Minimum date that can be selected.
6010
+ */
6011
+ set min(value) {
6012
+ this.daterangeService.minDate = !value ? null : new DayModel(value);
6013
+ }
6014
+ /**
6015
+ * Maximum date that can be selected.
6016
+ */
6017
+ set max(value) {
6018
+ this.daterangeService.maxDate = !value ? null : new DayModel(value);
6019
+ }
6020
+ get placeholderText() {
6021
+ var _a;
6022
+ return ((_a = this.placeholder) !== null && _a !== void 0 ? _a : this.daterangeParsingService.localeFormat + this.separatorText + this.daterangeParsingService.localeFormat);
6023
+ }
6024
+ /**
6025
+ * Id-attribute.
6026
+ */
6027
+ get id() {
6028
+ return this.controlIdService.id;
6029
+ }
6030
+ /**
6031
+ * Id-attribute.
6032
+ * @returns Id-attribute.
6033
+ */
6034
+ set id(value) {
6035
+ this.controlIdService.id = value;
6036
+ }
6037
+ /**
6038
+ * Disable control.
6039
+ */
6040
+ set disabled(value) {
6041
+ this.daterangeControlStateService.disabled = value;
6042
+ }
6043
+ /**
6044
+ * Disabled state.
6045
+ * @returns Disabled state.
6046
+ */
6047
+ get disabled() {
6048
+ return this.daterangeControlStateService.disabled;
6049
+ }
6050
+ ngOnInit() {
6051
+ this.listenForDaterangeValueChanges();
6052
+ this.listenForControlStatusChanges();
6053
+ }
6054
+ ngOnDestroy() {
6055
+ this.subscriptions.forEach(subscription => subscription.unsubscribe());
6056
+ }
6057
+ /**
6058
+ * Listen for daterange value changes.
6059
+ */
6060
+ listenForDaterangeValueChanges() {
6061
+ this.subscriptions.push(this.daterangeService.valueChange.subscribe((_daterange) => {
6062
+ this.triggerChange();
6063
+ }));
6064
+ }
6065
+ /**
6066
+ * Listen for control status changes.
6067
+ */
6068
+ listenForControlStatusChanges() {
6069
+ this.subscriptions.push(this.control.statusChanges.subscribe((_status) => {
6070
+ this.daterangeControlStateService.updateStatus(this.control.control);
6071
+ }));
6072
+ }
6073
+ /**
6074
+ * Listen to manual changes to the input.
6075
+ * @param target - Input element.
6076
+ */
6077
+ onChangeEvent(target) {
6078
+ // Remove 'invalid' error.
6079
+ if (this.control.control.hasError('invalid')) {
6080
+ delete this.control.control.errors.invalid;
6081
+ }
6082
+ // If there is nothing to parse, `ClrDaterangeRequiredValidator` will take care of this.
6083
+ if (!target.value) {
6084
+ this.daterangeService.updateSelectedDaterange(null, true);
6085
+ return;
6086
+ }
6087
+ const daterange = this.daterangeParsingService.parse(target.value, this.separatorText);
6088
+ const invalidDaterange = daterange == null || daterange.from == null || daterange.to == null;
6089
+ // Invalid manual daterange specified.
6090
+ if (invalidDaterange) {
6091
+ this.control.control.setErrors({
6092
+ invalid: target.value,
6093
+ });
6094
+ }
6095
+ // Update selected daterange, but only notify when valid.
6096
+ this.daterangeService.updateSelectedDaterange(daterange, !invalidDaterange);
6097
+ }
6098
+ /**
6099
+ * Listen to focus event.
6100
+ */
6101
+ focusEvent() {
6102
+ this.daterangeControlStateService.focused = true;
6103
+ }
6104
+ /**
6105
+ * Listen to blur event.
6106
+ */
6107
+ blurEvent() {
6108
+ this.daterangeControlStateService.focused = false;
6109
+ }
6110
+ /**
6111
+ * Focus input.
6112
+ */
6113
+ focus() {
6114
+ this.element.nativeElement.focus();
6115
+ }
6116
+ /**
6117
+ * Trigger events to notify form controls, trigger validation and update attributes/properties.
6118
+ */
6119
+ triggerChange() {
6120
+ let daterange = this.daterangeService.selectedDaterange;
6121
+ // When `from` or `to` properties are not set, return null.
6122
+ // This will trigger the `required` validator (if present).
6123
+ if (!this.daterangeService.isValid()) {
6124
+ daterange = null;
6125
+ }
6126
+ // Mark control dirty.
6127
+ this.onTouched(daterange);
6128
+ // Update NgModel.
6129
+ this.onChanged(daterange);
6130
+ // Notify parent.
6131
+ this.valueChange.emit(daterange);
6132
+ // Update attributes/properties.
6133
+ this.updateInput();
6134
+ }
6135
+ /**
6136
+ * Update input with friendly daterange text.
6137
+ */
6138
+ updateInput() {
6139
+ const dateString = this.daterangeParsingService.toLocaleString(this.daterangeService.selectedDaterange, this.separatorText);
6140
+ this.renderer.setProperty(this.element.nativeElement, 'value', dateString);
6141
+ }
6142
+ /**
6143
+ * ControlValueAccessor method. Set value from NgModel.
6144
+ * @param value - Daterange value.
6145
+ */
6146
+ writeValue(value) {
6147
+ this.daterangeService.updateSelectedDaterange(value);
6148
+ }
6149
+ /**
6150
+ * ControlValueAccessor method. Register change event. When value changes.
6151
+ * @param fn - Change event.
6152
+ */
6153
+ registerOnChange(fn) {
6154
+ this.onChanged = fn;
6155
+ }
6156
+ /**
6157
+ * ControlValueAccessor method. Register touch event. When control is dirty.
6158
+ * @param fn - Touch event.
6159
+ */
6160
+ registerOnTouched(fn) {
6161
+ this.onTouched = fn;
6162
+ }
6163
+ /**
6164
+ * ControlValueAccessor method. Set disabled state.
6165
+ * @param disabled - Disabled state.
6166
+ */
6167
+ setDisabledState(disabled) {
6168
+ this.daterangeControlStateService.disabled = disabled;
6169
+ }
6170
+ }
6171
+ ClrDaterangepickerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangepickerDirective, deps: [{ token: i3$1.NgControl, self: true }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DaterangeControlStateService }, { token: ControlIdService }, { token: DaterangeService }, { token: DaterangeParsingService }], target: i0.ɵɵFactoryTarget.Directive });
6172
+ ClrDaterangepickerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: ClrDaterangepickerDirective, selector: "[clrDaterangepicker]", inputs: { min: "min", max: "max", separatorText: "separatorText", placeholder: "placeholder", id: "id", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "change": "onChangeEvent($event.target)", "focus": "focusEvent()", "blur": "blurEvent()" }, properties: { "attr.placeholder": "this.placeholderText", "id": "this.id", "disabled": "this.disabled", "attr.type": "this.inputType", "class.clr-input": "this.inputClass" } }, ngImport: i0 });
6173
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangepickerDirective, decorators: [{
6174
+ type: Directive,
6175
+ args: [{
6176
+ selector: '[clrDaterangepicker]',
6177
+ }]
6178
+ }], ctorParameters: function () {
6179
+ return [{ type: i3$1.NgControl, decorators: [{
6180
+ type: Self
6181
+ }] }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: DaterangeControlStateService }, { type: ControlIdService }, { type: DaterangeService }, { type: DaterangeParsingService }];
6182
+ }, propDecorators: { min: [{
6183
+ type: Input
6184
+ }], max: [{
6185
+ type: Input
6186
+ }], separatorText: [{
6187
+ type: Input
6188
+ }], placeholder: [{
6189
+ type: Input
6190
+ }], placeholderText: [{
6191
+ type: HostBinding,
6192
+ args: ['attr.placeholder']
6193
+ }], id: [{
6194
+ type: HostBinding
6195
+ }, {
6196
+ type: Input
6197
+ }], disabled: [{
6198
+ type: HostBinding,
6199
+ args: ['disabled']
6200
+ }, {
6201
+ type: Input
6202
+ }], valueChange: [{
6203
+ type: Output
6204
+ }], inputType: [{
6205
+ type: HostBinding,
6206
+ args: ['attr.type']
6207
+ }], inputClass: [{
6208
+ type: HostBinding,
6209
+ args: ['class.clr-input']
6210
+ }], onChangeEvent: [{
6211
+ type: HostListener,
6212
+ args: ['change', ['$event.target']]
6213
+ }], focusEvent: [{
6214
+ type: HostListener,
6215
+ args: ['focus']
6216
+ }], blurEvent: [{
6217
+ type: HostListener,
6218
+ args: ['blur']
6219
+ }] } });
6220
+
6221
+ ClarityIcons.addIcons(calendarIcon, exclamationCircleIcon, checkCircleIcon, windowCloseIcon);
6222
+ /**
6223
+ * Daterangepicker container.
6224
+ */
6225
+ class ClrDaterangepickerContainerComponent extends ClrAbstractContainer {
6226
+ constructor(clrPopoverEventsService, clrPopoverToggleService, clrCommonStringsService, clrLayout, daterangeControlStateService, openedDatepickersTrackerService, daterangeService, daterangeParsingService) {
6227
+ super(clrLayout, daterangeControlStateService);
6228
+ this.clrPopoverEventsService = clrPopoverEventsService;
6229
+ this.clrPopoverToggleService = clrPopoverToggleService;
6230
+ this.clrCommonStringsService = clrCommonStringsService;
6231
+ this.clrLayout = clrLayout;
6232
+ this.daterangeControlStateService = daterangeControlStateService;
6233
+ this.openedDatepickersTrackerService = openedDatepickersTrackerService;
6234
+ this.daterangeService = daterangeService;
6235
+ this.daterangeParsingService = daterangeParsingService;
6236
+ /**
6237
+ * List of presets.
6238
+ */
6239
+ this.presets = [];
6240
+ /**
6241
+ * Text for the 'from' label.
6242
+ */
6243
+ this.labelFrom = TRANSLATIONS.from;
6244
+ /**
6245
+ * Text for the 'to' label.
6246
+ */
6247
+ this.labelTo = TRANSLATIONS.to;
6248
+ /** CSS classes. */
6249
+ this.classes = 'clr-date-container';
6250
+ /**
6251
+ * Popover open state.
6252
+ */
6253
+ this.open = false;
6254
+ /**
6255
+ * Popover position config.
6256
+ */
6257
+ this.popoverPosition = PopoverPositions['bottom-left'];
6258
+ /** List of subscriptions to later destroy. */
6259
+ this.subscriptions = [];
6260
+ }
6261
+ /**
6262
+ * Set popover position.
6263
+ */
6264
+ set clrPosition(position) {
6265
+ if (position && PopoverPositions[position]) {
6266
+ this.popoverPosition = PopoverPositions[position];
6267
+ }
6268
+ }
6269
+ /**
6270
+ * Date from.
6271
+ * @returns Date from.
6272
+ */
6273
+ get dateFrom() {
6274
+ var _a;
6275
+ return (_a = this.daterangeService.selectedDaterange) === null || _a === void 0 ? void 0 : _a.from;
6276
+ }
6277
+ /**
6278
+ * Date to.
6279
+ * @returns Date to.
6280
+ */
6281
+ get dateTo() {
6282
+ var _a;
6283
+ return (_a = this.daterangeService.selectedDaterange) === null || _a === void 0 ? void 0 : _a.to;
6284
+ }
6285
+ /**
6286
+ * Minimum date that can be selected.
6287
+ * @returns Minimum date that can be selected.
6288
+ */
6289
+ get minDate() {
6290
+ return this.daterangeService.minDate;
6291
+ }
6292
+ /**
6293
+ * Maximum date that can be selected.
6294
+ * @returns Maximum date that can be selected.
6295
+ */
6296
+ get maxDate() {
6297
+ return this.daterangeService.maxDate;
6298
+ }
6299
+ /**
6300
+ * Get friendly daterange text.
6301
+ * @returns Friendly daterange text.
6302
+ */
6303
+ get friendlyDaterange() {
6304
+ return this._friendlyDaterange || this.commonStrings.datepickerToggleChooseDateLabel;
6305
+ }
6306
+ /**
6307
+ * List of common translation keys.
6308
+ */
6309
+ get commonStrings() {
6310
+ return this.clrCommonStringsService.keys;
6311
+ }
6312
+ ngAfterViewInit() {
6313
+ if (this.daterangepickerDirective == null) {
6314
+ throw new Error('`ClrDaterangepickerContainerComponent` requires an child `ClrDaterangepickerDirective`');
6315
+ }
6316
+ this.listenForDaterangeValueChanges();
6317
+ this.listenForOpenedDatepickersTrackerChanges();
6318
+ this.listenForPopoverToggleChanges();
6319
+ }
6320
+ ngOnDestroy() {
6321
+ this.subscriptions.forEach(subscription => subscription.unsubscribe());
6322
+ }
6323
+ /**
6324
+ * Listen for daterange value changes.
6325
+ */
6326
+ listenForDaterangeValueChanges() {
6327
+ this.subscriptions.push(this.daterangeService.valueChange.subscribe((daterange) => {
6328
+ this._friendlyDaterange = this.daterangeParsingService.toLocaleString(daterange, this.daterangepickerDirective.separatorText);
6329
+ }));
6330
+ }
6331
+ /**
6332
+ * Listen for any opened datepickers tracker state changes.
6333
+ */
6334
+ listenForOpenedDatepickersTrackerChanges() {
6335
+ this.subscriptions.push(this.openedDatepickersTrackerService.valueChange.subscribe(hasOpenDatePickers => {
6336
+ // When choosing an date in the DatePicker calender, all popovers are closed. Even our own popover.
6337
+ // Therefor we have to remove the ability to close our own popover.
6338
+ // Simply changing the `outsideClickClose` property after initialization does nothing.
6339
+ // We need to manually remove the listener, change the `outsideClickClose` property and re-attach the click listener.
6340
+ // Steps to reproduce with 2 daterangepickers:
6341
+ // 1. Click on second daterangepicker action icon to open the popover.
6342
+ // 2. Click on one of the datepickers to open calender.
6343
+ // 3. Close datepicker.
6344
+ // 4. Click on first daterangepicker action icon. Error.
6345
+ this.clrPopoverEventsService.removeClickListener();
6346
+ this.clrPopoverEventsService.outsideClickClose = !hasOpenDatePickers;
6347
+ // We need to wait before we attach the click listener.
6348
+ requestAnimationFrame(() => {
6349
+ this.clrPopoverEventsService.addClickListener();
6350
+ });
6351
+ }));
6352
+ }
6353
+ /**
6354
+ * Listen for popover toggle changes.
6355
+ */
6356
+ listenForPopoverToggleChanges() {
6357
+ this.subscriptions.push(this.clrPopoverToggleService.openChange.subscribe(opened => {
6358
+ // Focus first datepicker when popover opens.
6359
+ // Focus back to input when popover is closed.
6360
+ if (opened) {
6361
+ // Wait for the datepicker components to be rendered.
6362
+ requestAnimationFrame(() => {
6363
+ this.datepickerComponents.first.focus();
6364
+ });
6365
+ }
6366
+ else {
6367
+ this.daterangepickerDirective.focus();
6368
+ // When closing popover modal and daterange is not valid, reset model.
6369
+ if (!this.daterangeService.isValid()) {
6370
+ this.daterangeService.updateSelectedDaterange(null);
6371
+ }
6372
+ }
6373
+ }));
6374
+ }
6375
+ /**
6376
+ * Event triggered when date from changed.
6377
+ * @param value - Date from.
6378
+ */
6379
+ onDateFromChange(value) {
6380
+ this.daterangeService.updateSelectedDaterange({
6381
+ from: value,
6382
+ to: this.dateTo,
6383
+ });
6384
+ }
6385
+ /**
6386
+ * Event triggered when date to changed.
6387
+ * @param value - Date to.
6388
+ */
6389
+ onDateToChange(value) {
6390
+ this.daterangeService.updateSelectedDaterange({
6391
+ from: this.dateFrom,
6392
+ to: value,
6393
+ });
6394
+ }
6395
+ /**
6396
+ * Apply selected preset.
6397
+ * @param preset - Selected preset.
6398
+ */
6399
+ applyPreset(preset) {
6400
+ const range = preset.range();
6401
+ this.daterangeService.updateSelectedDaterange(range);
6402
+ // Close popover here, because it's not possible to conditionally
6403
+ // apply `clrPopoverCloseButton` directive on preset button.
6404
+ if (this.daterangeService.isValid()) {
6405
+ this.clrPopoverToggleService.open = false;
6406
+ }
6407
+ }
6408
+ }
6409
+ ClrDaterangepickerContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", 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 });
6410
+ ClrDaterangepickerContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: ClrDaterangepickerContainerComponent, selector: "clr-daterangepicker-container", inputs: { presets: "presets", clrPosition: "clrPosition", labelFrom: "labelFrom", labelTo: "labelTo" }, host: { properties: { "class": "this.classes" } }, providers: [
6411
+ ClrPopoverToggleService,
6412
+ ClrPopoverEventsService,
6413
+ ClrPopoverPositionService,
6414
+ DaterangeControlStateService,
6415
+ DaterangeService,
6416
+ OpenedDatepickersTrackerService,
6417
+ ControlIdService,
6418
+ ], 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:-moz-fit-content;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"] }] });
6419
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangepickerContainerComponent, decorators: [{
6420
+ type: Component,
6421
+ args: [{ selector: 'clr-daterangepicker-container', providers: [
6422
+ ClrPopoverToggleService,
6423
+ ClrPopoverEventsService,
6424
+ ClrPopoverPositionService,
6425
+ DaterangeControlStateService,
6426
+ DaterangeService,
6427
+ OpenedDatepickersTrackerService,
6428
+ ControlIdService,
6429
+ ], 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:-moz-fit-content;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"] }]
6430
+ }], ctorParameters: function () {
6431
+ return [{ type: i1$1.ClrPopoverEventsService }, { type: i1$1.ClrPopoverToggleService }, { type: i1$1.ClrCommonStringsService }, { type: i1$1.ClrLayout, decorators: [{
6432
+ type: Optional
6433
+ }] }, { type: DaterangeControlStateService }, { type: OpenedDatepickersTrackerService }, { type: DaterangeService }, { type: DaterangeParsingService }];
6434
+ }, propDecorators: { presets: [{
6435
+ type: Input
6436
+ }], clrPosition: [{
6437
+ type: Input
6438
+ }], labelFrom: [{
6439
+ type: Input
6440
+ }], labelTo: [{
6441
+ type: Input
6442
+ }], datepickerComponents: [{
6443
+ type: ViewChildren,
6444
+ args: [ClrDatepickerComponent]
6445
+ }], daterangepickerDirective: [{
6446
+ type: ContentChild,
6447
+ args: [ClrDaterangepickerDirective]
6448
+ }], classes: [{
6449
+ type: HostBinding,
6450
+ args: ['class']
6451
+ }] } });
6452
+
6453
+ /**
6454
+ * Directive for multiple error messages.
6455
+ * It works the same as Clarity `ClrIfError`, but for customized `ClrDaterangepickerContainerComponent`.
6456
+ * Using Clarity `ClrIfError` requires the container to have service implemented that are not publicly exported.
6457
+ *
6458
+ * @see https://clarity.design/documentation/forms (section "Multiple error messages").
6459
+ *
6460
+ * Altered version from https://github.com/vmware-clarity/ng-clarity/blob/138a6dd95fdc4ffb67b054391c44ce5fa3c44660/projects/angular/src/forms/common/if-control-state/if-error.ts
6461
+ */
6462
+ class ClrIfDaterangeErrorDirective {
6463
+ constructor(template, container, daterangeControlStateService, daterangepickerContainerComponent) {
6464
+ this.template = template;
6465
+ this.container = container;
6466
+ this.daterangeControlStateService = daterangeControlStateService;
6467
+ this.daterangepickerContainerComponent = daterangepickerContainerComponent;
6468
+ /** Flag to remember if content is displayed. */
6469
+ this.displayedContent = false;
6470
+ /** List of subscriptions to later destroy. */
6471
+ this.subscriptions = [];
6472
+ // This directive only works inside `clr-daterangepicker-container`.
6473
+ if (this.daterangeControlStateService == null || this.daterangepickerContainerComponent == null) {
6474
+ throw new Error('`ClrIfDaterangeErrorDirective` can only be used within `ClrDaterangepickerContainerComponent`');
6475
+ }
6476
+ // Listen to status changes to toggle error visibility.
6477
+ this.subscriptions.push(this.daterangeControlStateService.statusChange.subscribe((_status) => {
6478
+ this.handleState();
6479
+ }));
6480
+ }
6481
+ ngOnDestroy() {
6482
+ this.subscriptions.forEach(subscription => subscription.unsubscribe());
6483
+ }
6484
+ /**
6485
+ * Handle error depending on states.
6486
+ */
6487
+ handleState() {
6488
+ if (!this.daterangeControlStateService.invalid) {
6489
+ // If control is not invalid, hide all errors.
6490
+ this.toggleErrorVisibility(false);
6491
+ }
6492
+ else if (this.clrIfDaterangeError) {
6493
+ // Display error only if error input is list of errors.
6494
+ const hasError = this.clrIfDaterangeError in this.daterangeControlStateService.errors;
6495
+ this.toggleErrorVisibility(hasError);
6496
+ }
6497
+ else {
6498
+ // Display error.
6499
+ this.toggleErrorVisibility(true);
6500
+ }
6501
+ }
6502
+ /**
6503
+ * Display/hide error.
6504
+ * @param displayError - Wether to show/hide error.
6505
+ */
6506
+ toggleErrorVisibility(displayError) {
6507
+ if (displayError) {
6508
+ const error = this.daterangeControlStateService.errors[this.clrIfDaterangeError];
6509
+ if (this.displayedContent === false) {
6510
+ this.embeddedViewRef = this.container.createEmbeddedView(this.template, {
6511
+ error,
6512
+ });
6513
+ this.displayedContent = true;
6514
+ }
6515
+ else if (this.embeddedViewRef && this.embeddedViewRef.context) {
6516
+ // If view is already rendered, update the error object to keep it in sync.
6517
+ this.embeddedViewRef.context.error = error;
6518
+ }
6519
+ }
6520
+ else {
6521
+ this.container.clear();
6522
+ this.displayedContent = false;
6523
+ }
6524
+ }
6525
+ }
6526
+ ClrIfDaterangeErrorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrIfDaterangeErrorDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }, { token: DaterangeControlStateService, optional: true }, { token: ClrDaterangepickerContainerComponent, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
6527
+ ClrIfDaterangeErrorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: ClrIfDaterangeErrorDirective, selector: "[clrIfDaterangeError]", inputs: { clrIfDaterangeError: "clrIfDaterangeError" }, ngImport: i0 });
6528
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrIfDaterangeErrorDirective, decorators: [{
6529
+ type: Directive,
6530
+ args: [{
6531
+ selector: '[clrIfDaterangeError]',
6532
+ }]
6533
+ }], ctorParameters: function () {
6534
+ return [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }, { type: DaterangeControlStateService, decorators: [{
6535
+ type: Optional
6536
+ }] }, { type: ClrDaterangepickerContainerComponent, decorators: [{
6537
+ type: Optional
6538
+ }] }];
6539
+ }, propDecorators: { clrIfDaterangeError: [{
6540
+ type: Input
6541
+ }] } });
6542
+
6543
+ /**
6544
+ * Validator for daterangepicker to validate that 'to' date is not after 'max' value.
6545
+ * Otherwise will throw corresponding `max` validation error.
6546
+ *
6547
+ * Validator is applied to the ClrDaterangepickerDirective with `max` attribute.
6548
+ * Or when set manually with `clrDaterangeMax` attribute.
6549
+ *
6550
+ * Validator is active by default when applied. It can be disabled with: `[clrDaterangeMax]="false"`
6551
+ */
6552
+ class ClrDaterangeMaxValidator {
6553
+ constructor(daterangeService) {
6554
+ this.daterangeService = daterangeService;
6555
+ this._active = true;
6556
+ }
6557
+ /**
6558
+ * Disable validator by setting value to `false`.
6559
+ */
6560
+ set active(active) {
6561
+ this._active = active == null || (active !== false && `${active}` !== 'false');
6562
+ }
6563
+ /**
6564
+ * Validator method. Method that performs synchronous validation against the provided control.
6565
+ * @param control - The control to validate against.
6566
+ * @returns A map of validation errors if validation fails, otherwise null.
6567
+ */
6568
+ validate(control) {
6569
+ if (!this._active) {
6570
+ return null;
6571
+ }
6572
+ if (control.value == null) {
6573
+ return null;
6574
+ }
6575
+ const max = this.daterangeService.maxDate;
6576
+ if (max == null) {
6577
+ return null;
6578
+ }
6579
+ const { to } = control.value;
6580
+ if (to == null) {
6581
+ return null;
6582
+ }
6583
+ if (to.isAfter(max)) {
6584
+ return {
6585
+ [ClrDaterangeMaxValidator.validationErrorName]: {
6586
+ max,
6587
+ actual: to,
6588
+ },
6589
+ };
6590
+ }
6591
+ return null;
6592
+ }
6593
+ }
6594
+ /** Validation error name. */
6595
+ ClrDaterangeMaxValidator.validationErrorName = 'max';
6596
+ ClrDaterangeMaxValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangeMaxValidator, deps: [{ token: DaterangeService, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
6597
+ ClrDaterangeMaxValidator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: ClrDaterangeMaxValidator, selector: "[clrDaterangepicker][max], [clrDaterangeMax]", inputs: { active: ["clrDaterangeMax", "active"] }, providers: [
6598
+ {
6599
+ provide: NG_VALIDATORS,
6600
+ useExisting: forwardRef(() => ClrDaterangeMaxValidator),
6601
+ multi: true,
6602
+ },
6603
+ ], ngImport: i0 });
6604
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangeMaxValidator, decorators: [{
6605
+ type: Directive,
6606
+ args: [{
6607
+ selector: '[clrDaterangepicker][max], [clrDaterangeMax]',
6608
+ providers: [
6609
+ {
6610
+ provide: NG_VALIDATORS,
6611
+ useExisting: forwardRef(() => ClrDaterangeMaxValidator),
6612
+ multi: true,
6613
+ },
6614
+ ],
6615
+ }]
6616
+ }], ctorParameters: function () {
6617
+ return [{ type: DaterangeService, decorators: [{
6618
+ type: Optional
6619
+ }] }];
6620
+ }, propDecorators: { active: [{
6621
+ type: Input,
6622
+ args: ['clrDaterangeMax']
6623
+ }] } });
6624
+
6625
+ /**
6626
+ * Validator for daterangepicker to validate that 'from' date is not before 'min' value.
6627
+ * Otherwise will throw corresponding `min` validation error.
6628
+ *
6629
+ * Validator is applied to the ClrDaterangepickerDirective with `min` attribute.
6630
+ * Or when set manually with `clrDaterangeMin` attribute.
6631
+ *
6632
+ * Validator is active by default when applied. It can be disabled with: `[clrDaterangeMin]="false"`
6633
+ */
6634
+ class ClrDaterangeMinValidator {
6635
+ constructor(daterangeService) {
6636
+ this.daterangeService = daterangeService;
6637
+ this._active = true;
6638
+ }
6639
+ /**
6640
+ * Disable validator by setting value to `false`.
6641
+ */
6642
+ set active(active) {
6643
+ this._active = active == null || (active !== false && `${active}` !== 'false');
6644
+ }
6645
+ /**
6646
+ * Validator method. Method that performs synchronous validation against the provided control.
6647
+ * @param control - The control to validate against.
6648
+ * @returns A map of validation errors if validation fails, otherwise null.
6649
+ */
6650
+ validate(control) {
6651
+ if (!this._active) {
6652
+ return null;
6653
+ }
6654
+ if (control.value == null) {
6655
+ return null;
6656
+ }
6657
+ const min = this.daterangeService.minDate;
6658
+ if (min == null) {
6659
+ return null;
6660
+ }
6661
+ const { from } = control.value;
6662
+ if (from == null) {
6663
+ return null;
6664
+ }
6665
+ if (from.isBefore(min)) {
6666
+ return {
6667
+ [ClrDaterangeMinValidator.validationErrorName]: {
6668
+ min,
6669
+ actual: from,
6670
+ },
6671
+ };
6672
+ }
6673
+ return null;
6674
+ }
6675
+ }
6676
+ /** Validation error name. */
6677
+ ClrDaterangeMinValidator.validationErrorName = 'min';
6678
+ ClrDaterangeMinValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangeMinValidator, deps: [{ token: DaterangeService, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
6679
+ ClrDaterangeMinValidator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: ClrDaterangeMinValidator, selector: "[clrDaterangepicker][min], [clrDaterangeMin]", inputs: { active: ["clrDaterangeMin", "active"] }, providers: [
6680
+ {
6681
+ provide: NG_VALIDATORS,
6682
+ useExisting: forwardRef(() => ClrDaterangeMinValidator),
6683
+ multi: true,
6684
+ },
6685
+ ], ngImport: i0 });
6686
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangeMinValidator, decorators: [{
6687
+ type: Directive,
6688
+ args: [{
6689
+ selector: '[clrDaterangepicker][min], [clrDaterangeMin]',
6690
+ providers: [
6691
+ {
6692
+ provide: NG_VALIDATORS,
6693
+ useExisting: forwardRef(() => ClrDaterangeMinValidator),
6694
+ multi: true,
6695
+ },
6696
+ ],
6697
+ }]
6698
+ }], ctorParameters: function () {
6699
+ return [{ type: DaterangeService, decorators: [{
6700
+ type: Optional
6701
+ }] }];
6702
+ }, propDecorators: { active: [{
6703
+ type: Input,
6704
+ args: ['clrDaterangeMin']
6705
+ }] } });
6706
+
6707
+ /**
6708
+ * Validator for daterangepicker to validate that 'from' date is before 'to' date.
6709
+ * Otherwise will throw `fromIsAfterTo` validation error.
6710
+ *
6711
+ * This validator is applied automatically on ClrDaterangepickerDirective.
6712
+ * Or when set manually with `clrDaterangeOrder` attribute.
6713
+ *
6714
+ * Validator is active by default when applied. It can be disabled with: `[clrDaterangeOrder]="false"`
6715
+ */
6716
+ class ClrDaterangeOrderValidator {
6717
+ constructor() {
6718
+ this._active = true;
6719
+ }
6720
+ /**
6721
+ * Disable validator by setting value to `false`.
6722
+ */
6723
+ set active(active) {
6724
+ this._active = active == null || (active !== false && `${active}` !== 'false');
6725
+ }
6726
+ /**
6727
+ * Validator method. Method that performs synchronous validation against the provided control.
6728
+ * @param control - The control to validate against.
6729
+ * @returns A map of validation errors if validation fails, otherwise null.
6730
+ */
6731
+ validate(control) {
6732
+ if (!this._active) {
6733
+ return null;
6734
+ }
6735
+ // Validation with `null` value is done with the regular required validator.
6736
+ if (control.value == null) {
6737
+ return null;
6738
+ }
6739
+ const { from, to } = control.value;
6740
+ // Validation with `null` values from 'from' & 'to' is done with the ClrDaterangeRequiredValidator.
6741
+ if (from == null || to == null) {
6742
+ return null;
6743
+ }
6744
+ if (from.isAfter(to)) {
6745
+ return {
6746
+ [ClrDaterangeOrderValidator.validationErrorName]: control.value,
6747
+ };
6748
+ }
6749
+ return null;
6750
+ }
6751
+ }
6752
+ /** Validation error name. */
6753
+ ClrDaterangeOrderValidator.validationErrorName = 'fromIsAfterTo';
6754
+ ClrDaterangeOrderValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangeOrderValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
6755
+ ClrDaterangeOrderValidator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: ClrDaterangeOrderValidator, selector: "[clrDaterangepicker], [clrDaterangeOrder]", inputs: { active: ["clrDaterangeOrder", "active"] }, providers: [
6756
+ {
6757
+ provide: NG_VALIDATORS,
6758
+ useExisting: forwardRef(() => ClrDaterangeOrderValidator),
6759
+ multi: true,
6760
+ },
6761
+ ], ngImport: i0 });
6762
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangeOrderValidator, decorators: [{
6763
+ type: Directive,
6764
+ args: [{
6765
+ selector: '[clrDaterangepicker], [clrDaterangeOrder]',
6766
+ providers: [
6767
+ {
6768
+ provide: NG_VALIDATORS,
6769
+ useExisting: forwardRef(() => ClrDaterangeOrderValidator),
6770
+ multi: true,
6771
+ },
6772
+ ],
6773
+ }]
6774
+ }], propDecorators: { active: [{
6775
+ type: Input,
6776
+ args: ['clrDaterangeOrder']
6777
+ }] } });
6778
+
6779
+ /**
6780
+ * Validator for daterangepicker to validate that 'from' *AND* 'to' date are not `null`.
6781
+ * Will throw `required` validation error.
6782
+ *
6783
+ * Validator is applied to the ClrDaterangepickerDirective with `required` attribute.
6784
+ * Or when set manually with `clrDaterangeRequired` attribute.
6785
+ *
6786
+ * Validator is active by default when applied. It can be disabled with: `[clrDaterangeRequired]="false"`
6787
+ */
6788
+ class ClrDaterangeRequiredValidator {
6789
+ constructor() {
6790
+ this._active = true;
6791
+ }
6792
+ /**
6793
+ * Disable validator by setting value to `false`.
6794
+ */
6795
+ set active(active) {
6796
+ this._active = active == null || (active !== false && `${active}` !== 'false');
6797
+ }
6798
+ /**
6799
+ * Validator method. Method that performs synchronous validation against the provided control.
6800
+ * @param control - The control to validate against.
6801
+ * @returns A map of validation errors if validation fails, otherwise null.
6802
+ */
6803
+ validate(control) {
6804
+ if (!this._active) {
6805
+ return null;
6806
+ }
6807
+ // Validation with `null` value is done with the regular required validator.
6808
+ if (control.value == null) {
6809
+ return null;
6810
+ }
6811
+ const { from, to } = control.value;
6812
+ if (from == null || to == null) {
6813
+ return {
6814
+ [ClrDaterangeRequiredValidator.validationErrorName]: control.value,
6815
+ };
6816
+ }
6817
+ return null;
6818
+ }
6819
+ }
6820
+ /** Validation error name. */
6821
+ ClrDaterangeRequiredValidator.validationErrorName = 'required';
6822
+ ClrDaterangeRequiredValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangeRequiredValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
6823
+ ClrDaterangeRequiredValidator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: ClrDaterangeRequiredValidator, selector: "[clrDaterangepicker][required], [clrDaterangeRequired]", inputs: { active: ["clrDaterangeRequired", "active"] }, providers: [
6824
+ {
6825
+ provide: NG_VALIDATORS,
6826
+ useExisting: forwardRef(() => ClrDaterangeRequiredValidator),
6827
+ multi: true,
6828
+ },
6829
+ ], ngImport: i0 });
6830
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangeRequiredValidator, decorators: [{
6831
+ type: Directive,
6832
+ args: [{
6833
+ selector: '[clrDaterangepicker][required], [clrDaterangeRequired]',
6834
+ providers: [
6835
+ {
6836
+ provide: NG_VALIDATORS,
6837
+ useExisting: forwardRef(() => ClrDaterangeRequiredValidator),
6838
+ multi: true,
6839
+ },
6840
+ ],
6841
+ }]
6842
+ }], propDecorators: { active: [{
6843
+ type: Input,
6844
+ args: ['clrDaterangeRequired']
6845
+ }] } });
6846
+
6847
+ class ClrDaterangepickerModule {
6848
+ }
6849
+ ClrDaterangepickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangepickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
6850
+ ClrDaterangepickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangepickerModule, declarations: [ClrDatepickerComponent,
6851
+ ClrDaterangeMaxValidator,
6852
+ ClrDaterangeMinValidator,
6853
+ ClrDaterangeOrderValidator,
6854
+ ClrDaterangepickerContainerComponent,
6855
+ ClrDaterangepickerDirective,
6856
+ ClrDaterangeRequiredValidator,
6857
+ ClrIfDaterangeErrorDirective], imports: [CommonModule, FormsModule, ClarityModule, ClrDatepickerModule, ClrIconModule], exports: [ClrDaterangeMaxValidator,
6858
+ ClrDaterangeMinValidator,
6859
+ ClrDaterangeOrderValidator,
6860
+ ClrDaterangepickerContainerComponent,
6861
+ ClrDaterangepickerDirective,
6862
+ ClrDaterangeRequiredValidator,
6863
+ ClrIfDaterangeErrorDirective] });
6864
+ ClrDaterangepickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangepickerModule, imports: [CommonModule, FormsModule, ClarityModule, ClrDatepickerModule, ClrIconModule] });
6865
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrDaterangepickerModule, decorators: [{
6866
+ type: NgModule,
6867
+ args: [{
6868
+ imports: [CommonModule, FormsModule, ClarityModule, ClrDatepickerModule, ClrIconModule],
6869
+ declarations: [
6870
+ ClrDatepickerComponent,
6871
+ ClrDaterangeMaxValidator,
6872
+ ClrDaterangeMinValidator,
6873
+ ClrDaterangeOrderValidator,
6874
+ ClrDaterangepickerContainerComponent,
6875
+ ClrDaterangepickerDirective,
6876
+ ClrDaterangeRequiredValidator,
6877
+ ClrIfDaterangeErrorDirective,
6878
+ ],
6879
+ entryComponents: [ClrDatepickerComponent],
6880
+ exports: [
6881
+ ClrDaterangeMaxValidator,
6882
+ ClrDaterangeMinValidator,
6883
+ ClrDaterangeOrderValidator,
6884
+ ClrDaterangepickerContainerComponent,
6885
+ ClrDaterangepickerDirective,
6886
+ ClrDaterangeRequiredValidator,
6887
+ ClrIfDaterangeErrorDirective,
6888
+ ],
6889
+ }]
6890
+ }] });
6891
+
5243
6892
  /*
5244
- * Copyright (c) 2018-2022 Porsche Informatik. All Rights Reserved.
6893
+ * Copyright (c) 2018-2023 Porsche Informatik. All Rights Reserved.
5245
6894
  * This software is released under MIT license.
5246
6895
  * The full license information can be found in LICENSE in the root directory of this project.
5247
6896
  */
@@ -5277,7 +6926,8 @@ ClrAddonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version
5277
6926
  ClrDropdownOverflowModule,
5278
6927
  ClrDatagridStatePersistenceModule,
5279
6928
  ClrEnumFilterModule,
5280
- ClrDateFilterModule] });
6929
+ ClrDateFilterModule,
6930
+ ClrDaterangepickerModule] });
5281
6931
  ClrAddonsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrAddonsModule, imports: [ClrViewEditSectionModule,
5282
6932
  ClrPagerModule,
5283
6933
  ClrDotPagerModule,
@@ -5307,7 +6957,8 @@ ClrAddonsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version
5307
6957
  ClrDropdownOverflowModule,
5308
6958
  ClrDatagridStatePersistenceModule,
5309
6959
  ClrEnumFilterModule,
5310
- ClrDateFilterModule] });
6960
+ ClrDateFilterModule,
6961
+ ClrDaterangepickerModule] });
5311
6962
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: ClrAddonsModule, decorators: [{
5312
6963
  type: NgModule,
5313
6964
  args: [{
@@ -5342,6 +6993,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImpor
5342
6993
  ClrDatagridStatePersistenceModule,
5343
6994
  ClrEnumFilterModule,
5344
6995
  ClrDateFilterModule,
6996
+ ClrDaterangepickerModule,
5345
6997
  ],
5346
6998
  }]
5347
6999
  }] });
@@ -5972,7 +7624,7 @@ const ClrAddonsIconShapes = {
5972
7624
  */
5973
7625
 
5974
7626
  /*
5975
- * Copyright (c) 2018-2022 Porsche Informatik. All Rights Reserved.
7627
+ * Copyright (c) 2018-2023 Porsche Informatik. All Rights Reserved.
5976
7628
  * This software is released under MIT license.
5977
7629
  * The full license information can be found in LICENSE in the root directory of this project.
5978
7630
  */
@@ -5981,5 +7633,5 @@ const ClrAddonsIconShapes = {
5981
7633
  * Generated bundle index. Do not edit.
5982
7634
  */
5983
7635
 
5984
- export { ACShape, AcceptedBrands, AccessoriesShape, AccessoryPartsShape, AudiBrandShape, AwardWinnerPremiumShape, BlocksGroupForwardShape, BrochureShape, BundleForwardShape, BusinessCustomersCommercialShape, BusinessCustomersPrivateShape, BusinessPartnerWithCar, CLR_BLANK_OPTION, CONTENT_PROVIDER, CalculatorForwardShape, CaliforniaServiceShape, CaliforniaSpecialistShape, CampaignOutdatedShape, CampaignShape, CarPickupServiceShape, CarWashShape, CertifiedRepairShape, CertifiedRetailerShape, ClrActiveNotification, ClrAddonsIconShapes, ClrAddonsLabel, ClrAddonsModule, ClrAutocompleteOff, ClrAutocompleteOffModule, ClrBackButton, ClrBackButtonModule, ClrBrandAvatar, ClrBrandAvatarModule, ClrBreadcrumb, ClrBreadcrumbModule, ClrBreadcrumbService, ClrCollapseExpandSection, ClrCollapseExpandSectionModule, ClrContentPanel, ClrContentPanelContainer, ClrContentPanelContainerContent, ClrContentPanelContainerFooter, ClrContentPanelModule, ClrContentRef, ClrDataListPredefinedValidatorDirective, ClrDataListValidatorModule, ClrDataListValidators, ClrDatagridStatePersistenceModule, ClrDateFilterComponent, ClrDateFilterModule, ClrDateTimeContainer, ClrDateTimeModule, ClrDotPager, ClrDotPagerModule, ClrDropdownOverflowDirective, ClrDropdownOverflowModule, ClrEnumFilterComponent, ClrEnumFilterModule, ClrFlowBar, ClrFlowBarModule, ClrFormModule, ClrGenericQuickList, ClrGenericQuickListModule, ClrHistory, ClrHistoryModule, ClrHistoryPinned, ClrHistoryService, ClrLetterAvatar, ClrLetterAvatarModule, ClrLocationBarModule, ClrMainNavGroup, ClrMainNavGroupItem, ClrMainNavGroupModule, ClrMaxNumeric, ClrMinNumeric, ClrMultilingualInput, ClrMultilingualInputValidators, ClrMultilingualModule, ClrMultilingualSelector, ClrMultilingualTextarea, ClrNotification, ClrNotificationModule, ClrNotificationRef, ClrNotificationService, ClrNumericField, ClrNumericFieldModule, ClrNumericFieldValidators, ClrPagedSearchResultList, ClrPagedSearchResultListModule, ClrPager, ClrPagerModule, ClrProgressSpinnerComponent, ClrProgressSpinnerModule, ClrQuickList, ClrQuickListModule, ClrRequiredAllMultilang, ClrRequiredOneMultilang, ClrSearchField, ClrSearchFieldModule, ClrTimeInput, ClrTreetable, ClrTreetableActionOverflow, ClrTreetableCell, ClrTreetableColumn, ClrTreetableModule, ClrTreetablePlaceholder, ClrTreetableRow, ClrViewEditSection, ClrViewEditSectionModule, ColumnHiddenStatePersistenceDirective, ConfiguratorCommercialShape, ConfiguratorPrivateShape, ConsumptionShape, ContactDealerShape, CupraBrandShape, CustomersCenterShape, DWABrandShape, DatagridFieldDirective, DieselShape, DollarBillForwardShape, DollarBillPartialShape, DriversAssistanceShape, EfficiencyShape, ElectricCarsServiceShape, ElectricCarsShape, ElectricityShape, EmissionShape, EnergyShape, EngineShape, ExpressServiceShape, ExteriorShape, ExternalPartForwardShape, FindACarShape, FleetServiceCommercialShape, FleetServicePrivateShape, GasCarsServiceShape, GasShape, HybridShape, InternalPartForwardShape, ItemsForwardShape, ItemsRecieveShape, LoadingVolumeShape, LocateShape, LocationBarComponent, LocationBarContentProvider, LocationBarNode, NewCarCommercialShape, NewCarPrivateShape, NewCarUtilityVehicleShape, NightServiceShape, NodeId, OffersShape, OnCallDutyShape, OpenSatShape, PaintMaterialForwardShape, PaintMaterialShape, PaintShopShape, PartNonStockForwardShape, PartsForwardShape, PartsNonStockShape, PartsShape, PayloadShape, PerformanceShape, PetrolShape, PlusServiceShape, PorscheBrandShape, PowerShape, PowerTrainShape, PriceTypeSwitchShape, QualifiedWorkshopShape, RoadsideAssistanceShape, RouteShape, SeatAirShape, SeatBrandShape, SeatShape, ServiceBellShape, ServiceShape, SizeShape, SkodaBrandShape, StatePersistenceKeyDirective, StockLocatorCommercialShape, StockLocatorPrivateShape, TaskAndAppointment, TaxiDealerShape, TextForward, TopcardShape, TouaregServiceShape, TransmissionAutomaticShape, TransmissionManualShape, TreetableCellRenderer, TreetableHeaderRenderer, TreetableMainRenderer, TreetableRowRenderer, UsedCarCommercialShape, UsedCarPrivateShape, VWBrandShape, VWNBrandShape, VWShape, VehicleConversionShape, View360Shape, VirtualRealityShape, WheelToWheelShape, WindscreenWashShape, WrenchForward, clrIconSVG, escapeHtml, escapeRegex };
7636
+ export { ACShape, AcceptedBrands, AccessoriesShape, AccessoryPartsShape, AudiBrandShape, AwardWinnerPremiumShape, BIG_ENDIAN, BlocksGroupForwardShape, BrochureShape, BundleForwardShape, BusinessCustomersCommercialShape, BusinessCustomersPrivateShape, BusinessPartnerWithCar, CLR_BLANK_OPTION, CONTENT_PROVIDER, CalculatorForwardShape, CaliforniaServiceShape, CaliforniaSpecialistShape, CampaignOutdatedShape, CampaignShape, CarPickupServiceShape, CarWashShape, CertifiedRepairShape, CertifiedRetailerShape, ClrActiveNotification, ClrAddonsIconShapes, ClrAddonsLabel, ClrAddonsModule, ClrAutocompleteOff, ClrAutocompleteOffModule, ClrBackButton, ClrBackButtonModule, ClrBrandAvatar, ClrBrandAvatarModule, ClrBreadcrumb, ClrBreadcrumbModule, ClrBreadcrumbService, ClrCollapseExpandSection, ClrCollapseExpandSectionModule, ClrContentPanel, ClrContentPanelContainer, ClrContentPanelContainerContent, ClrContentPanelContainerFooter, ClrContentPanelModule, ClrContentRef, ClrDataListPredefinedValidatorDirective, ClrDataListValidatorModule, ClrDataListValidators, ClrDatagridStatePersistenceModule, ClrDateFilterComponent, ClrDateFilterModule, ClrDateTimeContainer, ClrDateTimeModule, ClrDaterangeMaxValidator, ClrDaterangeMinValidator, ClrDaterangeOrderValidator, ClrDaterangeRequiredValidator, ClrDaterangepickerContainerComponent, ClrDaterangepickerDirective, ClrDaterangepickerModule, ClrDotPager, ClrDotPagerModule, ClrDropdownOverflowDirective, ClrDropdownOverflowModule, ClrEnumFilterComponent, ClrEnumFilterModule, ClrFlowBar, ClrFlowBarModule, ClrFormModule, ClrGenericQuickList, ClrGenericQuickListModule, ClrHistory, ClrHistoryModule, ClrHistoryPinned, ClrHistoryService, ClrIfDaterangeErrorDirective, ClrLetterAvatar, ClrLetterAvatarModule, ClrLocationBarModule, ClrMainNavGroup, ClrMainNavGroupItem, ClrMainNavGroupModule, ClrMaxNumeric, ClrMinNumeric, ClrMultilingualInput, ClrMultilingualInputValidators, ClrMultilingualModule, ClrMultilingualSelector, ClrMultilingualTextarea, ClrNotification, ClrNotificationModule, ClrNotificationRef, ClrNotificationService, ClrNumericField, ClrNumericFieldModule, ClrNumericFieldValidators, ClrPagedSearchResultList, ClrPagedSearchResultListModule, ClrPager, ClrPagerModule, ClrProgressSpinnerComponent, ClrProgressSpinnerModule, ClrQuickList, ClrQuickListModule, ClrRequiredAllMultilang, ClrRequiredOneMultilang, ClrSearchField, ClrSearchFieldModule, ClrTimeInput, ClrTreetable, ClrTreetableActionOverflow, ClrTreetableCell, ClrTreetableColumn, ClrTreetableModule, ClrTreetablePlaceholder, ClrTreetableRow, ClrViewEditSection, ClrViewEditSectionModule, ColumnHiddenStatePersistenceDirective, ConfiguratorCommercialShape, ConfiguratorPrivateShape, ConsumptionShape, ContactDealerShape, CupraBrandShape, CustomersCenterShape, DATE, DELIMITER_REGEX, DWABrandShape, DatagridFieldDirective, DayModel, DieselShape, DollarBillForwardShape, DollarBillPartialShape, DriversAssistanceShape, EfficiencyShape, ElectricCarsServiceShape, ElectricCarsShape, ElectricityShape, EmissionShape, EnergyShape, EngineShape, ExpressServiceShape, ExteriorShape, ExternalPartForwardShape, FindACarShape, FleetServiceCommercialShape, FleetServicePrivateShape, GasCarsServiceShape, GasShape, HybridShape, InternalPartForwardShape, ItemsForwardShape, ItemsRecieveShape, LITTLE_ENDIAN, LITTLE_ENDIAN_REGEX, LoadingVolumeShape, LocateShape, LocationBarComponent, LocationBarContentProvider, LocationBarNode, MIDDLE_ENDIAN, MIDDLE_ENDIAN_REGEX, MONTH, NewCarCommercialShape, NewCarPrivateShape, NewCarUtilityVehicleShape, NightServiceShape, NodeId, OffersShape, OnCallDutyShape, OpenSatShape, PaintMaterialForwardShape, PaintMaterialShape, PaintShopShape, PartNonStockForwardShape, PartsForwardShape, PartsNonStockShape, PartsShape, PayloadShape, PerformanceShape, PetrolShape, PlusServiceShape, PopoverPositions, PorscheBrandShape, PowerShape, PowerTrainShape, PriceTypeSwitchShape, QualifiedWorkshopShape, RoadsideAssistanceShape, RouteShape, SEPARATOR_TEXT_DEFAULT, SeatAirShape, SeatBrandShape, SeatShape, ServiceBellShape, ServiceShape, SizeShape, SkodaBrandShape, StatePersistenceKeyDirective, StockLocatorCommercialShape, StockLocatorPrivateShape, TRANSLATIONS, TaskAndAppointment, TaxiDealerShape, TextForward, TopcardShape, TouaregServiceShape, TransmissionAutomaticShape, TransmissionManualShape, TreetableCellRenderer, TreetableHeaderRenderer, TreetableMainRenderer, TreetableRowRenderer, USER_INPUT_REGEX, UsedCarCommercialShape, UsedCarPrivateShape, VWBrandShape, VWNBrandShape, VWShape, VehicleConversionShape, View360Shape, VirtualRealityShape, WheelToWheelShape, WindscreenWashShape, WrenchForward, YEAR, clrIconSVG, escapeHtml, escapeRegex };
5985
7637
  //# sourceMappingURL=clr-addons.mjs.map