@datarailsshared/datarailsshared 1.5.462 → 1.5.471

package/fesm2022/datarailsshared-datarailsshared.mjs

@@ -8,9 +8,9 @@ import { MAT_DATE_FORMATS, DateAdapter, MAT_DATE_LOCALE, MatNativeDateModule } f
 import moment from 'moment';
 import * as i1$2 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, FormGroup, FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { Observable, BehaviorSubject, Subject, combineLatest, noop as noop$3, from, merge as merge$1, fromEvent, first as first$1, takeUntil as takeUntil$1, map as map$2, filter as filter$2, switchMap as switchMap$1, interval, throwError } from 'rxjs';
+import { Observable, BehaviorSubject, Subject, combineLatest, noop as noop$3, from, merge as merge$1, fromEvent, filter as filter$1, switchMap as switchMap$1, map as map$2, withLatestFrom, first as first$1, takeUntil as takeUntil$1, interval, throwError } from 'rxjs';
 import * as _ from 'lodash';
-import { cloneDeep, find, reduce, isObject, isNil, map as map$1, isNumber, merge, forEach, some, orderBy, filter as filter$1, includes, indexOf, pull, concat, isString, isBoolean } from 'lodash';
+import { cloneDeep, find, reduce, isObject, isNil, map as map$1, isNumber, merge, forEach, some, orderBy, filter as filter$2, includes, indexOf, pull, concat, isString, isBoolean } from 'lodash';
 import { skip, takeUntil, distinctUntilChanged, startWith, map, tap, shareReplay, debounceTime, filter, switchMap, first, catchError, finalize } from 'rxjs/operators';
 import * as i1$3 from '@angular/material/datepicker';
 import { MatCalendar, MatDatepickerModule } from '@angular/material/datepicker';
@@ -1160,7 +1160,7 @@ class DrSelectComponent {
             i0.ɵɵproperty("ngIf", ctx.groupBy);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.type === "search-input");
