@datarailsshared/datarailsshared 1.5.412 → 1.5.416

package/fesm2022/datarailsshared-datarailsshared.mjs

@@ -1118,7 +1118,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.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{text-decoration-line:underline;color:#0b5af9}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-arrow:before{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#333}.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:\"\\ea5c\";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 .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:97%;word-break:break-word;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.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{text-decoration-line:underline;color:#0b5af9}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}.textView[_nghost-%COMP%]  ng-select.ng-select .ng-select-container .ng-arrow:before{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#333}.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:\"\\ea5d\";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 .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:97%;word-break:break-word;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,
@@ -1128,7 +1128,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    [keyDownFn]=\"keyDownFn\"\n    [searchFn]=\"searchFn\"\n    [isOpen]=\"(type !== 'search-input' || !!selectComponent.searchTerm?.length) && isOpen\"\n    [groupBy]=\"groupBy\"\n    [attr.autofocus]=\"autofocus\"\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=\"optionTemplate\" ng-option-tmp let-item=\"item\">\n        <ng-container [ngTemplateOutlet]=\"optionTemplate\" [ngTemplateOutletContext]=\"{ 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{text-decoration-line:underline;color:#0b5af9}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-arrow:before{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#333}: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:\"\\ea5c\";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 .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:97%;word-break:break-word;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    [keyDownFn]=\"keyDownFn\"\n    [searchFn]=\"searchFn\"\n    [isOpen]=\"(type !== 'search-input' || !!selectComponent.searchTerm?.length) && isOpen\"\n    [groupBy]=\"groupBy\"\n    [attr.autofocus]=\"autofocus\"\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=\"optionTemplate\" ng-option-tmp let-item=\"item\">\n        <ng-container [ngTemplateOutlet]=\"optionTemplate\" [ngTemplateOutletContext]=\"{ 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{text-decoration-line:underline;color:#0b5af9}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-arrow:before{font-family:DataRails!important;content:\"\\ea15\";font-size:24px;color:#333}: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:\"\\ea5d\";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 .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:97%;word-break:break-word;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
         }, {
@@ -4438,7 +4438,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}"], 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: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,
@@ -4446,7 +4446,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}\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: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']
@@ -4995,12 +4995,7 @@ class ChatMessage {
         this.label = obj?.label;
         this.body = obj?.body;
         this.parameters = obj?.parameters;
-        //TODO fix me: remove staticFunc
-        this.avatarUrl = obj?.avatarUrl
-            ? obj.avatarUrl
-            : !obj?.role || obj?.role === ChatRole.ASSISTANT
-                ? document.staticFunc('/genius-logo.webp')
-                : '';
+        this.avatarUrl = obj?.avatarUrl || null;
         this.user = obj?.user;
     }
 }
@@ -5582,32 +5577,40 @@ function DrChatMessageComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵstyleProp("background-image", "url(" + ctx_r0.message.avatarUrl + ")");
 } }
 function DrChatMessageComponent_ng_template_1_dr_avatar_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "dr-avatar", 9);
+    i0.ɵɵelement(0, "dr-avatar", 10);
 } if (rf & 2) {
     const ctx_r7 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("users", ctx_r7.message.user);
 } }
+function DrChatMessageComponent_ng_template_1_div_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 11);
+    i0.ɵɵelement(1, "i", 12);
+    i0.ɵɵelementEnd();
+} }
 function DrChatMessageComponent_ng_template_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtemplate(0, DrChatMessageComponent_ng_template_1_dr_avatar_0_Template, 1, 1, "dr-avatar", 8);
+    i0.ɵɵtemplate(1, DrChatMessageComponent_ng_template_1_div_1_Template, 2, 0, "div", 9);
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵproperty("ngIf", ctx_r2.message.user);
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngIf", !ctx_r2.message.user);
 } }
 function DrChatMessageComponent_dr_chat_message_text_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "dr-chat-message-text", 10);
+    i0.ɵɵelement(0, "dr-chat-message-text", 13);
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵproperty("message", ctx_r3.message);
 } }
 function DrChatMessageComponent_dr_chat_message_file_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "dr-chat-message-file", 10);
+    i0.ɵɵelement(0, "dr-chat-message-file", 13);
 } if (rf & 2) {
     const ctx_r4 = i0.ɵɵnextContext();
     i0.ɵɵproperty("message", ctx_r4.message);
 } }
 function DrChatMessageComponent_ng_container_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementContainer(1, 11);
+    i0.ɵɵelementContainer(1, 14);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const ctx_r5 = i0.ɵɵnextContext();
@@ -5615,8 +5618,8 @@ function DrChatMessageComponent_ng_container_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵproperty("ngTemplateOutlet", ctx_r5.getTemplate())("ngTemplateOutletContext", ctx_r5.getTemplateContext());
 } }
 function DrChatMessageComponent_div_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 12);
-    i0.ɵɵelementContainer(1, 13);
+    i0.ɵɵelementStart(0, "div", 15);
+    i0.ɵɵelementContainer(1, 16);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r6 = i0.ɵɵnextContext();
@@ -5672,9 +5675,9 @@ class DrChatMessageComponent {
         } }, hostVars: 5, hostBindings: function DrChatMessageComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵsyntheticHostProperty("@flyInOut", ctx.flyInOut);
             i0.ɵɵclassProp("not-reply", ctx.notReply)("reply", ctx.reply);