-        } }, dependencies: [i1$2.NgControlStatus, i1$2.NgModel, i1.NgIf, i1.NgTemplateOutlet, i3.NgSelectComponent, i3.NgOptgroupTemplateDirective, i3.NgOptionTemplateDirective, i3.NgLabelTemplateDirective, i3.NgMultiLabelTemplateDirective, i3.NgHeaderTemplateDirective, i3.NgFooterTemplateDirective, i3.NgLoadingSpinnerTemplateDirective, DrSpinnerDirective], styles: ["[_nghost-%COMP%]{width:100%;height:32px;font-family:Poppins,sans-serif}.textView[_nghost-%COMP%] {width:auto}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container{border:none!important;cursor:pointer}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-value-container{padding:0;color:#4646ce}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-value-container:hover{text-decoration-line:underline}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none}.no-left-border-radius[_nghost-%COMP%]     ng-select.ng-select .ng-select-container{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.no-right-border-radius[_nghost-%COMP%]     ng-select.ng-select .ng-select-container{border-bottom-right-radius:0!important;border-top-right-radius:0!important}.no-right-border[_nghost-%COMP%]     ng-select.ng-select .ng-select-container{border-right:none!important}.no-left-border[_nghost-%COMP%]     ng-select.ng-select .ng-select-container{border-left:none!important}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px;border:1px solid #9ea1aa;box-shadow:none!important}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container:hover{border-color:#4646ce}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container:focus-within{border-color:#4646ce}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-input{top:0!important;line-height:30px;padding:0 50px 0 8px!important;color:#333;font-size:14px;font-weight:400}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-input input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 8px;height:100%;overflow:auto;font-size:14px;line-height:18px}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-arrow-wrapper{margin-right:7px}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:before{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#6d6e6f}[_nghost-%COMP%]     ng-select.ng-select.ng-select-opened .ng-select-container{border-radius:6px}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{max-height:58px;font-size:14px;line-height:18px}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#333;height:24px;padding:2px 16px;font-size:12px;margin:2px 4px 2px 0;background:#f0f1f4;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{line-height:20px;padding:0!important}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0!important;width:20px;display:flex;align-items:center;color:transparent;margin-left:4px}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:before{font-family:DataRails!important;content:\"\\ea60\";font-size:20px;color:#333}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon, [_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}[_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container, [_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container:hover, [_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#f0f1f4!important;border:1px solid #aeabac!important}[_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value, [_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value, [_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}[_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow{color:#aeabac}[_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow:before{color:#aeabac}[_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}[_nghost-%COMP%]     ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container, [_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#bf1d30}[_nghost-%COMP%]     ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container{max-height:88px}[_nghost-%COMP%]     ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container .ng-value-container{max-height:88px}[_nghost-%COMP%]     ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value, [_nghost-%COMP%]     ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value{padding:0}[_nghost-%COMP%]     ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value .ng-select-user-label, [_nghost-%COMP%]     ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-select-user-label{height:100%}.ng-invalid.ng-touched[_nghost-%COMP%]  ng-select.ng-select .ng-select-container{border-color:#bf1d30}[_nghost-%COMP%]   .dr-select__loading[_ngcontent-%COMP%]{position:relative;height:32px;width:24px}.search-input[_nghost-%COMP%]{position:relative}.search-input[_nghost-%COMP%]   .search-icon[_ngcontent-%COMP%]{position:absolute;top:4px;right:16px;color:#6d6e6f;z-index:1001}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container{border-radius:16px}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none!important}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-clear-wrapper{display:flex;justify-content:center;align-items:center;right:40px;top:1px;width:24px;height:24px}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-clear-wrapper .ng-clear{font-size:24px;font-weight:300;color:#6d6e6f}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-input, .search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 16px!important;width:calc(100% - 63px)}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-input input, .search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-value-container input{height:100%}  ng-dropdown-panel.ng-dropdown-panel.dr-select{font-family:Poppins,sans-serif;border:1px solid #dfe0e3;border-radius:4px!important;margin:8px 0;box-shadow:0 4px 8px 1px #00000040;background-color:#fff;overflow:hidden;padding:8px 0}  ng-dropdown-panel.ng-dropdown-panel.dr-select.textView{width:auto!important}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:8px 12px;font-size:14px;line-height:22px;background:#fff}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#f5f5f5}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected,   ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#eaeaff;color:#333}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span,   ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:400!important}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled{cursor:default}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div{color:#aeabac}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div.dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#aeabac}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]{font-size:14px;line-height:22px;color:#aeabac;cursor:default}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:not(:first-of-type){border-top:1px solid #dfe0e3}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:hover{background:#fff}  ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper{color:#333}  ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{max-width:fit-content;word-break:break-word;white-space:normal;color:#6d6e6f;font-weight:400;font-size:12px;line-height:20px}  ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description,   ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected.ng-option-marked .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#6d6e6f}"] }); }
+        } }, dependencies: [i1$2.NgControlStatus, i1$2.NgModel, i1.NgIf, i1.NgTemplateOutlet, i3.NgSelectComponent, i3.NgOptgroupTemplateDirective, i3.NgOptionTemplateDirective, i3.NgLabelTemplateDirective, i3.NgMultiLabelTemplateDirective, i3.NgHeaderTemplateDirective, i3.NgFooterTemplateDirective, i3.NgLoadingSpinnerTemplateDirective, DrSpinnerDirective], styles: ["[_nghost-%COMP%]{width:100%;height:32px;font-family:Poppins,sans-serif}.textView[_nghost-%COMP%] {width:auto}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container{border:none!important;cursor:pointer}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-value-container{padding:0;color:#4646ce}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-value-container:hover{text-decoration-line:underline}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none}.no-left-border-radius[_nghost-%COMP%]     ng-select.ng-select .ng-select-container{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.no-right-border-radius[_nghost-%COMP%]     ng-select.ng-select .ng-select-container{border-bottom-right-radius:0!important;border-top-right-radius:0!important}.no-right-border[_nghost-%COMP%]     ng-select.ng-select .ng-select-container{border-right:none!important}.no-left-border[_nghost-%COMP%]     ng-select.ng-select .ng-select-container{border-left:none!important}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px;border:1px solid #9ea1aa;box-shadow:none!important}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container:hover{border-color:#4646ce}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container:focus-within{border-color:#4646ce}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-input{top:0!important;line-height:30px;padding:0 50px 0 8px!important;color:#333;font-size:14px;font-weight:400}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-input input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 8px;height:100%;overflow:auto;font-size:14px;line-height:18px}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-arrow-wrapper{margin-right:7px}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}[_nghost-%COMP%]     ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:before{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#6d6e6f}[_nghost-%COMP%]     ng-select.ng-select.ng-select-opened .ng-select-container{border-radius:6px}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{max-height:58px;font-size:14px;line-height:18px}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#333;height:24px;padding:2px 16px;font-size:12px;margin:2px 4px 2px 0;background:#f0f1f4;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{line-height:20px;padding:0!important}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0!important;width:20px;display:flex;align-items:center;color:transparent;margin-left:4px}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:before{font-family:DataRails!important;content:\"\\ea60\";font-size:20px;color:#333}[_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon, [_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}[_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container, [_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container:hover, [_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#f0f1f4!important;border:1px solid #aeabac!important}[_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value, [_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value, [_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}[_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow{color:#aeabac}[_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow:before{color:#aeabac}[_nghost-%COMP%]     ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}[_nghost-%COMP%]     ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container, [_nghost-%COMP%]     ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#bf1d30}[_nghost-%COMP%]     ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container{max-height:88px}[_nghost-%COMP%]     ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container .ng-value-container{max-height:88px}[_nghost-%COMP%]     ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value, [_nghost-%COMP%]     ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value{padding:0}[_nghost-%COMP%]     ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value .ng-select-user-label, [_nghost-%COMP%]     ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-select-user-label{height:100%}.ng-invalid.ng-touched[_nghost-%COMP%]  ng-select.ng-select .ng-select-container{border-color:#bf1d30}[_nghost-%COMP%]   .dr-select__loading[_ngcontent-%COMP%]{position:relative;height:32px;width:24px}.search-input[_nghost-%COMP%]{position:relative}.search-input[_nghost-%COMP%]   .search-icon[_ngcontent-%COMP%]{position:absolute;top:4px;right:16px;color:#6d6e6f;z-index:1001}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container{border-radius:16px}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none!important}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-clear-wrapper{display:flex;justify-content:center;align-items:center;right:40px;top:1px;width:24px;height:24px}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-clear-wrapper .ng-clear{font-size:24px;font-weight:300;color:#6d6e6f}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-input, .search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 16px!important;width:calc(100% - 63px)}.search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-input input, .search-input[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-value-container input{height:100%}  ng-dropdown-panel.ng-dropdown-panel.dr-select{font-family:Poppins,sans-serif;border:1px solid #dfe0e3;border-radius:4px!important;margin:8px 0;box-shadow:0 4px 8px 1px #00000040;background-color:#fff;overflow:hidden;padding:8px 0}  ng-dropdown-panel.ng-dropdown-panel.dr-select.textView{width:auto!important}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:8px 12px;font-size:14px;line-height:22px;background:#fff}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#f5f5f5}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected,   ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#eaeaff;color:#333}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span,   ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:400!important}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled{cursor:default}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div{color:#aeabac}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div.dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#aeabac}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]{font-size:14px;line-height:22px;color:#aeabac;cursor:default}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:not(:first-of-type){border-top:1px solid #dfe0e3}  ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:hover{background:#fff}  ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper{color:#333}  ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{max-width:-moz-fit-content;max-width:fit-content;word-break:break-word;white-space:normal;color:#6d6e6f;font-weight:400;font-size:12px;line-height:20px}  ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description,   ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected.ng-option-marked .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#6d6e6f}"] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrSelectComponent, [{
         type: Component,
@@ -1170,7 +1170,7 @@ class DrSelectComponent {
                         useExisting: DrSelectComponent,
                         multi: true,
                     },
-                ], template: "<ng-select\n    [(ngModel)]=\"selectedItem\"\n    [items]=\"items\"\n    [bindLabel]=\"bindLabel\"\n    [bindValue]=\"bindValue\"\n    [multiple]=\"multiple\"\n    [addTag]=\"addTag\"\n    [appendTo]=\"appendTo\"\n    [clearable]=\"clearable\"\n    [searchable]=\"searchable\"\n    [hideSelected]=\"hideSelected\"\n    [placeholder]=\"placeholder\"\n    [loading]=\"loading\"\n    [loadingText]=\"loadingText\"\n    [readonly]=\"readonly\"\n    [closeOnSelect]=\"closeOnSelect\"\n    [disabled]=\"disabled\"\n    [id]=\"id\"\n    [maxSelectedItems]=\"maxSelectedItems\"\n    [keyDownFn]=\"keyDownFn\"\n    [searchFn]=\"searchFn\"\n    [isOpen]=\"(type !== 'search-input' || !!selectComponent.searchTerm?.length) && isOpen\"\n    [groupBy]=\"groupBy\"\n    [attr.autofocus]=\"autofocus\"\n    [selectOnTab]=\"selectOnTabKeyPress\"\n    (keydown.tab)=\"onTabKeypress($event)\"\n    (change)=\"onValueSelected(selectedItem)\"\n    (open)=\"open.emit($event); onDropdownOpen()\"\n    (close)=\"onClose($event)\"\n    class=\"dr-select\"\n    [class.ng-select--no-value-padding]=\"noValuePadding\"\n    [class.ng-select--multiple-height-increased]=\"multipleHeightIncreased\"\n    #selectComponent>\n    <ng-template *ngIf=\"optionHeaderTemplate\" ng-header-tmp let-item=\"item\">\n        <ng-container [ngTemplateOutlet]=\"optionHeaderTemplate\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-container>\n    </ng-template>\n    <ng-template *ngIf=\"labelTemplate\" ng-label-tmp let-item=\"item\">\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-container>\n    </ng-template>\n    <ng-template *ngIf=\"multiLabelTemplate\" ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\">\n        <ng-container [ngTemplateOutlet]=\"multiLabelTemplate\" [ngTemplateOutletContext]=\"{ items: items, clear: clear }\">\n        </ng-container>\n    </ng-template>\n    <ng-template *ngIf=\"optionTemplate\" ng-option-tmp let-item=\"item\" let-item$=\"item$\">\n        <ng-container [ngTemplateOutlet]=\"optionTemplate\" [ngTemplateOutletContext]=\"{ item: item, item$: item$ }\"></ng-container>\n    </ng-template>\n    <ng-template *ngIf=\"optionWithDescription\" ng-option-tmp let-item=\"item\">\n        <div class=\"dr-select__option-with-desc__wrapper\">\n            <div>{{ item.name }}</div>\n            <div class=\"dr-select__option-with-desc__description\">{{ item?.description }}</div>\n        </div>\n    </ng-template>\n    <ng-template *ngIf=\"optionFooterTemplate\" ng-footer-tmp let-item=\"item\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionFooterTemplate\"\n            [ngTemplateOutletContext]=\"{ item: item, close: selectComponent.close.bind(selectComponent) }\"></ng-container>\n    </ng-template>\n    <ng-template *ngIf=\"groupBy\" ng-optgroup-tmp let-item=\"item\">\n        {{ item[groupBy] }}\n    </ng-template>\n    <ng-template ng-loadingspinner-tmp>\n        <div\n            *ngIf=\"loading\"\n            class=\"dr-select__loading\"\n            [drSpinner]=\"loading\"\n            [drSpinnerType]=\"'circle'\"\n            [drSpinnerSize]=\"'small'\"\n            [drSpinnerNoOverlay]=\"true\"></div>\n    </ng-template>\n</ng-select>\n<i *ngIf=\"type === 'search-input'\" class=\"search-icon dr-icon-search\"></i>\n", styles: [":host{width:100%;height:32px;font-family:Poppins,sans-serif}:host.textView::ng-deep{width:auto}:host.textView::ng-deep ng-select.ng-select .ng-select-container{border:none!important;cursor:pointer}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0;color:#4646ce}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-value-container:hover{text-decoration-line:underline}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none}:host.no-left-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-left-radius:0!important;border-top-left-radius:0!important}:host.no-right-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-right-radius:0!important;border-top-right-radius:0!important}:host.no-right-border ::ng-deep ng-select.ng-select .ng-select-container{border-right:none!important}:host.no-left-border ::ng-deep ng-select.ng-select .ng-select-container{border-left:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px;border:1px solid #9ea1aa;box-shadow:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container:hover{border-color:#4646ce}:host ::ng-deep ng-select.ng-select .ng-select-container:focus-within{border-color:#4646ce}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input{top:0!important;line-height:30px;padding:0 50px 0 8px!important;color:#333;font-size:14px;font-weight:400}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 8px;height:100%;overflow:auto;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{margin-right:7px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:before{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#6d6e6f}:host ::ng-deep ng-select.ng-select.ng-select-opened .ng-select-container{border-radius:6px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{max-height:58px;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#333;height:24px;padding:2px 16px;font-size:12px;margin:2px 4px 2px 0;background:#f0f1f4;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{line-height:20px;padding:0!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0!important;width:20px;display:flex;align-items:center;color:transparent;margin-left:4px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:before{font-family:DataRails!important;content:\"\\ea60\";font-size:20px;color:#333}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon,:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#f0f1f4!important;border:1px solid #aeabac!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow:before{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#bf1d30}:host ::ng-deep ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container{max-height:88px}:host ::ng-deep ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container .ng-value-container{max-height:88px}:host ::ng-deep ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value,:host ::ng-deep ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value{padding:0}:host ::ng-deep ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value .ng-select-user-label,:host ::ng-deep ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-select-user-label{height:100%}:host.ng-invalid.ng-touched::ng-deep ng-select.ng-select .ng-select-container{border-color:#bf1d30}:host .dr-select__loading{position:relative;height:32px;width:24px}:host.search-input{position:relative}:host.search-input .search-icon{position:absolute;top:4px;right:16px;color:#6d6e6f;z-index:1001}:host.search-input::ng-deep ng-select.ng-select .ng-select-container{border-radius:16px}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none!important}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-clear-wrapper{display:flex;justify-content:center;align-items:center;right:40px;top:1px;width:24px;height:24px}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-clear-wrapper .ng-clear{font-size:24px;font-weight:300;color:#6d6e6f}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-input,:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 16px!important;width:calc(100% - 63px)}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-input input,:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-value-container input{height:100%}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select{font-family:Poppins,sans-serif;border:1px solid #dfe0e3;border-radius:4px!important;margin:8px 0;box-shadow:0 4px 8px 1px #00000040;background-color:#fff;overflow:hidden;padding:8px 0}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.textView{width:auto!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:8px 12px;font-size:14px;line-height:22px;background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#f5f5f5}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#eaeaff;color:#333}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:400!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled{cursor:default}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div{color:#aeabac}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div.dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#aeabac}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]{font-size:14px;line-height:22px;color:#aeabac;cursor:default}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:not(:first-of-type){border-top:1px solid #dfe0e3}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:hover{background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper{color:#333}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{max-width:fit-content;word-break:break-word;white-space:normal;color:#6d6e6f;font-weight:400;font-size:12px;line-height:20px}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected.ng-option-marked .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#6d6e6f}\n"] }]
+                ], template: "<ng-select\n    [(ngModel)]=\"selectedItem\"\n    [items]=\"items\"\n    [bindLabel]=\"bindLabel\"\n    [bindValue]=\"bindValue\"\n    [multiple]=\"multiple\"\n    [addTag]=\"addTag\"\n    [appendTo]=\"appendTo\"\n    [clearable]=\"clearable\"\n    [searchable]=\"searchable\"\n    [hideSelected]=\"hideSelected\"\n    [placeholder]=\"placeholder\"\n    [loading]=\"loading\"\n    [loadingText]=\"loadingText\"\n    [readonly]=\"readonly\"\n    [closeOnSelect]=\"closeOnSelect\"\n    [disabled]=\"disabled\"\n    [id]=\"id\"\n    [maxSelectedItems]=\"maxSelectedItems\"\n    [keyDownFn]=\"keyDownFn\"\n    [searchFn]=\"searchFn\"\n    [isOpen]=\"(type !== 'search-input' || !!selectComponent.searchTerm?.length) && isOpen\"\n    [groupBy]=\"groupBy\"\n    [attr.autofocus]=\"autofocus\"\n    [selectOnTab]=\"selectOnTabKeyPress\"\n    (keydown.tab)=\"onTabKeypress($event)\"\n    (change)=\"onValueSelected(selectedItem)\"\n    (open)=\"open.emit($event); onDropdownOpen()\"\n    (close)=\"onClose($event)\"\n    class=\"dr-select\"\n    [class.ng-select--no-value-padding]=\"noValuePadding\"\n    [class.ng-select--multiple-height-increased]=\"multipleHeightIncreased\"\n    #selectComponent>\n    <ng-template *ngIf=\"optionHeaderTemplate\" ng-header-tmp let-item=\"item\">\n        <ng-container [ngTemplateOutlet]=\"optionHeaderTemplate\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-container>\n    </ng-template>\n    <ng-template *ngIf=\"labelTemplate\" ng-label-tmp let-item=\"item\">\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-container>\n    </ng-template>\n    <ng-template *ngIf=\"multiLabelTemplate\" ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\">\n        <ng-container [ngTemplateOutlet]=\"multiLabelTemplate\" [ngTemplateOutletContext]=\"{ items: items, clear: clear }\">\n        </ng-container>\n    </ng-template>\n    <ng-template *ngIf=\"optionTemplate\" ng-option-tmp let-item=\"item\" let-item$=\"item$\">\n        <ng-container [ngTemplateOutlet]=\"optionTemplate\" [ngTemplateOutletContext]=\"{ item: item, item$: item$ }\"></ng-container>\n    </ng-template>\n    <ng-template *ngIf=\"optionWithDescription\" ng-option-tmp let-item=\"item\">\n        <div class=\"dr-select__option-with-desc__wrapper\">\n            <div>{{ item.name }}</div>\n            <div class=\"dr-select__option-with-desc__description\">{{ item?.description }}</div>\n        </div>\n    </ng-template>\n    <ng-template *ngIf=\"optionFooterTemplate\" ng-footer-tmp let-item=\"item\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionFooterTemplate\"\n            [ngTemplateOutletContext]=\"{ item: item, close: selectComponent.close.bind(selectComponent) }\"></ng-container>\n    </ng-template>\n    <ng-template *ngIf=\"groupBy\" ng-optgroup-tmp let-item=\"item\">\n        {{ item[groupBy] }}\n    </ng-template>\n    <ng-template ng-loadingspinner-tmp>\n        <div\n            *ngIf=\"loading\"\n            class=\"dr-select__loading\"\n            [drSpinner]=\"loading\"\n            [drSpinnerType]=\"'circle'\"\n            [drSpinnerSize]=\"'small'\"\n            [drSpinnerNoOverlay]=\"true\"></div>\n    </ng-template>\n</ng-select>\n<i *ngIf=\"type === 'search-input'\" class=\"search-icon dr-icon-search\"></i>\n", styles: [":host{width:100%;height:32px;font-family:Poppins,sans-serif}:host.textView::ng-deep{width:auto}:host.textView::ng-deep ng-select.ng-select .ng-select-container{border:none!important;cursor:pointer}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0;color:#4646ce}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-value-container:hover{text-decoration-line:underline}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none}:host.no-left-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-left-radius:0!important;border-top-left-radius:0!important}:host.no-right-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-right-radius:0!important;border-top-right-radius:0!important}:host.no-right-border ::ng-deep ng-select.ng-select .ng-select-container{border-right:none!important}:host.no-left-border ::ng-deep ng-select.ng-select .ng-select-container{border-left:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px;border:1px solid #9ea1aa;box-shadow:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container:hover{border-color:#4646ce}:host ::ng-deep ng-select.ng-select .ng-select-container:focus-within{border-color:#4646ce}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input{top:0!important;line-height:30px;padding:0 50px 0 8px!important;color:#333;font-size:14px;font-weight:400}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 8px;height:100%;overflow:auto;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{margin-right:7px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:before{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#6d6e6f}:host ::ng-deep ng-select.ng-select.ng-select-opened .ng-select-container{border-radius:6px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{max-height:58px;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#333;height:24px;padding:2px 16px;font-size:12px;margin:2px 4px 2px 0;background:#f0f1f4;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{line-height:20px;padding:0!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0!important;width:20px;display:flex;align-items:center;color:transparent;margin-left:4px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:before{font-family:DataRails!important;content:\"\\ea60\";font-size:20px;color:#333}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon,:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#f0f1f4!important;border:1px solid #aeabac!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow:before{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#bf1d30}:host ::ng-deep ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container{max-height:88px}:host ::ng-deep ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container .ng-value-container{max-height:88px}:host ::ng-deep ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value,:host ::ng-deep ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value{padding:0}:host ::ng-deep ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value .ng-select-user-label,:host ::ng-deep ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-select-user-label{height:100%}:host.ng-invalid.ng-touched::ng-deep ng-select.ng-select .ng-select-container{border-color:#bf1d30}:host .dr-select__loading{position:relative;height:32px;width:24px}:host.search-input{position:relative}:host.search-input .search-icon{position:absolute;top:4px;right:16px;color:#6d6e6f;z-index:1001}:host.search-input::ng-deep ng-select.ng-select .ng-select-container{border-radius:16px}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none!important}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-clear-wrapper{display:flex;justify-content:center;align-items:center;right:40px;top:1px;width:24px;height:24px}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-clear-wrapper .ng-clear{font-size:24px;font-weight:300;color:#6d6e6f}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-input,:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 16px!important;width:calc(100% - 63px)}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-input input,:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-value-container input{height:100%}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select{font-family:Poppins,sans-serif;border:1px solid #dfe0e3;border-radius:4px!important;margin:8px 0;box-shadow:0 4px 8px 1px #00000040;background-color:#fff;overflow:hidden;padding:8px 0}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.textView{width:auto!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:8px 12px;font-size:14px;line-height:22px;background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#f5f5f5}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#eaeaff;color:#333}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:400!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled{cursor:default}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div{color:#aeabac}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div.dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#aeabac}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]{font-size:14px;line-height:22px;color:#aeabac;cursor:default}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:not(:first-of-type){border-top:1px solid #dfe0e3}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:hover{background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper{color:#333}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{max-width:-moz-fit-content;max-width:fit-content;word-break:break-word;white-space:normal;color:#6d6e6f;font-weight:400;font-size:12px;line-height:20px}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected.ng-option-marked .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#6d6e6f}\n"] }]
     }], function () { return [{ type: i0.ElementRef }]; }, { type: [{
             type: Input
         }, {
@@ -4498,7 +4498,7 @@ class DrDatePickerWithTimeframeComponent extends DrDatePickerComponent {
             i0.ɵɵproperty("ngIf", !ctx.disabled);
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("calendarHeaderComponent", ctx.customHeader)("panelClass", ctx.datePickerService.isUsingDateTagPresets ? "date-picker-preset-tag" : "dr-timeframe-datepicker");
-        } }, dependencies: [i1$2.DefaultValueAccessor, i1$2.NgControlStatus, i1$2.NgModel, i1.NgIf, i1.NgTemplateOutlet, i1$3.MatDatepicker, i1$3.MatDatepickerInput, DrTooltipDirective, DrButtonComponent, i1.AsyncPipe], styles: ["[_nghost-%COMP%]{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9ea1aa;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}[_nghost-%COMP%]:hover{border-color:#9ea1aa}.active[_nghost-%COMP%], [_nghost-%COMP%]:focus-within{border-color:#4646ce!important;color:#333}.disabled[_nghost-%COMP%]{pointer-events:none;border:1px solid #aeabac;background:#f0f1f4;color:#aeabac}.disabled[_nghost-%COMP%]:after{color:#aeabac}.ng-valid.ng-dirty[_nghost-%COMP%]{border-color:#037c5a}.ng-invalid.ng-dirty[_nghost-%COMP%]:not(:focus-within){border-color:#bf1d30!important}.ng-untouched.ng-valid[_nghost-%COMP%]{border-color:#9ea1aa}[_nghost-%COMP%]:after, [_nghost-%COMP%]:before{position:absolute;display:flex;border-color:#6d6e6f transparent transparent;color:#6d6e6f}[_nghost-%COMP%]:after{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}[_nghost-%COMP%]   i[_ngcontent-%COMP%]{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}[_nghost-%COMP%]   input[_ngcontent-%COMP%]{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}[_nghost-%COMP%]   input.when-quarter[_ngcontent-%COMP%]{position:absolute;visibility:hidden}[_nghost-%COMP%]   input[_ngcontent-%COMP%]:disabled{border:none;color:#aeabac;background:transparent}[_nghost-%COMP%]   input[_ngcontent-%COMP%]::-webkit-search-decoration, [_nghost-%COMP%]   input[_ngcontent-%COMP%]::-webkit-search-cancel-button, [_nghost-%COMP%]   input[_ngcontent-%COMP%]::-webkit-search-results-button, [_nghost-%COMP%]   input[_ngcontent-%COMP%]::-webkit-search-results-decoration{-webkit-appearance:none}[_nghost-%COMP%]   input[_ngcontent-%COMP%]::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}  .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}  .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}  .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}  .mat-datepicker-popup .cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),   .mat-datepicker-popup .cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#fff}  .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#f2f2fb;color:#4646ce;font-weight:600}  .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}  .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}  .mat-datepicker-popup .mat-button-focus-overlay{background:#f5f5f5}  .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#f5f5f5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}  .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#f5f5f5;transition:background .2s cubic-bezier(.35,0,.25,1)}  .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}  .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}  .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}  .mat-datepicker-popup .mat-calendar-body>tr[aria-hidden=true]>.mat-calendar-body-label{display:none}[_nghost-%COMP%]{border:none;display:flex;align-items:center}.disabled[_nghost-%COMP%]{background:transparent;color:#aeabac}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%]{border:none;padding:0 8px}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%]   .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{text-decoration:none;color:#aeabac;font-weight:400}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%]   .dr-datepicker-input-container[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]{color:#aeabac}.dr-date-picker-on-dashboard[_nghost-%COMP%]{width:fit-content;justify-content:space-between}.dr-date-picker-on-dashboard[_nghost-%COMP%]   mat-datepicker[_ngcontent-%COMP%]{position:absolute}.dr-date-picker-on-dashboard[_nghost-%COMP%]:after{visibility:hidden}.dr-date-picker-on-dashboard[_nghost-%COMP%]   .dr-datepicker-input-container[_ngcontent-%COMP%]{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}.dr-date-picker-on-dashboard[_nghost-%COMP%]   .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{font-weight:600;width:auto;margin-left:5px}.dr-date-picker-on-dashboard[_nghost-%COMP%]   .dr-datepicker-input-container[_ngcontent-%COMP%]   .dr-icon-date[_ngcontent-%COMP%]{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}[_nghost-%COMP%]   .dr-datepicker-input-container[_ngcontent-%COMP%]   input[_ngcontent-%COMP%]{visibility:hidden;position:absolute;width:100%}[_nghost-%COMP%]   .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{width:90px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}[_nghost-%COMP%]   .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce}  .date-picker-preset-tag{width:386px!important}  .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}@media screen and (max-width: 410px){.mat-datepicker-input[_ngcontent-%COMP%]{width:100vw!important}  .date-picker-preset-tag{width:calc(100vw - 16px)!important}  .date-picker-preset-tag .dr-datepicker-preset-date__tags{justify-content:center;margin-left:-32px;margin-right:-32px}  .date-picker-preset-tag .dr-datepicker-preset-date__tags__tag{font-size:10px}}"], changeDetection: 0 }); }
+        } }, dependencies: [i1$2.DefaultValueAccessor, i1$2.NgControlStatus, i1$2.NgModel, i1.NgIf, i1.NgTemplateOutlet, i1$3.MatDatepicker, i1$3.MatDatepickerInput, DrTooltipDirective, DrButtonComponent, i1.AsyncPipe], styles: ["[_nghost-%COMP%]{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9ea1aa;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}[_nghost-%COMP%]:hover{border-color:#9ea1aa}.active[_nghost-%COMP%], [_nghost-%COMP%]:focus-within{border-color:#4646ce!important;color:#333}.disabled[_nghost-%COMP%]{pointer-events:none;border:1px solid #aeabac;background:#f0f1f4;color:#aeabac}.disabled[_nghost-%COMP%]:after{color:#aeabac}.ng-valid.ng-dirty[_nghost-%COMP%]{border-color:#037c5a}.ng-invalid.ng-dirty[_nghost-%COMP%]:not(:focus-within){border-color:#bf1d30!important}.ng-untouched.ng-valid[_nghost-%COMP%]{border-color:#9ea1aa}[_nghost-%COMP%]:after, [_nghost-%COMP%]:before{position:absolute;display:flex;border-color:#6d6e6f transparent transparent;color:#6d6e6f}[_nghost-%COMP%]:after{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}[_nghost-%COMP%]   i[_ngcontent-%COMP%]{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}[_nghost-%COMP%]   input[_ngcontent-%COMP%]{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}[_nghost-%COMP%]   input.when-quarter[_ngcontent-%COMP%]{position:absolute;visibility:hidden}[_nghost-%COMP%]   input[_ngcontent-%COMP%]:disabled{border:none;color:#aeabac;background:transparent}[_nghost-%COMP%]   input[_ngcontent-%COMP%]::-webkit-search-decoration, [_nghost-%COMP%]   input[_ngcontent-%COMP%]::-webkit-search-cancel-button, [_nghost-%COMP%]   input[_ngcontent-%COMP%]::-webkit-search-results-button, [_nghost-%COMP%]   input[_ngcontent-%COMP%]::-webkit-search-results-decoration{-webkit-appearance:none}[_nghost-%COMP%]   input[_ngcontent-%COMP%]::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}  .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}  .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}  .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}  .mat-datepicker-popup .cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),   .mat-datepicker-popup .cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#fff}  .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#f2f2fb;color:#4646ce;font-weight:600}  .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}  .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}  .mat-datepicker-popup .mat-button-focus-overlay{background:#f5f5f5}  .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#f5f5f5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}  .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#f5f5f5;transition:background .2s cubic-bezier(.35,0,.25,1)}  .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}  .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}  .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}  .mat-datepicker-popup .mat-calendar-body>tr[aria-hidden=true]>.mat-calendar-body-label{display:none}[_nghost-%COMP%]{border:none;display:flex;align-items:center}.disabled[_nghost-%COMP%]{background:transparent;color:#aeabac}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%]{border:none;padding:0 8px}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%]   .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{text-decoration:none;color:#aeabac;font-weight:400}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%]   .dr-datepicker-input-container[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]{color:#aeabac}.dr-date-picker-on-dashboard[_nghost-%COMP%]{width:-moz-fit-content;width:fit-content;justify-content:space-between}.dr-date-picker-on-dashboard[_nghost-%COMP%]   mat-datepicker[_ngcontent-%COMP%]{position:absolute}.dr-date-picker-on-dashboard[_nghost-%COMP%]:after{visibility:hidden}.dr-date-picker-on-dashboard[_nghost-%COMP%]   .dr-datepicker-input-container[_ngcontent-%COMP%]{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}.dr-date-picker-on-dashboard[_nghost-%COMP%]   .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{font-weight:600;width:auto;margin-left:5px}.dr-date-picker-on-dashboard[_nghost-%COMP%]   .dr-datepicker-input-container[_ngcontent-%COMP%]   .dr-icon-date[_ngcontent-%COMP%]{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}[_nghost-%COMP%]   .dr-datepicker-input-container[_ngcontent-%COMP%]   input[_ngcontent-%COMP%]{visibility:hidden;position:absolute;width:100%}[_nghost-%COMP%]   .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{width:90px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}[_nghost-%COMP%]   .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce}  .date-picker-preset-tag{width:386px!important}  .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}@media screen and (max-width: 410px){.mat-datepicker-input[_ngcontent-%COMP%]{width:100vw!important}  .date-picker-preset-tag{width:calc(100vw - 16px)!important}  .date-picker-preset-tag .dr-datepicker-preset-date__tags{justify-content:center;margin-left:-32px;margin-right:-32px}  .date-picker-preset-tag .dr-datepicker-preset-date__tags__tag{font-size:10px}}"], changeDetection: 0 }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrDatePickerWithTimeframeComponent, [{
         type: Component,
@@ -4506,7 +4506,7 @@ class DrDatePickerWithTimeframeComponent extends DrDatePickerComponent {
                     { provide: NG_VALUE_ACCESSOR, useExisting: DrDatePickerWithTimeframeComponent, multi: true },
                     { provide: DateAdapter, useClass: CustomDateAdapter },
                     { provide: DrDatePickerService },
-                ], template: "<dr-button\n    [disabled]=\"isPrevDateDisabled\"\n    *ngIf=\"!disabled\"\n    theme=\"icon\"\n    icon=\"dr-icon-arrow-left\"\n    (click)=\"pagingClicked(false)\"></dr-button>\n<div\n    [drTooltip]=\"datepickerTooltip\"\n    [drTooltipPosition]=\"datepickerTooltipPosition\"\n    [drTooltipMousleaveTimeout]=\"datepickerTooltipTimeout\"\n    class=\"dr-datepicker-input-container\">\n    <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n    <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n        <ng-container\n            [ngTemplateOutlet]=\"formattedValueTmpl\"\n            [ngTemplateOutletContext]=\"{\n                formattedValue: displayedFormattedValue$ | async\n            }\">\n        </ng-container>\n        <ng-template #formattedValueTmpl let-value=\"formattedValue\">\n            <span>\n                {{\n                    datePickerService.isUsingDateTagPresets && !!presetTagSelected\n                        ? presetTagSelected + ' (' + value + ')'\n                        : value\n                }}\n            </span>\n        </ng-template>\n    </div>\n    <input\n        #datepickerInput\n        [ngModel]=\"displayValue$ | async\"\n        (ngModelChange)=\"valueChangedInCalendar($event)\"\n        (click)=\"datePicker.open()\"\n        [matDatepicker]=\"datePicker\"\n        [readonly]=\"readonly\"\n        [min]=\"_min\"\n        [max]=\"_max\" />\n</div>\n<dr-button\n    [disabled]=\"isNextDateDisabled\"\n    *ngIf=\"!disabled\"\n    theme=\"icon\"\n    icon=\"dr-icon-arrow-right\"\n    (click)=\"pagingClicked(true)\"></dr-button>\n<mat-datepicker\n    #datePicker\n    class=\"dr-timeframe-datepicker\"\n    [calendarHeaderComponent]=\"customHeader\"\n    (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR)\"\n    (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH)\"\n    (opened)=\"onOpen()\"\n    (closed)=\"onCLose()\"\n    [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\">\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9ea1aa;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #aeabac;background:#f0f1f4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6d6e6f transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),::ng-deep .mat-datepicker-popup .cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#fff}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#f2f2fb;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#f5f5f5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#f5f5f5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#f5f5f5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}::ng-deep .mat-datepicker-popup .mat-calendar-body>tr[aria-hidden=true]>.mat-calendar-body-label{display:none}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:#aeabac}:host.disabled.dr-date-picker-on-dashboard{border:none;padding:0 8px}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{text-decoration:none;color:#aeabac;font-weight:400}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container i{color:#aeabac}:host.dr-date-picker-on-dashboard{width:fit-content;justify-content:space-between}:host.dr-date-picker-on-dashboard mat-datepicker{position:absolute}:host.dr-date-picker-on-dashboard:after{visibility:hidden}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{font-weight:600;width:auto;margin-left:5px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container .dr-icon-date{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}:host .dr-datepicker-input-container input{visibility:hidden;position:absolute;width:100%}:host .dr-datepicker-input-container__formatted-value-display{width:90px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}:host .dr-datepicker-input-container__formatted-value-display:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce}::ng-deep .date-picker-preset-tag{width:386px!important}::ng-deep .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}@media screen and (max-width: 410px){.mat-datepicker-input{width:100vw!important}::ng-deep .date-picker-preset-tag{width:calc(100vw - 16px)!important}::ng-deep .date-picker-preset-tag .dr-datepicker-preset-date__tags{justify-content:center;margin-left:-32px;margin-right:-32px}::ng-deep .date-picker-preset-tag .dr-datepicker-preset-date__tags__tag{font-size:10px}}\n"] }]
+                ], template: "<dr-button\n    [disabled]=\"isPrevDateDisabled\"\n    *ngIf=\"!disabled\"\n    theme=\"icon\"\n    icon=\"dr-icon-arrow-left\"\n    (click)=\"pagingClicked(false)\"></dr-button>\n<div\n    [drTooltip]=\"datepickerTooltip\"\n    [drTooltipPosition]=\"datepickerTooltipPosition\"\n    [drTooltipMousleaveTimeout]=\"datepickerTooltipTimeout\"\n    class=\"dr-datepicker-input-container\">\n    <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n    <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n        <ng-container\n            [ngTemplateOutlet]=\"formattedValueTmpl\"\n            [ngTemplateOutletContext]=\"{\n                formattedValue: displayedFormattedValue$ | async\n            }\">\n        </ng-container>\n        <ng-template #formattedValueTmpl let-value=\"formattedValue\">\n            <span>\n                {{\n                    datePickerService.isUsingDateTagPresets && !!presetTagSelected\n                        ? presetTagSelected + ' (' + value + ')'\n                        : value\n                }}\n            </span>\n        </ng-template>\n    </div>\n    <input\n        #datepickerInput\n        [ngModel]=\"displayValue$ | async\"\n        (ngModelChange)=\"valueChangedInCalendar($event)\"\n        (click)=\"datePicker.open()\"\n        [matDatepicker]=\"datePicker\"\n        [readonly]=\"readonly\"\n        [min]=\"_min\"\n        [max]=\"_max\" />\n</div>\n<dr-button\n    [disabled]=\"isNextDateDisabled\"\n    *ngIf=\"!disabled\"\n    theme=\"icon\"\n    icon=\"dr-icon-arrow-right\"\n    (click)=\"pagingClicked(true)\"></dr-button>\n<mat-datepicker\n    #datePicker\n    class=\"dr-timeframe-datepicker\"\n    [calendarHeaderComponent]=\"customHeader\"\n    (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR)\"\n    (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH)\"\n    (opened)=\"onOpen()\"\n    (closed)=\"onCLose()\"\n    [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\">\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9ea1aa;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #aeabac;background:#f0f1f4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6d6e6f transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),::ng-deep .mat-datepicker-popup .cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#fff}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#f2f2fb;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#f5f5f5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#f5f5f5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#f5f5f5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}::ng-deep .mat-datepicker-popup .mat-calendar-body>tr[aria-hidden=true]>.mat-calendar-body-label{display:none}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:#aeabac}:host.disabled.dr-date-picker-on-dashboard{border:none;padding:0 8px}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{text-decoration:none;color:#aeabac;font-weight:400}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container i{color:#aeabac}:host.dr-date-picker-on-dashboard{width:-moz-fit-content;width:fit-content;justify-content:space-between}:host.dr-date-picker-on-dashboard mat-datepicker{position:absolute}:host.dr-date-picker-on-dashboard:after{visibility:hidden}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{font-weight:600;width:auto;margin-left:5px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container .dr-icon-date{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}:host .dr-datepicker-input-container input{visibility:hidden;position:absolute;width:100%}:host .dr-datepicker-input-container__formatted-value-display{width:90px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}:host .dr-datepicker-input-container__formatted-value-display:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce}::ng-deep .date-picker-preset-tag{width:386px!important}::ng-deep .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}@media screen and (max-width: 410px){.mat-datepicker-input{width:100vw!important}::ng-deep .date-picker-preset-tag{width:calc(100vw - 16px)!important}::ng-deep .date-picker-preset-tag .dr-datepicker-preset-date__tags{justify-content:center;margin-left:-32px;margin-right:-32px}::ng-deep .date-picker-preset-tag .dr-datepicker-preset-date__tags__tag{font-size:10px}}\n"] }]
     }], function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$4.DateAdapter }, { type: DrDatePickerService }]; }, { isDashboardClassDisplayed: [{
             type: HostBinding,
             args: ['class.dr-date-picker-on-dashboard']
@@ -6688,23 +6688,25 @@ class DrCodemirrorComponent {
             args: ['ref']
         }] }); })();
 
-function DrErrorComponent_div_0_i_1_Template(rf, ctx) { if (rf & 1) {
+function DrErrorComponent_div_0_i_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "i", 3);
 } }
 function DrErrorComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 1);
-    i0.ɵɵtemplate(1, DrErrorComponent_div_0_i_1_Template, 1, 0, "i", 2);
-    i0.ɵɵelementStart(2, "span");
-    i0.ɵɵtext(3);
+    i0.ɵɵpipe(1, "async");
+    i0.ɵɵtemplate(2, DrErrorComponent_div_0_i_2_Template, 1, 0, "i", 2);
+    i0.ɵɵelementStart(3, "span");
+    i0.ɵɵtext(4);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
+    const error_r1 = ctx.ngIf;
     const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵclassProp("error-container--cursor-pointer", !ctx_r0.displayAsLabel)("warning", ctx_r0.isWarning);
-    i0.ɵɵproperty("drTooltip", ctx_r0.displayAsLabel ? null : ctx_r0.errorString)("drTooltipPosition", ctx_r0.errorTooltipPosition);
-    i0.ɵɵadvance(1);
+    i0.ɵɵclassProp("error-container--cursor-pointer", !ctx_r0.displayAsLabel)("warning", i0.ɵɵpipeBind1(1, 8, ctx_r0.warning$));
+    i0.ɵɵproperty("drTooltip", ctx_r0.displayAsLabel ? null : error_r1)("drTooltipPosition", ctx_r0.errorTooltipPosition);
+    i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", !ctx_r0.noIcon);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r0.displayAsLabel ? ctx_r0.errorString : ctx_r0.label);
+    i0.ɵɵtextInterpolate(error_r1);
 } }
 class DrErrorComponent {
     constructor(formGroupDirective) {
@@ -6713,10 +6715,14 @@ class DrErrorComponent {
         this.errorTooltipPosition = 'top';
         this.displayAsLabel = false;
         this.noIcon = false;
+        this.controlChange$ = new BehaviorSubject(null);
+        this.controlErrorStatus$ = this.controlChange$.pipe(filter$1(Boolean), switchMap$1((control) => control.statusChanges.pipe().pipe(map$2(() => control))), map$2((control) => control.status === 'INVALID' && !control.pristine));
+        this.error$ = this.controlErrorStatus$.pipe(withLatestFrom(this.controlChange$), map$2(([show, control]) => [show, this.displayAsLabel ? this.errorString(control) : this.label]), map$2(([show, label]) => (show ? label : null)));
+        this.warning$ = this.controlChange$.pipe(map$2((control) => !!control.errors?.isWarning));
     }
     set control(value) {
         if (value) {
-            this._control = value;
+            this.controlChange$.next(value);
         }
     }
     set controlName(value) {
@@ -6727,27 +6733,25 @@ class DrErrorComponent {
         }
         this.control = this.formGroupDirective.control.get(value);
     }
-    get errorString() {
-        if (this._control.hasError('required')) {
+    errorString(control) {
+        if (control.hasError('required')) {
             return 'Field is required!';
         }
-        return this._control.errors?.errorString || null;
-    }
-    get isWarning() {
-        return this._control.errors?.isWarning;
+        return control.errors?.errorString || null;
     }
     /** @nocollapse */ static { this.ɵfac = function DrErrorComponent_Factory(t) { return new (t || DrErrorComponent)(i0.ɵɵdirectiveInject(i1$2.FormGroupDirective, 8)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrErrorComponent, selectors: [["dr-error"]], hostVars: 2, hostBindings: function DrErrorComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassProp("no-icon", ctx.noIcon);
-        } }, inputs: { control: "control", controlName: "controlName", label: "label", errorTooltipPosition: "errorTooltipPosition", displayAsLabel: "displayAsLabel", noIcon: "noIcon" }, decls: 1, vars: 1, consts: [["class", "error-container", 3, "drTooltip", "drTooltipPosition", "error-container--cursor-pointer", "warning", 4, "ngIf"], [1, "error-container", 3, "drTooltip", "drTooltipPosition"], ["class", "dr-icon-status-error", 4, "ngIf"], [1, "dr-icon-status-error"]], template: function DrErrorComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, DrErrorComponent_div_0_Template, 4, 8, "div", 0);
+        } }, inputs: { control: "control", controlName: "controlName", label: "label", errorTooltipPosition: "errorTooltipPosition", displayAsLabel: "displayAsLabel", noIcon: "noIcon" }, decls: 2, vars: 3, consts: [["class", "error-container", 3, "drTooltip", "drTooltipPosition", "error-container--cursor-pointer", "warning", 4, "ngIf"], [1, "error-container", 3, "drTooltip", "drTooltipPosition"], ["class", "dr-icon-status-error", 4, "ngIf"], [1, "dr-icon-status-error"]], template: function DrErrorComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵtemplate(0, DrErrorComponent_div_0_Template, 5, 10, "div", 0);
+            i0.ɵɵpipe(1, "async");
         } if (rf & 2) {
-            i0.ɵɵproperty("ngIf", ctx._control.status === "INVALID" && !ctx._control.pristine);
-        } }, dependencies: [i1.NgIf, DrTooltipDirective], styles: ["[_nghost-%COMP%]{display:flex;margin-top:8px}[_nghost-%COMP%]:empty{display:none}[_nghost-%COMP%]   .error-container[_ngcontent-%COMP%]{display:flex;align-items:center;width:auto;color:#bf1d30}[_nghost-%COMP%]   .error-container[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]{font-size:16px;margin-right:2px}[_nghost-%COMP%]   .error-container[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-family:Poppins,sans-serif;font-style:normal;font-weight:400;font-size:11px;line-height:20px}[_nghost-%COMP%]   .error-container.warning[_ngcontent-%COMP%]{color:#ffb800}[_nghost-%COMP%]   .error-container.warning[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{color:#9e5f00}[_nghost-%COMP%]   .error-container--cursor-pointer[_ngcontent-%COMP%]{cursor:pointer}.no-icon[_nghost-%COMP%]{margin-top:2px}.no-icon[_nghost-%COMP%]   .error-container[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:12px}"] }); }
+            i0.ɵɵproperty("ngIf", i0.ɵɵpipeBind1(1, 1, ctx.error$));
+        } }, dependencies: [i1.NgIf, DrTooltipDirective, i1.AsyncPipe], styles: ["[_nghost-%COMP%]{display:flex;margin-top:8px}[_nghost-%COMP%]:empty{display:none}[_nghost-%COMP%]   .error-container[_ngcontent-%COMP%]{display:flex;align-items:center;width:auto;color:#bf1d30}[_nghost-%COMP%]   .error-container[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]{font-size:16px;margin-right:2px}[_nghost-%COMP%]   .error-container[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-family:Poppins,sans-serif;font-style:normal;font-weight:400;font-size:11px;line-height:20px}[_nghost-%COMP%]   .error-container.warning[_ngcontent-%COMP%]{color:#ffb800}[_nghost-%COMP%]   .error-container.warning[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{color:#9e5f00}[_nghost-%COMP%]   .error-container--cursor-pointer[_ngcontent-%COMP%]{cursor:pointer}.no-icon[_nghost-%COMP%]{margin-top:2px}.no-icon[_nghost-%COMP%]   .error-container[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:12px}"] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrErrorComponent, [{
         type: Component,
-        args: [{ selector: 'dr-error', template: "<div\n    *ngIf=\"_control.status === 'INVALID' && !_control.pristine\"\n    [drTooltip]=\"displayAsLabel ? null : errorString\"\n    [drTooltipPosition]=\"errorTooltipPosition\"\n    class=\"error-container\"\n    [class.error-container--cursor-pointer]=\"!displayAsLabel\"\n    [class.warning]=\"isWarning\">\n    <i *ngIf=\"!noIcon\" class=\"dr-icon-status-error\"></i>\n    <span>{{ displayAsLabel ? errorString : label }}</span>\n</div>\n", styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;width:auto;color:#bf1d30}:host .error-container i{font-size:16px;margin-right:2px}:host .error-container span{font-family:Poppins,sans-serif;font-style:normal;font-weight:400;font-size:11px;line-height:20px}:host .error-container.warning{color:#ffb800}:host .error-container.warning span{color:#9e5f00}:host .error-container--cursor-pointer{cursor:pointer}:host.no-icon{margin-top:2px}:host.no-icon .error-container span{font-size:12px}\n"] }]
+        args: [{ selector: 'dr-error', template: "<div\n    *ngIf=\"error$ | async as error\"\n    [drTooltip]=\"displayAsLabel ? null : error\"\n    [drTooltipPosition]=\"errorTooltipPosition\"\n    class=\"error-container\"\n    [class.error-container--cursor-pointer]=\"!displayAsLabel\"\n    [class.warning]=\"warning$ | async\">\n    <i *ngIf=\"!noIcon\" class=\"dr-icon-status-error\"></i>\n    <span>{{ error }}</span>\n</div>\n", styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;width:auto;color:#bf1d30}:host .error-container i{font-size:16px;margin-right:2px}:host .error-container span{font-family:Poppins,sans-serif;font-style:normal;font-weight:400;font-size:11px;line-height:20px}:host .error-container.warning{color:#ffb800}:host .error-container.warning span{color:#9e5f00}:host .error-container--cursor-pointer{cursor:pointer}:host.no-icon{margin-top:2px}:host.no-icon .error-container span{font-size:12px}\n"] }]
     }], function () { return [{ type: i1$2.FormGroupDirective, decorators: [{
                 type: Optional
             }] }]; }, { control: [{
@@ -7280,7 +7284,7 @@ class ScenarioService {
         this.isMultipleDimension = isMultipleDimension;
     }
     getTagsConfigByScenarioTags(scenarioTags, tagsConfig) {
-        const scenarioTagsConfig = filter$1(tagsConfig, (tagConfig) => some(scenarioTags, (scenarioTag) => scenarioTag.toggle && scenarioTag.selectedTagSubType === tagConfig.options.sub_type));
+        const scenarioTagsConfig = filter$2(tagsConfig, (tagConfig) => some(scenarioTags, (scenarioTag) => scenarioTag.toggle && scenarioTag.selectedTagSubType === tagConfig.options.sub_type));
         return this.sortScenarioTags(scenarioTagsConfig);
     }
     getScenarioTagsByScenario(scenario) {
@@ -7628,7 +7632,7 @@ class DrTagsConstructorComponent {
         this.tagsUi = this.tagsConstructor.buildTags(this.tagsConfigToDisplay, this.selectedTagsConfig);
     }
     getTagsConfig(currentTags) {
-        return filter$1(this.tagsConfigToDisplay, (tagConfig) => some(currentTags, (tag) => tag.toggle && tag.selectedTagSubType === tagConfig.options.sub_type));
+        return filter$2(this.tagsConfigToDisplay, (tagConfig) => some(currentTags, (tag) => tag.toggle && tag.selectedTagSubType === tagConfig.options.sub_type));
     }
     updateTagsState(tag) {
         forEach(this.tagsWithSubTags, (tagWithSubTag) => this.scenarioService.tagAcceptableSubTagsHandler(tag, tagWithSubTag));
@@ -8459,7 +8463,7 @@ class DropdownInstanceService {
         return this.instances.slice(this.instances.indexOf(ref));
     }
     inactive(ref) {
-        return this.instances$.pipe(map$2(() => this.getSequence(ref)), filter$2((value) => !!value.length), switchMap$1((value) => interval(200).pipe(map$2(() => value))), filter$2((emissions) => emissions.every((value) => !value.active())), takeUntil$1(this.destroy$));
+        return this.instances$.pipe(map$2(() => this.getSequence(ref)), filter$1((value) => !!value.length), switchMap$1((value) => interval(200).pipe(map$2(() => value))), filter$1((emissions) => emissions.every((value) => !value.active())), takeUntil$1(this.destroy$));
     }
 }
 
@@ -8646,7 +8650,7 @@ class DrTabComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.contentTemplate = _t.first);
-        } }, inputs: { id: "id", label: "label", icon: "icon", disabled: "disabled", tooltip: "tooltip" }, ngContentSelectors: _c0$d, decls: 1, vars: 0, template: function DrTabComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { id: "id", label: "label", icon: "icon", disabled: "disabled", tooltip: "tooltip", customLabelTemplate: "customLabelTemplate" }, ngContentSelectors: _c0$d, decls: 1, vars: 0, template: function DrTabComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵtemplate(0, DrTabComponent_ng_template_0_Template, 1, 0, "ng-template");
         } }, encapsulation: 2 }); }