-        } }, inputs: { reply: "reply", type: "type", message: "message", customMessageData: "customMessageData", user: "user" }, decls: 9, vars: 9, consts: [[4, "ngIf", "ngIfElse"], ["userAvatar", ""], [1, "message", 3, "ngClass"], [3, "ngSwitch"], [3, "message", 4, "ngSwitchCase"], [4, "ngSwitchDefault"], ["class", "message__actions", 4, "ngIf"], [1, "avatar"], [3, "users", 4, "ngIf"], [3, "users"], [3, "message"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "message__actions"], [3, "ngTemplateOutlet"]], template: function DrChatMessageComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { reply: "reply", type: "type", message: "message", customMessageData: "customMessageData", user: "user" }, decls: 9, vars: 9, consts: [[4, "ngIf", "ngIfElse"], ["userAvatar", ""], [1, "message", 3, "ngClass"], [3, "ngSwitch"], [3, "message", 4, "ngSwitchCase"], [4, "ngSwitchDefault"], ["class", "message__actions", 4, "ngIf"], [1, "avatar"], [3, "users", 4, "ngIf"], ["class", "genius-avatar", 4, "ngIf"], [3, "users"], [1, "genius-avatar"], [1, "dr-icon-genius-sparks"], [3, "message"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "message__actions"], [3, "ngTemplateOutlet"]], template: function DrChatMessageComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, DrChatMessageComponent_ng_container_0_Template, 2, 2, "ng-container", 0);
-            i0.ɵɵtemplate(1, DrChatMessageComponent_ng_template_1_Template, 1, 1, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+            i0.ɵɵtemplate(1, DrChatMessageComponent_ng_template_1_Template, 2, 2, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
             i0.ɵɵelementStart(3, "div", 2);
             i0.ɵɵelementContainerStart(4, 3);
             i0.ɵɵtemplate(5, DrChatMessageComponent_dr_chat_message_text_5_Template, 1, 1, "dr-chat-message-text", 4);
@@ -5697,7 +5700,7 @@ class DrChatMessageComponent {
             i0.ɵɵproperty("ngSwitchCase", ctx.MESSAGE_TYPE.DOWNLOAD_FILE);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.drChatMessageActions);
-        } }, dependencies: [i1.NgClass, i1.NgIf, i1.NgTemplateOutlet, i1.NgSwitch, i1.NgSwitchCase, i1.NgSwitchDefault, DrAvatarComponent, DrChatMessageTextComponent, DrChatMessageFileComponent], styles: ["[_nghost-%COMP%]{position:relative;display:flex;flex-direction:row;width:100%;background:#f9faffb3;border-top:1px solid #e5e5e5;padding:16px}[_nghost-%COMP%]:first-child{border:none}[_nghost-%COMP%]:last-child{border-bottom:1px solid #e5e5e5}.reply + .reply[_nghost-%COMP%], .not-reply + .not-reply[_nghost-%COMP%]{border-top:none;padding-top:0;padding-left:60px}.reply + .reply[_nghost-%COMP%]   .avatar[_ngcontent-%COMP%], .reply + .reply[_nghost-%COMP%]   dr-avatar[_ngcontent-%COMP%], .not-reply + .not-reply[_nghost-%COMP%]   .avatar[_ngcontent-%COMP%], .not-reply + .not-reply[_nghost-%COMP%]   dr-avatar[_ngcontent-%COMP%]{display:none}.not-reply[_nghost-%COMP%]{background-color:#fff}[_nghost-%COMP%]   .avatar[_ngcontent-%COMP%]{display:flex;width:28px;height:28px;background-color:#fff;border-radius:16px;flex-shrink:0;border:1px solid #dfe0e3;background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22UTF-8%22%3F%3E%3Csvg id%3D%22Layer_1%22 data-name%3D%22Layer 1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 viewBox%3D%220 0 74 65%22%3E  %3Cdefs%3E    %3Cstyle%3E      .cls-1%2C .cls-2%2C .cls-3 %7B        fill%3A none%3B      %7D      .cls-4 %7B        fill%3A url(%23linear-gradient)%3B      %7D      .cls-5 %7B        fill%3A %234eb7df%3B      %7D      .cls-2 %7B        stroke%3A %23a6a8aa%3B        stroke-miterlimit%3A 10%3B        stroke-width%3A .37px%3B      %7D      .cls-6 %7B        fill%3A url(%23linear-gradient-3)%3B      %7D      .cls-7 %7B        fill%3A url(%23linear-gradient-2)%3B      %7D      .cls-3 %7B        clip-path%3A url(%23clippath)%3B      %7D    %3C%2Fstyle%3E    %3CclipPath id%3D%22clippath%22%3E      %3Crect class%3D%22cls-1%22 width%3D%2274%22 height%3D%2265%22%2F%3E    %3C%2FclipPath%3E    %3ClinearGradient id%3D%22linear-gradient%22 x1%3D%2224.26%22 y1%3D%22-3.79%22 x2%3D%2295.63%22 y2%3D%2288.82%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%220%22 stop-color%3D%22%237676ff%22%2F%3E      %3Cstop offset%3D%22.18%22 stop-color%3D%22%235959ff%22%2F%3E      %3Cstop offset%3D%22.35%22 stop-color%3D%22%235757e0%22%2F%3E      %3Cstop offset%3D%22.61%22 stop-color%3D%22%234646ce%22%2F%3E      %3Cstop offset%3D%22.84%22 stop-color%3D%22%234b4be4%22%2F%3E      %3Cstop offset%3D%221%22 stop-color%3D%22%234444eb%22%2F%3E    %3C%2FlinearGradient%3E    %3ClinearGradient id%3D%22linear-gradient-2%22 x1%3D%2212.05%22 y1%3D%2277.06%22 x2%3D%2210.77%22 y2%3D%2213.85%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%22.45%22 stop-color%3D%22%232f92b8%22%2F%3E      %3Cstop offset%3D%22.84%22 stop-color%3D%22%234eb7df%22%2F%3E      %3Cstop offset%3D%221%22 stop-color%3D%22%234eb7df%22%2F%3E    %3C%2FlinearGradient%3E    %3ClinearGradient id%3D%22linear-gradient-3%22 x1%3D%2262.26%22 y1%3D%22-2.54%22 x2%3D%2261.76%22 y2%3D%2285.91%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%220%22 stop-color%3D%22%2336369b%22%2F%3E      %3Cstop offset%3D%22.52%22 stop-color%3D%22%234848d0%22%2F%3E    %3C%2FlinearGradient%3E  %3C%2Fdefs%3E  %3Cg class%3D%22cls-3%22%3E    %3Cg%3E      %3Cpath class%3D%22cls-4%22 d%3D%22m73.32%2C24.79v15.73c0%2C13.12-9.87%2C23.79-22%2C23.79h-21.32c-3.46-.06-6.25-3.11-6.25-6.87s2.79-6.81%2C6.25-6.87h21.32c5.13%2C0%2C9.29-4.51%2C9.29-10.05v-15.73c0-5.54-4.17-10.05-9.29-10.05h-7.46c3.51%2C0%2C6.35-3.08%2C6.35-6.88s-2.79-6.8-6.25-6.87h7.35c12.12%2C0%2C22%2C10.67%2C22%2C23.79h0Z%22%2F%3E      %3Cpath class%3D%22cls-5%22 d%3D%22m50.26%2C7.82c0%2C3.8-2.9%2C6.93-6.41%2C6.93h-21.86c-5.13%2C0-9.29%2C4.51-9.29%2C10.05v15.73c0%2C5.54%2C4.17%2C10.05%2C9.29%2C10.05h8.01c-3.46.06-6.25%2C3.11-6.25%2C6.87s2.79%2C6.81%2C6.25%2C6.87h-8.01c-12.12%2C0-22-10.67-22-23.79v-15.73C0%2C11.68%2C9.87%2C1%2C21.99%2C1h21.97c3.46.06%2C6.3%2C3.06%2C6.3%2C6.82Z%22%2F%3E      %3Cpath class%3D%22cls-2%22 d%3D%22m66.45%2C1h-.22.22%2C0Z%22%2F%3E      %3Cpath class%3D%22cls-2%22 d%3D%22m36.05%2C50.58h-.22.22%2C0Z%22%2F%3E      %3Cpath class%3D%22cls-7%22 d%3D%22m0%2C33.78v-2.76C0%2C12.9%2C13.62%2C14.48%2C13.62%2C14.48h8.38c-5.5.46-9.5%2C4.71-9.5%2C9.96l.02%2C15.8c0%2C5.54%2C4.44%2C10.59%2C9.48%2C10.59l-8-.5S0%2C51.88%2C0%2C33.77h0Z%22%2F%3E      %3Cpath class%3D%22cls-6%22 d%3D%22m73%2C31.51v2.76c0%2C18.12-13.62%2C16.53-13.62%2C16.53h-7.99c5.61-.85%2C9.09-4.76%2C9.09-10.02l.02-16.33c0-5.54-4.46-10-9.5-10h8s13.99-1.05%2C13.99%2C17.07h0Z%22%2F%3E    %3C%2Fg%3E  %3C%2Fg%3E%3C%2Fsvg%3E\");background-size:18px;background-repeat:no-repeat;background-position-x:4px;background-position-y:5px}[_nghost-%COMP%]   .avatar[_ngcontent-%COMP%], [_nghost-%COMP%]   dr-avatar[_ngcontent-%COMP%]{margin:0 16px 0 0}[_nghost-%COMP%]   .avatar[_ngcontent-%COMP%]  .users-section__user, [_nghost-%COMP%]   dr-avatar[_ngcontent-%COMP%]  .users-section__user{border:1px solid #dfe0e3}[_nghost-%COMP%]   .message[_ngcontent-%COMP%]{display:flex;align-items:center;flex-grow:1}[_nghost-%COMP%]   .message__actions[_ngcontent-%COMP%]{display:flex;align-items:center;margin-top:12px;flex-grow:1;justify-content:flex-start}[_nghost-%COMP%]   .message__actions[_ngcontent-%COMP%]  button:not(:hover) i[class*=dr-icon]{color:#b9b9ec!important}[_nghost-%COMP%]   .messageGroup[_ngcontent-%COMP%]{display:flex;flex-direction:column;align-items:flex-start}"], data: { animation: [
+        } }, dependencies: [i1.NgClass, i1.NgIf, i1.NgTemplateOutlet, i1.NgSwitch, i1.NgSwitchCase, i1.NgSwitchDefault, DrAvatarComponent, DrChatMessageTextComponent, DrChatMessageFileComponent], styles: ["[_nghost-%COMP%]{position:relative;display:flex;flex-direction:row;width:100%;background:#f9faffb3;border-top:1px solid #e5e5e5;padding:16px}[_nghost-%COMP%]:first-child{border:none}[_nghost-%COMP%]:last-child{border-bottom:1px solid #e5e5e5}.reply + .reply[_nghost-%COMP%], .not-reply + .not-reply[_nghost-%COMP%]{border-top:none;padding-top:0;padding-left:60px}.reply + .reply[_nghost-%COMP%]   .avatar[_ngcontent-%COMP%], .reply + .reply[_nghost-%COMP%]   dr-avatar[_ngcontent-%COMP%], .not-reply + .not-reply[_nghost-%COMP%]   .avatar[_ngcontent-%COMP%], .not-reply + .not-reply[_nghost-%COMP%]   dr-avatar[_ngcontent-%COMP%]{display:none}.not-reply[_nghost-%COMP%]{background-color:#fff}[_nghost-%COMP%]   .avatar[_ngcontent-%COMP%]{display:flex;width:28px;height:28px;background-color:#fff;border-radius:16px;flex-shrink:0;border:1px solid #dfe0e3;background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22UTF-8%22%3F%3E%3Csvg id%3D%22Layer_1%22 data-name%3D%22Layer 1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 viewBox%3D%220 0 74 65%22%3E  %3Cdefs%3E    %3Cstyle%3E      .cls-1%2C .cls-2%2C .cls-3 %7B        fill%3A none%3B      %7D      .cls-4 %7B        fill%3A url(%23linear-gradient)%3B      %7D      .cls-5 %7B        fill%3A %234eb7df%3B      %7D      .cls-2 %7B        stroke%3A %23a6a8aa%3B        stroke-miterlimit%3A 10%3B        stroke-width%3A .37px%3B      %7D      .cls-6 %7B        fill%3A url(%23linear-gradient-3)%3B      %7D      .cls-7 %7B        fill%3A url(%23linear-gradient-2)%3B      %7D      .cls-3 %7B        clip-path%3A url(%23clippath)%3B      %7D    %3C%2Fstyle%3E    %3CclipPath id%3D%22clippath%22%3E      %3Crect class%3D%22cls-1%22 width%3D%2274%22 height%3D%2265%22%2F%3E    %3C%2FclipPath%3E    %3ClinearGradient id%3D%22linear-gradient%22 x1%3D%2224.26%22 y1%3D%22-3.79%22 x2%3D%2295.63%22 y2%3D%2288.82%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%220%22 stop-color%3D%22%237676ff%22%2F%3E      %3Cstop offset%3D%22.18%22 stop-color%3D%22%235959ff%22%2F%3E      %3Cstop offset%3D%22.35%22 stop-color%3D%22%235757e0%22%2F%3E      %3Cstop offset%3D%22.61%22 stop-color%3D%22%234646ce%22%2F%3E      %3Cstop offset%3D%22.84%22 stop-color%3D%22%234b4be4%22%2F%3E      %3Cstop offset%3D%221%22 stop-color%3D%22%234444eb%22%2F%3E    %3C%2FlinearGradient%3E    %3ClinearGradient id%3D%22linear-gradient-2%22 x1%3D%2212.05%22 y1%3D%2277.06%22 x2%3D%2210.77%22 y2%3D%2213.85%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%22.45%22 stop-color%3D%22%232f92b8%22%2F%3E      %3Cstop offset%3D%22.84%22 stop-color%3D%22%234eb7df%22%2F%3E      %3Cstop offset%3D%221%22 stop-color%3D%22%234eb7df%22%2F%3E    %3C%2FlinearGradient%3E    %3ClinearGradient id%3D%22linear-gradient-3%22 x1%3D%2262.26%22 y1%3D%22-2.54%22 x2%3D%2261.76%22 y2%3D%2285.91%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%220%22 stop-color%3D%22%2336369b%22%2F%3E      %3Cstop offset%3D%22.52%22 stop-color%3D%22%234848d0%22%2F%3E    %3C%2FlinearGradient%3E  %3C%2Fdefs%3E  %3Cg class%3D%22cls-3%22%3E    %3Cg%3E      %3Cpath class%3D%22cls-4%22 d%3D%22m73.32%2C24.79v15.73c0%2C13.12-9.87%2C23.79-22%2C23.79h-21.32c-3.46-.06-6.25-3.11-6.25-6.87s2.79-6.81%2C6.25-6.87h21.32c5.13%2C0%2C9.29-4.51%2C9.29-10.05v-15.73c0-5.54-4.17-10.05-9.29-10.05h-7.46c3.51%2C0%2C6.35-3.08%2C6.35-6.88s-2.79-6.8-6.25-6.87h7.35c12.12%2C0%2C22%2C10.67%2C22%2C23.79h0Z%22%2F%3E      %3Cpath class%3D%22cls-5%22 d%3D%22m50.26%2C7.82c0%2C3.8-2.9%2C6.93-6.41%2C6.93h-21.86c-5.13%2C0-9.29%2C4.51-9.29%2C10.05v15.73c0%2C5.54%2C4.17%2C10.05%2C9.29%2C10.05h8.01c-3.46.06-6.25%2C3.11-6.25%2C6.87s2.79%2C6.81%2C6.25%2C6.87h-8.01c-12.12%2C0-22-10.67-22-23.79v-15.73C0%2C11.68%2C9.87%2C1%2C21.99%2C1h21.97c3.46.06%2C6.3%2C3.06%2C6.3%2C6.82Z%22%2F%3E      %3Cpath class%3D%22cls-2%22 d%3D%22m66.45%2C1h-.22.22%2C0Z%22%2F%3E      %3Cpath class%3D%22cls-2%22 d%3D%22m36.05%2C50.58h-.22.22%2C0Z%22%2F%3E      %3Cpath class%3D%22cls-7%22 d%3D%22m0%2C33.78v-2.76C0%2C12.9%2C13.62%2C14.48%2C13.62%2C14.48h8.38c-5.5.46-9.5%2C4.71-9.5%2C9.96l.02%2C15.8c0%2C5.54%2C4.44%2C10.59%2C9.48%2C10.59l-8-.5S0%2C51.88%2C0%2C33.77h0Z%22%2F%3E      %3Cpath class%3D%22cls-6%22 d%3D%22m73%2C31.51v2.76c0%2C18.12-13.62%2C16.53-13.62%2C16.53h-7.99c5.61-.85%2C9.09-4.76%2C9.09-10.02l.02-16.33c0-5.54-4.46-10-9.5-10h8s13.99-1.05%2C13.99%2C17.07h0Z%22%2F%3E    %3C%2Fg%3E  %3C%2Fg%3E%3C%2Fsvg%3E\");background-size:18px;background-repeat:no-repeat;background-position-x:4px;background-position-y:5px}[_nghost-%COMP%]   .genius-avatar[_ngcontent-%COMP%]{position:relative;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:16px;flex-shrink:0;border:1px solid #dfe0e3;background:#fff}[_nghost-%COMP%]   .genius-avatar[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]{font-size:22px;background:linear-gradient(88.5deg,#4eb7df 10%,#6969ff);background-clip:text;-webkit-text-fill-color:transparent}[_nghost-%COMP%]   .avatar[_ngcontent-%COMP%], [_nghost-%COMP%]   .genius-avatar[_ngcontent-%COMP%], [_nghost-%COMP%]   dr-avatar[_ngcontent-%COMP%]{margin:0 16px 0 0}[_nghost-%COMP%]   .avatar[_ngcontent-%COMP%]  .users-section__user, [_nghost-%COMP%]   .genius-avatar[_ngcontent-%COMP%]  .users-section__user, [_nghost-%COMP%]   dr-avatar[_ngcontent-%COMP%]  .users-section__user{border:1px solid #dfe0e3}[_nghost-%COMP%]   .message[_ngcontent-%COMP%]{display:flex;align-items:center;flex-grow:1}[_nghost-%COMP%]   .message__actions[_ngcontent-%COMP%]{display:flex;align-items:center;margin-top:12px;flex-grow:1;justify-content:flex-start}[_nghost-%COMP%]   .message__actions[_ngcontent-%COMP%]  button:not(:hover) i[class*=dr-icon]{color:#b9b9ec!important}[_nghost-%COMP%]   .messageGroup[_ngcontent-%COMP%]{display:flex;flex-direction:column;align-items:flex-start}"], data: { animation: [
                 trigger('flyInOut', [
                     state('in', style({ transform: 'translateX(0)' })),
                     transition('void => *', [style({ transform: 'translateX(-100%)' }), animate(80)]),
@@ -5713,7 +5716,7 @@ class DrChatMessageComponent {
                         transition('void => *', [style({ transform: 'translateX(-100%)' }), animate(80)]),
                         transition('* => void', [animate(80, style({ transform: 'translateX(100%)' }))]),
                     ]),
-                ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"message.avatarUrl; else userAvatar\">\n    <div class=\"avatar\" [style.background-image]=\"'url(' + message.avatarUrl + ')'\"></div>\n</ng-container>\n<ng-template #userAvatar>\n    <dr-avatar *ngIf=\"message.user\" [users]=\"message.user\"></dr-avatar>\n</ng-template>\n<div class=\"message\" [class.message--custom]=\"customMessage\" [ngClass]=\"applyMessageGroupClass(message)\">\n    <ng-container [ngSwitch]=\"message.kind\">\n        <dr-chat-message-text *ngSwitchCase=\"MESSAGE_TYPE.TEXT\" [message]=\"message\"></dr-chat-message-text>\n        <dr-chat-message-file *ngSwitchCase=\"MESSAGE_TYPE.DOWNLOAD_FILE\" [message]=\"message\"></dr-chat-message-file>\n        <ng-container *ngSwitchDefault>\n            <ng-container [ngTemplateOutlet]=\"getTemplate()\" [ngTemplateOutletContext]=\"getTemplateContext()\"></ng-container>\n        </ng-container>\n    </ng-container>\n    <div class=\"message__actions\" *ngIf=\"drChatMessageActions\">\n        <ng-container [ngTemplateOutlet]=\"drChatMessageActions\"></ng-container>\n    </div>\n</div>\n", styles: [":host{position:relative;display:flex;flex-direction:row;width:100%;background:#f9faffb3;border-top:1px solid #e5e5e5;padding:16px}:host:first-child{border:none}:host:last-child{border-bottom:1px solid #e5e5e5}.reply+:host.reply,.not-reply+:host.not-reply{border-top:none;padding-top:0;padding-left:60px}.reply+:host.reply .avatar,.reply+:host.reply dr-avatar,.not-reply+:host.not-reply .avatar,.not-reply+:host.not-reply dr-avatar{display:none}:host.not-reply{background-color:#fff}:host .avatar{display:flex;width:28px;height:28px;background-color:#fff;border-radius:16px;flex-shrink:0;border:1px solid #dfe0e3;background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22UTF-8%22%3F%3E%3Csvg id%3D%22Layer_1%22 data-name%3D%22Layer 1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 viewBox%3D%220 0 74 65%22%3E  %3Cdefs%3E    %3Cstyle%3E      .cls-1%2C .cls-2%2C .cls-3 %7B        fill%3A none%3B      %7D      .cls-4 %7B        fill%3A url(%23linear-gradient)%3B      %7D      .cls-5 %7B        fill%3A %234eb7df%3B      %7D      .cls-2 %7B        stroke%3A %23a6a8aa%3B        stroke-miterlimit%3A 10%3B        stroke-width%3A .37px%3B      %7D      .cls-6 %7B        fill%3A url(%23linear-gradient-3)%3B      %7D      .cls-7 %7B        fill%3A url(%23linear-gradient-2)%3B      %7D      .cls-3 %7B        clip-path%3A url(%23clippath)%3B      %7D    %3C%2Fstyle%3E    %3CclipPath id%3D%22clippath%22%3E      %3Crect class%3D%22cls-1%22 width%3D%2274%22 height%3D%2265%22%2F%3E    %3C%2FclipPath%3E    %3ClinearGradient id%3D%22linear-gradient%22 x1%3D%2224.26%22 y1%3D%22-3.79%22 x2%3D%2295.63%22 y2%3D%2288.82%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%220%22 stop-color%3D%22%237676ff%22%2F%3E      %3Cstop offset%3D%22.18%22 stop-color%3D%22%235959ff%22%2F%3E      %3Cstop offset%3D%22.35%22 stop-color%3D%22%235757e0%22%2F%3E      %3Cstop offset%3D%22.61%22 stop-color%3D%22%234646ce%22%2F%3E      %3Cstop offset%3D%22.84%22 stop-color%3D%22%234b4be4%22%2F%3E      %3Cstop offset%3D%221%22 stop-color%3D%22%234444eb%22%2F%3E    %3C%2FlinearGradient%3E    %3ClinearGradient id%3D%22linear-gradient-2%22 x1%3D%2212.05%22 y1%3D%2277.06%22 x2%3D%2210.77%22 y2%3D%2213.85%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%22.45%22 stop-color%3D%22%232f92b8%22%2F%3E      %3Cstop offset%3D%22.84%22 stop-color%3D%22%234eb7df%22%2F%3E      %3Cstop offset%3D%221%22 stop-color%3D%22%234eb7df%22%2F%3E    %3C%2FlinearGradient%3E    %3ClinearGradient id%3D%22linear-gradient-3%22 x1%3D%2262.26%22 y1%3D%22-2.54%22 x2%3D%2261.76%22 y2%3D%2285.91%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%220%22 stop-color%3D%22%2336369b%22%2F%3E      %3Cstop offset%3D%22.52%22 stop-color%3D%22%234848d0%22%2F%3E    %3C%2FlinearGradient%3E  %3C%2Fdefs%3E  %3Cg class%3D%22cls-3%22%3E    %3Cg%3E      %3Cpath class%3D%22cls-4%22 d%3D%22m73.32%2C24.79v15.73c0%2C13.12-9.87%2C23.79-22%2C23.79h-21.32c-3.46-.06-6.25-3.11-6.25-6.87s2.79-6.81%2C6.25-6.87h21.32c5.13%2C0%2C9.29-4.51%2C9.29-10.05v-15.73c0-5.54-4.17-10.05-9.29-10.05h-7.46c3.51%2C0%2C6.35-3.08%2C6.35-6.88s-2.79-6.8-6.25-6.87h7.35c12.12%2C0%2C22%2C10.67%2C22%2C23.79h0Z%22%2F%3E      %3Cpath class%3D%22cls-5%22 d%3D%22m50.26%2C7.82c0%2C3.8-2.9%2C6.93-6.41%2C6.93h-21.86c-5.13%2C0-9.29%2C4.51-9.29%2C10.05v15.73c0%2C5.54%2C4.17%2C10.05%2C9.29%2C10.05h8.01c-3.46.06-6.25%2C3.11-6.25%2C6.87s2.79%2C6.81%2C6.25%2C6.87h-8.01c-12.12%2C0-22-10.67-22-23.79v-15.73C0%2C11.68%2C9.87%2C1%2C21.99%2C1h21.97c3.46.06%2C6.3%2C3.06%2C6.3%2C6.82Z%22%2F%3E      %3Cpath class%3D%22cls-2%22 d%3D%22m66.45%2C1h-.22.22%2C0Z%22%2F%3E      %3Cpath class%3D%22cls-2%22 d%3D%22m36.05%2C50.58h-.22.22%2C0Z%22%2F%3E      %3Cpath class%3D%22cls-7%22 d%3D%22m0%2C33.78v-2.76C0%2C12.9%2C13.62%2C14.48%2C13.62%2C14.48h8.38c-5.5.46-9.5%2C4.71-9.5%2C9.96l.02%2C15.8c0%2C5.54%2C4.44%2C10.59%2C9.48%2C10.59l-8-.5S0%2C51.88%2C0%2C33.77h0Z%22%2F%3E      %3Cpath class%3D%22cls-6%22 d%3D%22m73%2C31.51v2.76c0%2C18.12-13.62%2C16.53-13.62%2C16.53h-7.99c5.61-.85%2C9.09-4.76%2C9.09-10.02l.02-16.33c0-5.54-4.46-10-9.5-10h8s13.99-1.05%2C13.99%2C17.07h0Z%22%2F%3E    %3C%2Fg%3E  %3C%2Fg%3E%3C%2Fsvg%3E\");background-size:18px;background-repeat:no-repeat;background-position-x:4px;background-position-y:5px}:host .avatar,:host dr-avatar{margin:0 16px 0 0}:host .avatar::ng-deep .users-section__user,:host dr-avatar::ng-deep .users-section__user{border:1px solid #dfe0e3}:host .message{display:flex;align-items:center;flex-grow:1}:host .message__actions{display:flex;align-items:center;margin-top:12px;flex-grow:1;justify-content:flex-start}:host .message__actions::ng-deep button:not(:hover) i[class*=dr-icon]{color:#b9b9ec!important}:host .messageGroup{display:flex;flex-direction:column;align-items:flex-start}\n"] }]
+                ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"message.avatarUrl; else userAvatar\">\n    <div class=\"avatar\" [style.background-image]=\"'url(' + message.avatarUrl + ')'\"></div>\n</ng-container>\n<ng-template #userAvatar>\n    <dr-avatar *ngIf=\"message.user\" [users]=\"message.user\"></dr-avatar>\n\n    <div *ngIf=\"!message.user\" class=\"genius-avatar\">\n        <i class=\"dr-icon-genius-sparks\"></i>\n    </div>\n</ng-template>\n<div class=\"message\" [class.message--custom]=\"customMessage\" [ngClass]=\"applyMessageGroupClass(message)\">\n    <ng-container [ngSwitch]=\"message.kind\">\n        <dr-chat-message-text *ngSwitchCase=\"MESSAGE_TYPE.TEXT\" [message]=\"message\"></dr-chat-message-text>\n        <dr-chat-message-file *ngSwitchCase=\"MESSAGE_TYPE.DOWNLOAD_FILE\" [message]=\"message\"></dr-chat-message-file>\n        <ng-container *ngSwitchDefault>\n            <ng-container [ngTemplateOutlet]=\"getTemplate()\" [ngTemplateOutletContext]=\"getTemplateContext()\"></ng-container>\n        </ng-container>\n    </ng-container>\n    <div class=\"message__actions\" *ngIf=\"drChatMessageActions\">\n        <ng-container [ngTemplateOutlet]=\"drChatMessageActions\"></ng-container>\n    </div>\n</div>\n", styles: [":host{position:relative;display:flex;flex-direction:row;width:100%;background:#f9faffb3;border-top:1px solid #e5e5e5;padding:16px}:host:first-child{border:none}:host:last-child{border-bottom:1px solid #e5e5e5}.reply+:host.reply,.not-reply+:host.not-reply{border-top:none;padding-top:0;padding-left:60px}.reply+:host.reply .avatar,.reply+:host.reply dr-avatar,.not-reply+:host.not-reply .avatar,.not-reply+:host.not-reply dr-avatar{display:none}:host.not-reply{background-color:#fff}:host .avatar{display:flex;width:28px;height:28px;background-color:#fff;border-radius:16px;flex-shrink:0;border:1px solid #dfe0e3;background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22UTF-8%22%3F%3E%3Csvg id%3D%22Layer_1%22 data-name%3D%22Layer 1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 viewBox%3D%220 0 74 65%22%3E  %3Cdefs%3E    %3Cstyle%3E      .cls-1%2C .cls-2%2C .cls-3 %7B        fill%3A none%3B      %7D      .cls-4 %7B        fill%3A url(%23linear-gradient)%3B      %7D      .cls-5 %7B        fill%3A %234eb7df%3B      %7D      .cls-2 %7B        stroke%3A %23a6a8aa%3B        stroke-miterlimit%3A 10%3B        stroke-width%3A .37px%3B      %7D      .cls-6 %7B        fill%3A url(%23linear-gradient-3)%3B      %7D      .cls-7 %7B        fill%3A url(%23linear-gradient-2)%3B      %7D      .cls-3 %7B        clip-path%3A url(%23clippath)%3B      %7D    %3C%2Fstyle%3E    %3CclipPath id%3D%22clippath%22%3E      %3Crect class%3D%22cls-1%22 width%3D%2274%22 height%3D%2265%22%2F%3E    %3C%2FclipPath%3E    %3ClinearGradient id%3D%22linear-gradient%22 x1%3D%2224.26%22 y1%3D%22-3.79%22 x2%3D%2295.63%22 y2%3D%2288.82%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%220%22 stop-color%3D%22%237676ff%22%2F%3E      %3Cstop offset%3D%22.18%22 stop-color%3D%22%235959ff%22%2F%3E      %3Cstop offset%3D%22.35%22 stop-color%3D%22%235757e0%22%2F%3E      %3Cstop offset%3D%22.61%22 stop-color%3D%22%234646ce%22%2F%3E      %3Cstop offset%3D%22.84%22 stop-color%3D%22%234b4be4%22%2F%3E      %3Cstop offset%3D%221%22 stop-color%3D%22%234444eb%22%2F%3E    %3C%2FlinearGradient%3E    %3ClinearGradient id%3D%22linear-gradient-2%22 x1%3D%2212.05%22 y1%3D%2277.06%22 x2%3D%2210.77%22 y2%3D%2213.85%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%22.45%22 stop-color%3D%22%232f92b8%22%2F%3E      %3Cstop offset%3D%22.84%22 stop-color%3D%22%234eb7df%22%2F%3E      %3Cstop offset%3D%221%22 stop-color%3D%22%234eb7df%22%2F%3E    %3C%2FlinearGradient%3E    %3ClinearGradient id%3D%22linear-gradient-3%22 x1%3D%2262.26%22 y1%3D%22-2.54%22 x2%3D%2261.76%22 y2%3D%2285.91%22 gradientTransform%3D%22translate(0 65.89) scale(1 -1)%22 gradientUnits%3D%22userSpaceOnUse%22%3E      %3Cstop offset%3D%220%22 stop-color%3D%22%2336369b%22%2F%3E      %3Cstop offset%3D%22.52%22 stop-color%3D%22%234848d0%22%2F%3E    %3C%2FlinearGradient%3E  %3C%2Fdefs%3E  %3Cg class%3D%22cls-3%22%3E    %3Cg%3E      %3Cpath class%3D%22cls-4%22 d%3D%22m73.32%2C24.79v15.73c0%2C13.12-9.87%2C23.79-22%2C23.79h-21.32c-3.46-.06-6.25-3.11-6.25-6.87s2.79-6.81%2C6.25-6.87h21.32c5.13%2C0%2C9.29-4.51%2C9.29-10.05v-15.73c0-5.54-4.17-10.05-9.29-10.05h-7.46c3.51%2C0%2C6.35-3.08%2C6.35-6.88s-2.79-6.8-6.25-6.87h7.35c12.12%2C0%2C22%2C10.67%2C22%2C23.79h0Z%22%2F%3E      %3Cpath class%3D%22cls-5%22 d%3D%22m50.26%2C7.82c0%2C3.8-2.9%2C6.93-6.41%2C6.93h-21.86c-5.13%2C0-9.29%2C4.51-9.29%2C10.05v15.73c0%2C5.54%2C4.17%2C10.05%2C9.29%2C10.05h8.01c-3.46.06-6.25%2C3.11-6.25%2C6.87s2.79%2C6.81%2C6.25%2C6.87h-8.01c-12.12%2C0-22-10.67-22-23.79v-15.73C0%2C11.68%2C9.87%2C1%2C21.99%2C1h21.97c3.46.06%2C6.3%2C3.06%2C6.3%2C6.82Z%22%2F%3E      %3Cpath class%3D%22cls-2%22 d%3D%22m66.45%2C1h-.22.22%2C0Z%22%2F%3E      %3Cpath class%3D%22cls-2%22 d%3D%22m36.05%2C50.58h-.22.22%2C0Z%22%2F%3E      %3Cpath class%3D%22cls-7%22 d%3D%22m0%2C33.78v-2.76C0%2C12.9%2C13.62%2C14.48%2C13.62%2C14.48h8.38c-5.5.46-9.5%2C4.71-9.5%2C9.96l.02%2C15.8c0%2C5.54%2C4.44%2C10.59%2C9.48%2C10.59l-8-.5S0%2C51.88%2C0%2C33.77h0Z%22%2F%3E      %3Cpath class%3D%22cls-6%22 d%3D%22m73%2C31.51v2.76c0%2C18.12-13.62%2C16.53-13.62%2C16.53h-7.99c5.61-.85%2C9.09-4.76%2C9.09-10.02l.02-16.33c0-5.54-4.46-10-9.5-10h8s13.99-1.05%2C13.99%2C17.07h0Z%22%2F%3E    %3C%2Fg%3E  %3C%2Fg%3E%3C%2Fsvg%3E\");background-size:18px;background-repeat:no-repeat;background-position-x:4px;background-position-y:5px}:host .genius-avatar{position:relative;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:16px;flex-shrink:0;border:1px solid #dfe0e3;background:#fff}:host .genius-avatar i{font-size:22px;background:linear-gradient(88.5deg,#4eb7df 10%,#6969ff);background-clip:text;-webkit-text-fill-color:transparent}:host .avatar,:host .genius-avatar,:host dr-avatar{margin:0 16px 0 0}:host .avatar::ng-deep .users-section__user,:host .genius-avatar::ng-deep .users-section__user,:host dr-avatar::ng-deep .users-section__user{border:1px solid #dfe0e3}:host .message{display:flex;align-items:center;flex-grow:1}:host .message__actions{display:flex;align-items:center;margin-top:12px;flex-grow:1;justify-content:flex-start}:host .message__actions::ng-deep button:not(:hover) i[class*=dr-icon]{color:#b9b9ec!important}:host .messageGroup{display:flex;flex-direction:column;align-items:flex-start}\n"] }]
     }], function () { return [{ type: DrChatCustomMessageService }]; }, { flyInOut: [{
             type: HostBinding,
             args: ['@flyInOut']