@@ -8671,82 +8675,124 @@ class DrTabComponent {
             type: Input
         }], tooltip: [{
             type: Input
+        }], customLabelTemplate: [{
+            type: Input
         }], contentTemplate: [{
             type: ViewChild,
             args: [TemplateRef]
         }] }); })();
 
-function DrTabsComponent_mat_tab_1_ng_container_1_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "dr-radio-button", 6);
-    i0.ɵɵlistener("ngModelChange", function DrTabsComponent_mat_tab_1_ng_container_1_ng_template_1_Template_dr_radio_button_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r8 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r8._selectedIndex = $event); });
+function DrTabsComponent_mat_tab_1_ng_container_1_ng_container_1_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    const _r13 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "dr-radio-button", 8);
+    i0.ɵɵlistener("ngModelChange", function DrTabsComponent_mat_tab_1_ng_container_1_ng_container_1_ng_template_1_Template_dr_radio_button_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r12 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r12._selectedIndex = $event); });
     i0.ɵɵelementEnd();
     i0.ɵɵtext(1);
 } if (rf & 2) {
-    const ctx_r10 = i0.ɵɵnextContext(2);
-    const index_r2 = ctx_r10.index;
-    const tab_r1 = ctx_r10.$implicit;
-    const ctx_r7 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("value", index_r2)("ngModel", ctx_r7._selectedIndex);
+    const ctx_r14 = i0.ɵɵnextContext(3);
+    const index_r2 = ctx_r14.index;
+    const tab_r1 = ctx_r14.$implicit;
+    const ctx_r11 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("value", index_r2)("ngModel", ctx_r11._selectedIndex);
     i0.ɵɵadvance(1);
     i0.ɵɵtextInterpolate1(" ", tab_r1.label, " ");
 } }
-function DrTabsComponent_mat_tab_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
+function DrTabsComponent_mat_tab_1_ng_container_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_ng_container_1_ng_template_1_Template, 2, 3, "ng-template", 5);
+    i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_ng_container_1_ng_container_1_ng_template_1_Template, 2, 3, "ng-template", 7);
     i0.ɵɵelementContainerEnd();
 } }
-function DrTabsComponent_mat_tab_1_ng_container_2_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "label", 7);
+function DrTabsComponent_mat_tab_1_ng_container_1_ng_container_2_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "label", 9);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const tab_r1 = i0.ɵɵnextContext(2).$implicit;
+    const tab_r1 = i0.ɵɵnextContext(3).$implicit;
     i0.ɵɵproperty("drTooltip", tab_r1.tooltip);
     i0.ɵɵadvance(1);
     i0.ɵɵtextInterpolate(tab_r1.label);
 } }
-function DrTabsComponent_mat_tab_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
+function DrTabsComponent_mat_tab_1_ng_container_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_ng_container_2_ng_template_1_Template, 2, 2, "ng-template", 5);
+    i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_ng_container_1_ng_container_2_ng_template_1_Template, 2, 2, "ng-template", 7);
     i0.ɵɵelementContainerEnd();
 } }
-function DrTabsComponent_mat_tab_1_ng_container_3_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 8);
-    i0.ɵɵelement(1, "i", 9);
+function DrTabsComponent_mat_tab_1_ng_container_1_ng_container_3_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 10);
+    i0.ɵɵelement(1, "i", 11);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const tab_r1 = i0.ɵɵnextContext(2).$implicit;
+    const tab_r1 = i0.ɵɵnextContext(3).$implicit;
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngClass", tab_r1.icon);
+} }
+function DrTabsComponent_mat_tab_1_ng_container_1_ng_container_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_ng_container_1_ng_container_3_ng_template_1_Template, 2, 1, "ng-template", 7);
+    i0.ɵɵelementContainerEnd();
+} }
+function DrTabsComponent_mat_tab_1_ng_container_1_ng_container_4_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 10);
+    i0.ɵɵelement(1, "i", 11);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const tab_r1 = i0.ɵɵnextContext(3).$implicit;
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngClass", tab_r1.icon);
 } }
-function DrTabsComponent_mat_tab_1_ng_container_3_Template(rf, ctx) { if (rf & 1) {
+function DrTabsComponent_mat_tab_1_ng_container_1_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_ng_container_3_ng_template_1_Template, 2, 1, "ng-template", 5);
+    i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_ng_container_1_ng_container_4_ng_template_1_Template, 2, 1, "ng-template", 7);
     i0.ɵɵelementContainerEnd();
 } }
+function DrTabsComponent_mat_tab_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_ng_container_1_ng_container_1_Template, 2, 0, "ng-container", 6);
+    i0.ɵɵtemplate(2, DrTabsComponent_mat_tab_1_ng_container_1_ng_container_2_Template, 2, 0, "ng-container", 6);
+    i0.ɵɵtemplate(3, DrTabsComponent_mat_tab_1_ng_container_1_ng_container_3_Template, 2, 0, "ng-container", 6);
+    i0.ɵɵtemplate(4, DrTabsComponent_mat_tab_1_ng_container_1_ng_container_4_Template, 2, 0, "ng-container", 6);
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    const tab_r1 = i0.ɵɵnextContext().$implicit;
+    const ctx_r3 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngIf", ctx_r3.withRadio);
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngIf", tab_r1.tooltip && !ctx_r3.withRadio && !ctx_r3.withIcon);
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngIf", ctx_r3.withIcon);
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngIf", ctx_r3.withIcon);
+} }
+function DrTabsComponent_mat_tab_1_ng_template_2_ng_template_0_ng_container_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0);
+} }
+function DrTabsComponent_mat_tab_1_ng_template_2_ng_template_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, DrTabsComponent_mat_tab_1_ng_template_2_ng_template_0_ng_container_0_Template, 1, 0, "ng-container", 5);
+} if (rf & 2) {
+    const tab_r1 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵproperty("ngTemplateOutlet", tab_r1.customLabelTemplate);
+} }
+function DrTabsComponent_mat_tab_1_ng_template_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, DrTabsComponent_mat_tab_1_ng_template_2_ng_template_0_Template, 1, 1, "ng-template", 7);
+} }
 function DrTabsComponent_mat_tab_1_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0);
 } }
 function DrTabsComponent_mat_tab_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "mat-tab", 2);
-    i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_ng_container_1_Template, 2, 0, "ng-container", 3);
-    i0.ɵɵtemplate(2, DrTabsComponent_mat_tab_1_ng_container_2_Template, 2, 0, "ng-container", 3);
-    i0.ɵɵtemplate(3, DrTabsComponent_mat_tab_1_ng_container_3_Template, 2, 0, "ng-container", 3);
-    i0.ɵɵtemplate(4, DrTabsComponent_mat_tab_1_ng_container_4_Template, 1, 0, "ng-container", 4);
+    i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_ng_container_1_Template, 5, 4, "ng-container", 3);
+    i0.ɵɵtemplate(2, DrTabsComponent_mat_tab_1_ng_template_2_Template, 1, 0, "ng-template", null, 4, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(4, DrTabsComponent_mat_tab_1_ng_container_4_Template, 1, 0, "ng-container", 5);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const tab_r1 = ctx.$implicit;
-    const ctx_r0 = i0.ɵɵnextContext();
+    const _r4 = i0.ɵɵreference(3);
     i0.ɵɵpropertyInterpolate("label", tab_r1.label);
     i0.ɵɵproperty("disabled", tab_r1.disabled);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r0.withRadio);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", tab_r1.tooltip && !ctx_r0.withRadio && !ctx_r0.withIcon);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r0.withIcon);
-    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngIf", !tab_r1.customLabelTemplate)("ngIfElse", _r4);
+    i0.ɵɵadvance(3);
     i0.ɵɵproperty("ngTemplateOutlet", tab_r1.contentTemplate);
 } }
 class DrTabsComponent {
@@ -8789,7 +8835,10 @@ class DrTabsComponent {
         this.noBodyPadding = false;
         this.hideTabs = false;
         this.noHeaderBorder = false;
+        this.noLabelBorders = false;
         this.noTabLabelsPadding = false;
+        this.noLabelPadding = false;
+        this.noFixedTabHeight = false;
         this.selectedTabChange = new EventEmitter();
         this.selectedTabIdChange = new EventEmitter();
     }
@@ -8824,21 +8873,21 @@ class DrTabsComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.tabsContentList = _t);
-        } }, inputs: { theme: "theme", disableAnimation: "disableAnimation", selectedTab: "selectedTab", selectedTabId: "selectedTabId", withRadio: "withRadio", withIcon: "withIcon", vertical: "vertical", noBodyPadding: "noBodyPadding", hideTabs: "hideTabs", noHeaderBorder: "noHeaderBorder", noTabLabelsPadding: "noTabLabelsPadding" }, outputs: { selectedTabChange: "selectedTabChange", selectedTabIdChange: "selectedTabIdChange" }, decls: 2, vars: 16, consts: [["disableRipple", "", 3, "ngClass", "selectedIndex", "animationDuration", "selectedIndexChange"], [3, "label", "disabled", 4, "ngFor", "ngForOf"], [3, "label", "disabled"], [4, "ngIf"], [4, "ngTemplateOutlet"], ["mat-tab-label", ""], [3, "value", "ngModel", "ngModelChange"], [1, "cursor-pointer", 3, "drTooltip"], [1, "icon-tab__wrapper"], [1, "cursor-pointer", 3, "ngClass"]], template: function DrTabsComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { theme: "theme", disableAnimation: "disableAnimation", selectedTab: "selectedTab", selectedTabId: "selectedTabId", withRadio: "withRadio", withIcon: "withIcon", vertical: "vertical", noBodyPadding: "noBodyPadding", hideTabs: "hideTabs", noHeaderBorder: "noHeaderBorder", noLabelBorders: "noLabelBorders", noTabLabelsPadding: "noTabLabelsPadding", noLabelPadding: "noLabelPadding", noFixedTabHeight: "noFixedTabHeight" }, outputs: { selectedTabChange: "selectedTabChange", selectedTabIdChange: "selectedTabIdChange" }, decls: 2, vars: 22, consts: [["disableRipple", "", 3, "ngClass", "selectedIndex", "animationDuration", "selectedIndexChange"], [3, "label", "disabled", 4, "ngFor", "ngForOf"], [3, "label", "disabled"], [4, "ngIf", "ngIfElse"], ["customLabel", ""], [4, "ngTemplateOutlet"], [4, "ngIf"], ["mat-tab-label", ""], [3, "value", "ngModel", "ngModelChange"], [1, "cursor-pointer", 3, "drTooltip"], [1, "icon-tab__wrapper"], [1, "cursor-pointer", 3, "ngClass"]], template: function DrTabsComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "mat-tab-group", 0);
             i0.ɵɵlistener("selectedIndexChange", function DrTabsComponent_Template_mat_tab_group_selectedIndexChange_0_listener($event) { return ctx.selectedIndexChange($event); });
-            i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_Template, 5, 6, "mat-tab", 1);
+            i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_Template, 5, 5, "mat-tab", 1);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
-            i0.ɵɵclassProp("with-radio", ctx.withRadio)("vertical", ctx.vertical)("no-tab-labels-padding", ctx.noTabLabelsPadding)("no-body-padding", ctx.noBodyPadding)("no-tabs", ctx.hideTabs)("no-header-border", ctx.noHeaderBorder);
+            i0.ɵɵclassProp("with-radio", ctx.withRadio)("vertical", ctx.vertical)("no-tab-labels-padding", ctx.noTabLabelsPadding)("no-label-padding", ctx.noLabelPadding)("no-body-padding", ctx.noBodyPadding)("no-tabs", ctx.hideTabs)("no-header-border", ctx.noHeaderBorder)("no-label-borders", ctx.noLabelBorders)("no-fixed-tab-height", ctx.noFixedTabHeight);
             i0.ɵɵproperty("ngClass", ctx.theme)("selectedIndex", ctx._selectedIndex)("animationDuration", ctx.disableAnimation || ctx.vertical || ctx._disableAnimationTemp ? "0ms" : "500ms");
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngForOf", ctx.tabsContentList);
-        } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i2.MatTabLabel, i2.MatTab, i2.MatTabGroup, i1$2.NgControlStatus, i1$2.NgModel, RadioButtonComponent, DrTooltipDirective], styles: ["[_nghost-%COMP%]{width:100%}[_nghost-%COMP%]   .cursor-pointer[_ngcontent-%COMP%]{cursor:pointer}[_nghost-%COMP%]     .mat-mdc-tab-group, [_nghost-%COMP%]     .mat-mdc-tab-body-wrapper{height:100%}[_nghost-%COMP%]     .mat-mdc-tab-group{font-family:Poppins,sans-serif}[_nghost-%COMP%]     .mat-mdc-tab-nav-bar, [_nghost-%COMP%]     .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}[_nghost-%COMP%]     .mat-mdc-tab-labels{padding:0 17px}[_nghost-%COMP%]     .mat-mdc-tab, [_nghost-%COMP%]     .mat-mdc-tab:hover{-webkit-tap-highlight-color:#ffffff}[_nghost-%COMP%]     .mat-mdc-tab .mdc-tab__text-label, [_nghost-%COMP%]     .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}[_nghost-%COMP%]     .mat-mdc-tab .mdc-tab__ripple{display:none}[_nghost-%COMP%]     .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}[_nghost-%COMP%]     .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}[_nghost-%COMP%]     .mdc-tab:not(:last-child){margin-right:21px}[_nghost-%COMP%]     .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}[_nghost-%COMP%]     .mdc-tab--active .mdc-tab__content .mdc-tab__text-label, [_nghost-%COMP%]     .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label, [_nghost-%COMP%]     .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}[_nghost-%COMP%]     .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}[_nghost-%COMP%]     .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}[_nghost-%COMP%]     .with-radio .mdc-tab:not(:last-child){margin-right:8px}[_nghost-%COMP%]     .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}[_nghost-%COMP%]     .with-radio .mdc-tab--active .mdc-tab__text-label, [_nghost-%COMP%]     .with-radio .mdc-tab--active:hover .mdc-tab__text-label, [_nghost-%COMP%]     .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}[_nghost-%COMP%]     .with-radio .mdc-tab-indicator{display:none!important}[_nghost-%COMP%]     .vertical.mat-mdc-tab-group{flex-direction:row}[_nghost-%COMP%]     .vertical .mat-mdc-tab-header{border-bottom:none}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}[_nghost-%COMP%]     .vertical .mdc-tab-indicator{display:none!important}[_nghost-%COMP%]     .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}[_nghost-%COMP%]     .secondary .mat-mdc-tab-header{border-bottom:none}[_nghost-%COMP%]     .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#f2f2fb}[_nghost-%COMP%]     .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #dfe0e3}[_nghost-%COMP%]     .secondary .mdc-tab+.mdc-tab{border-left:1px solid #dfe0e3}[_nghost-%COMP%]     .secondary .mdc-tab--active{background:#fff;border-bottom:none}[_nghost-%COMP%]     .secondary .mdc-tab--active .mdc-tab__text-label, [_nghost-%COMP%]     .secondary .mdc-tab--active:hover .mdc-tab__text-label, [_nghost-%COMP%]     .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}[_nghost-%COMP%]     .secondary .mdc-tab-indicator{display:none}[_nghost-%COMP%]     mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}[_nghost-%COMP%]     mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}[_nghost-%COMP%]     mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}[_nghost-%COMP%]     mat-tab-group.no-header-border .mat-mdc-tab-header{border-bottom:none!important}"] }); }
+        } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i2.MatTabLabel, i2.MatTab, i2.MatTabGroup, i1$2.NgControlStatus, i1$2.NgModel, RadioButtonComponent, DrTooltipDirective], styles: ["[_nghost-%COMP%]{width:100%}[_nghost-%COMP%]   .cursor-pointer[_ngcontent-%COMP%]{cursor:pointer}[_nghost-%COMP%]     .mat-mdc-tab-group, [_nghost-%COMP%]     .mat-mdc-tab-body-wrapper{height:100%}[_nghost-%COMP%]     .mat-mdc-tab-group{font-family:Poppins,sans-serif}[_nghost-%COMP%]     .mat-mdc-tab-nav-bar, [_nghost-%COMP%]     .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}[_nghost-%COMP%]     .mat-mdc-tab-labels{padding:0 17px}[_nghost-%COMP%]     .mat-mdc-tab, [_nghost-%COMP%]     .mat-mdc-tab:hover{-webkit-tap-highlight-color:#ffffff}[_nghost-%COMP%]     .mat-mdc-tab .mdc-tab__text-label, [_nghost-%COMP%]     .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}[_nghost-%COMP%]     .mat-mdc-tab .mdc-tab__ripple{display:none}[_nghost-%COMP%]     .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}[_nghost-%COMP%]     .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}[_nghost-%COMP%]     .mdc-tab:not(:last-child){margin-right:21px}[_nghost-%COMP%]     .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}[_nghost-%COMP%]     .mdc-tab--active .mdc-tab__content .mdc-tab__text-label, [_nghost-%COMP%]     .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label, [_nghost-%COMP%]     .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}[_nghost-%COMP%]     .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}[_nghost-%COMP%]     .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}[_nghost-%COMP%]     .with-radio .mdc-tab:not(:last-child){margin-right:8px}[_nghost-%COMP%]     .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}[_nghost-%COMP%]     .with-radio .mdc-tab--active .mdc-tab__text-label, [_nghost-%COMP%]     .with-radio .mdc-tab--active:hover .mdc-tab__text-label, [_nghost-%COMP%]     .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}[_nghost-%COMP%]     .with-radio .mdc-tab-indicator{display:none!important}[_nghost-%COMP%]     .vertical.mat-mdc-tab-group{flex-direction:row}[_nghost-%COMP%]     .vertical .mat-mdc-tab-header{border-bottom:none}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}[_nghost-%COMP%]     .vertical .mdc-tab-indicator{display:none!important}[_nghost-%COMP%]     .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}[_nghost-%COMP%]     .secondary .mat-mdc-tab-header{border-bottom:none}[_nghost-%COMP%]     .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#f2f2fb}[_nghost-%COMP%]     .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #dfe0e3}[_nghost-%COMP%]     .secondary .mdc-tab+.mdc-tab{border-left:1px solid #dfe0e3}[_nghost-%COMP%]     .secondary .mdc-tab--active{background:#fff;border-bottom:none}[_nghost-%COMP%]     .secondary .mdc-tab--active .mdc-tab__text-label, [_nghost-%COMP%]     .secondary .mdc-tab--active:hover .mdc-tab__text-label, [_nghost-%COMP%]     .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}[_nghost-%COMP%]     .secondary .mdc-tab-indicator{display:none}[_nghost-%COMP%]     mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}[_nghost-%COMP%]     mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}[_nghost-%COMP%]     mat-tab-group.no-label-padding .mdc-tab{padding:0!important}[_nghost-%COMP%]     mat-tab-group.no-label-padding.vertical .mdc-tab{padding:0 0 0 2px!important}[_nghost-%COMP%]     mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}[_nghost-%COMP%]     mat-tab-group.no-header-border .mat-mdc-tab-header{border:none!important}[_nghost-%COMP%]     mat-tab-group.no-header-border .mat-mdc-tab-header .mat-mdc-tab-label-container{border:none!important}[_nghost-%COMP%]     mat-tab-group.no-label-borders .mdc-tab{border:none!important}[_nghost-%COMP%]     mat-tab-group.no-fixed-tab-height .mdc-tab{height:auto!important}"] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrTabsComponent, [{
         type: Component,
-        args: [{ selector: 'dr-tabs', template: "<mat-tab-group\n    disableRipple\n    [ngClass]=\"theme\"\n    [selectedIndex]=\"_selectedIndex\"\n    (selectedIndexChange)=\"selectedIndexChange($event)\"\n    [class.with-radio]=\"withRadio\"\n    [class.vertical]=\"vertical\"\n    [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n    [class.no-body-padding]=\"noBodyPadding\"\n    [class.no-tabs]=\"hideTabs\"\n    [class.no-header-border]=\"noHeaderBorder\"\n    [animationDuration]=\"disableAnimation || vertical || _disableAnimationTemp ? '0ms' : '500ms'\">\n    <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n        <ng-container *ngIf=\"withRadio\">\n            <ng-template mat-tab-label>\n                <dr-radio-button [value]=\"index\" [(ngModel)]=\"_selectedIndex\"> </dr-radio-button>\n                {{ tab.label }}\n            </ng-template>\n        </ng-container>\n        <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n            <ng-template mat-tab-label>\n                <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n            </ng-template>\n        </ng-container>\n        <ng-container *ngIf=\"withIcon\">\n            <ng-template mat-tab-label>\n                <span class=\"icon-tab__wrapper\">\n                    <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n                </span>\n            </ng-template>\n        </ng-container>\n        <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n    </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-mdc-tab-group,:host ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host ::ng-deep .mat-mdc-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-mdc-tab-nav-bar,:host ::ng-deep .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-mdc-tab-labels{padding:0 17px}:host ::ng-deep .mat-mdc-tab,:host ::ng-deep .mat-mdc-tab:hover{-webkit-tap-highlight-color:#ffffff}:host ::ng-deep .mat-mdc-tab .mdc-tab__text-label,:host ::ng-deep .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}:host ::ng-deep .mat-mdc-tab .mdc-tab__ripple{display:none}:host ::ng-deep .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}:host ::ng-deep .mdc-tab:not(:last-child){margin-right:21px}:host ::ng-deep .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}:host ::ng-deep .mdc-tab--active .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}:host ::ng-deep .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}:host ::ng-deep .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mdc-tab:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical.mat-mdc-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}:host ::ng-deep .vertical .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep .secondary .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#f2f2fb}:host ::ng-deep .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #dfe0e3}:host ::ng-deep .secondary .mdc-tab+.mdc-tab{border-left:1px solid #dfe0e3}:host ::ng-deep .secondary .mdc-tab--active{background:#fff;border-bottom:none}:host ::ng-deep .secondary .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}:host ::ng-deep .secondary .mdc-tab-indicator{display:none}:host ::ng-deep mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}:host ::ng-deep mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header{border-bottom:none!important}\n"] }]
+        args: [{ selector: 'dr-tabs', template: "<mat-tab-group\n    disableRipple\n    [ngClass]=\"theme\"\n    [selectedIndex]=\"_selectedIndex\"\n    (selectedIndexChange)=\"selectedIndexChange($event)\"\n    [class.with-radio]=\"withRadio\"\n    [class.vertical]=\"vertical\"\n    [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n    [class.no-label-padding]=\"noLabelPadding\"\n    [class.no-body-padding]=\"noBodyPadding\"\n    [class.no-tabs]=\"hideTabs\"\n    [class.no-header-border]=\"noHeaderBorder\"\n    [class.no-label-borders]=\"noLabelBorders\"\n    [class.no-fixed-tab-height]=\"noFixedTabHeight\"\n    [animationDuration]=\"disableAnimation || vertical || _disableAnimationTemp ? '0ms' : '500ms'\">\n    <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n        <ng-container *ngIf=\"!tab.customLabelTemplate; else customLabel\">\n            <ng-container *ngIf=\"withRadio\">\n                <ng-template mat-tab-label>\n                    <dr-radio-button [value]=\"index\" [(ngModel)]=\"_selectedIndex\"> </dr-radio-button>\n                    {{ tab.label }}\n                </ng-template>\n            </ng-container>\n            <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n                <ng-template mat-tab-label>\n                    <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n                </ng-template>\n            </ng-container>\n            <ng-container *ngIf=\"withIcon\">\n                <ng-template mat-tab-label>\n                    <span class=\"icon-tab__wrapper\">\n                        <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n                    </span>\n                </ng-template>\n            </ng-container>\n            <ng-container *ngIf=\"withIcon\">\n                <ng-template mat-tab-label>\n                    <span class=\"icon-tab__wrapper\">\n                        <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n                    </span>\n                </ng-template>\n            </ng-container>\n        </ng-container>\n        <ng-template #customLabel>\n            <ng-template mat-tab-label>\n                <ng-container *ngTemplateOutlet=\"tab.customLabelTemplate\"></ng-container>\n            </ng-template>\n        </ng-template>\n        <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n    </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-mdc-tab-group,:host ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host ::ng-deep .mat-mdc-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-mdc-tab-nav-bar,:host ::ng-deep .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-mdc-tab-labels{padding:0 17px}:host ::ng-deep .mat-mdc-tab,:host ::ng-deep .mat-mdc-tab:hover{-webkit-tap-highlight-color:#ffffff}:host ::ng-deep .mat-mdc-tab .mdc-tab__text-label,:host ::ng-deep .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}:host ::ng-deep .mat-mdc-tab .mdc-tab__ripple{display:none}:host ::ng-deep .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}:host ::ng-deep .mdc-tab:not(:last-child){margin-right:21px}:host ::ng-deep .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}:host ::ng-deep .mdc-tab--active .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}:host ::ng-deep .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}:host ::ng-deep .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mdc-tab:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical.mat-mdc-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}:host ::ng-deep .vertical .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep .secondary .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#f2f2fb}:host ::ng-deep .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #dfe0e3}:host ::ng-deep .secondary .mdc-tab+.mdc-tab{border-left:1px solid #dfe0e3}:host ::ng-deep .secondary .mdc-tab--active{background:#fff;border-bottom:none}:host ::ng-deep .secondary .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}:host ::ng-deep .secondary .mdc-tab-indicator{display:none}:host ::ng-deep mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}:host ::ng-deep mat-tab-group.no-label-padding .mdc-tab{padding:0!important}:host ::ng-deep mat-tab-group.no-label-padding.vertical .mdc-tab{padding:0 0 0 2px!important}:host ::ng-deep mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header{border:none!important}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header .mat-mdc-tab-label-container{border:none!important}:host ::ng-deep mat-tab-group.no-label-borders .mdc-tab{border:none!important}:host ::ng-deep mat-tab-group.no-fixed-tab-height .mdc-tab{height:auto!important}\n"] }]
     }], function () { return [{ type: i0.ChangeDetectorRef }]; }, { theme: [{
             type: Input
         }], disableAnimation: [{
@@ -8859,8 +8908,14 @@ class DrTabsComponent {
             type: Input
         }], noHeaderBorder: [{
             type: Input
+        }], noLabelBorders: [{
+            type: Input
         }], noTabLabelsPadding: [{
             type: Input
+        }], noLabelPadding: [{
+            type: Input
+        }], noFixedTabHeight: [{
+            type: Input
         }], selectedTabChange: [{
             type: Output
         }], selectedTabIdChange: [{