@datarailsshared/datarailsshared 1.6.216 → 1.6.220

package/fesm2022/datarailsshared-datarailsshared.mjs

@@ -32,8 +32,6 @@ import * as i1$6 from '@angular/material/legacy-dialog';
 import { MAT_LEGACY_DIALOG_DATA, MatLegacyDialogRef, MatLegacyDialogModule } from '@angular/material/legacy-dialog';
 import * as i1$7 from 'ngx-toastr';
 import { Toast, ToastrModule } from 'ngx-toastr';
-import { EmojiService } from '@ctrl/ngx-emoji-mart/ngx-emoji';
-import { PickerComponent } from '@ctrl/ngx-emoji-mart';
 import 'codemirror/mode/javascript/javascript';
 import 'codemirror/addon/edit/matchbrackets';
 import 'codemirror/addon/hint/show-hint';
@@ -697,7 +695,7 @@ var TooltipTheme;
     TooltipTheme["DARK"] = "dark";
 })(TooltipTheme || (TooltipTheme = {}));
 
-const _c0$P = ["*"];
+const _c0$Q = ["*"];
 class TooltipDefaultComponent {
     constructor() {
         this.theme = TooltipTheme.LIGHT;
@@ -705,7 +703,7 @@ class TooltipDefaultComponent {
     /** @nocollapse */ static { this.ɵfac = function TooltipDefaultComponent_Factory(t) { return new (t || TooltipDefaultComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: TooltipDefaultComponent, selectors: [["dr-tooltip-default"]], hostVars: 2, hostBindings: function TooltipDefaultComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassMap(ctx.theme);
-        } }, inputs: { content: "content", theme: "theme" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$P, decls: 2, vars: 1, consts: [[1, "content", 3, "innerHTML"]], template: function TooltipDefaultComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { content: "content", theme: "theme" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$Q, decls: 2, vars: 1, consts: [[1, "content", 3, "innerHTML"]], template: function TooltipDefaultComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelement(0, "span", 0);
             i0.ɵɵprojection(1);
@@ -725,7 +723,7 @@ class TooltipDefaultComponent {
             args: ['class']
         }] }); })();
 
-const _c0$O = ["container"];
+const _c0$P = ["container"];
 class TooltipCustomComponent {
     constructor() {
         this.injector = inject(Injector);
@@ -756,7 +754,7 @@ class TooltipCustomComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function TooltipCustomComponent_Factory(t) { return new (t || TooltipCustomComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: TooltipCustomComponent, selectors: [["dr-tooltip-custom"]], viewQuery: function TooltipCustomComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$O, 7, ViewContainerRef);
+            i0.ɵɵviewQuery(_c0$P, 7, ViewContainerRef);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.container = _t.first);
@@ -817,7 +815,7 @@ function TooltipComponent_ng_template_5_Template(rf, ctx) { if (rf & 1) {
     const ctx_r5 = i0.ɵɵnextContext();
     i0.ɵɵproperty("content", ctx_r5.content)("theme", ctx_r5.theme);
 } }
-const _c0$N = function (a0) { return { "dr-tooltip": a0 }; };
+const _c0$O = function (a0) { return { "dr-tooltip": a0 }; };
 class TooltipComponent {
     constructor() {
         this.isContentTemplate = false;
@@ -850,7 +848,7 @@ class TooltipComponent {
         } if (rf & 2) {
             const _r2 = i0.ɵɵreference(4);
             i0.ɵɵclassMap(ctx.position + " " + ctx.class + " " + ctx.theme);
-            i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(6, _c0$N, !(ctx.options == null ? null : ctx.options.withoutContainerStyles)));
+            i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(6, _c0$O, !(ctx.options == null ? null : ctx.options.withoutContainerStyles)));
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", !(ctx.options == null ? null : ctx.options.withoutArrow));
             i0.ɵɵadvance(1);
@@ -1193,7 +1191,7 @@ class DrModelDebounceChangeDirective {
             type: Output
         }] }); })();
 
-const _c0$M = ["prefix"];
+const _c0$N = ["prefix"];
 const _c1$l = ["suffix"];
 const _c2$c = ["inputRef"];
 function DrInputComponent_ng_container_1_Template(rf, ctx) { if (rf & 1) {
@@ -1406,7 +1404,7 @@ class DrInputComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrInputComponent_Factory(t) { return new (t || DrInputComponent)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrInputComponent, selectors: [["dr-input"]], contentQueries: function DrInputComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
-            i0.ɵɵcontentQuery(dirIndex, _c0$M, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c0$N, 5);
             i0.ɵɵcontentQuery(dirIndex, _c1$l, 5);
         } if (rf & 2) {
             let _t;
@@ -1530,7 +1528,7 @@ class DrInputComponent {
             args: ['tabindex']
         }] }); })();
 
-const _c0$L = ["labelTemplate"];
+const _c0$M = ["labelTemplate"];
 const _c1$k = ["multiLabelTemplate"];
 const _c2$b = ["optionTemplate"];
 const _c3$6 = ["optionHeaderTemplate"];
@@ -1745,6 +1743,10 @@ class DrSelectComponent {
         }
         this.onChange(selectedItem);
         this.change.emit(selectedItem);
+        this.ngSelect.blur();
+        if (this.searchable) {
+            this.ngSelect.searchInput.nativeElement.blur();
+        }
     }
     onTabKeypress(e) {
         if (this.selectOnTabKeyPress && this.ngSelect) {
@@ -1788,7 +1790,7 @@ class DrSelectComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrSelectComponent_Factory(t) { return new (t || DrSelectComponent)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.Renderer2)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrSelectComponent, selectors: [["dr-select"]], contentQueries: function DrSelectComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
-            i0.ɵɵcontentQuery(dirIndex, _c0$L, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c0$M, 5);
             i0.ɵɵcontentQuery(dirIndex, _c1$k, 5);
             i0.ɵɵcontentQuery(dirIndex, _c2$b, 5);
             i0.ɵɵcontentQuery(dirIndex, _c3$6, 5);
@@ -1998,7 +2000,7 @@ class DrShowTimeframePipe {
             }]
     }], null, null); })();
 
-const _c0$K = ["class", "component"];
+const _c0$L = ["class", "component"];
 const _c1$j = function (a0) { return { "dr-datepicker-preset-date__tags__tag--selected": a0 }; };
 function DrDatePickerCustomHeaderComponent_div_0_div_1_div_2_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
@@ -2289,7 +2291,7 @@ class DrDatePickerCustomHeaderComponent {
         calendar.insertBefore(selector.location.nativeElement, calendar.firstChild);
     }
     /** @nocollapse */ static { this.ɵfac = function DrDatePickerCustomHeaderComponent_Factory(t) { return new (t || DrDatePickerCustomHeaderComponent)(i0.ɵɵdirectiveInject(i6.MatCalendar), i0.ɵɵdirectiveInject(i1$4.DateAdapter), i0.ɵɵdirectiveInject(MAT_DATE_FORMATS), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(DrDatePickerService)); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrDatePickerCustomHeaderComponent, selectors: [["dr-date-picker_custom-header", 8, "component"]], attrs: _c0$K, decls: 12, vars: 4, consts: [["class", "dr-datepicker__timeframe-select__wrapper", 4, "ngIf"], [1, "dr-date-paging"], [1, "dr-date-paging", "flip-page-button", 3, "click"], [1, "dr-icon-arrow-left", "presentation_buttons-navigate_input"], [1, "example-header-label"], [3, "click"], [1, "dr-icon-arrow-right", "presentation_buttons-navigate_input"], ["class", "dr-quarterly-datepicker", 4, "ngIf"], [1, "dr-datepicker__timeframe-select__wrapper"], ["class", "dr-datepicker-preset-date", 4, "ngIf"], ["class", "dr-datepicker__timeframe-select", "bindLabel", "title", "bindValue", "value", 3, "ngModel", "items", "ngModelChange", 4, "ngIf"], [1, "dr-datepicker-preset-date"], [1, "dr-datepicker-preset-date__tags", 3, "ngClass"], ["id", "preset_tag", "class", "dr-datepicker-preset-date__tags__tag", 3, "ngClass", "drTooltip", "drTooltipPosition", "click", 4, "ngFor", "ngForOf"], ["id", "preset_tag", 1, "dr-datepicker-preset-date__tags__tag", 3, "ngClass", "drTooltip", "drTooltipPosition", "click"], ["bindLabel", "title", "bindValue", "value", 1, "dr-datepicker__timeframe-select", 3, "ngModel", "items", "ngModelChange"], [1, "dr-quarterly-datepicker"], ["quarterlyDatePicker", ""], ["class", "quarter-selector", 3, "class", "quarter-selector--disabled", "quarter-selector--select-current-quarter", "click", 4, "ngFor", "ngForOf"], [1, "quarter-selector", 3, "click"]], template: function DrDatePickerCustomHeaderComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrDatePickerCustomHeaderComponent, selectors: [["dr-date-picker_custom-header", 8, "component"]], attrs: _c0$L, decls: 12, vars: 4, consts: [["class", "dr-datepicker__timeframe-select__wrapper", 4, "ngIf"], [1, "dr-date-paging"], [1, "dr-date-paging", "flip-page-button", 3, "click"], [1, "dr-icon-arrow-left", "presentation_buttons-navigate_input"], [1, "example-header-label"], [3, "click"], [1, "dr-icon-arrow-right", "presentation_buttons-navigate_input"], ["class", "dr-quarterly-datepicker", 4, "ngIf"], [1, "dr-datepicker__timeframe-select__wrapper"], ["class", "dr-datepicker-preset-date", 4, "ngIf"], ["class", "dr-datepicker__timeframe-select", "bindLabel", "title", "bindValue", "value", 3, "ngModel", "items", "ngModelChange", 4, "ngIf"], [1, "dr-datepicker-preset-date"], [1, "dr-datepicker-preset-date__tags", 3, "ngClass"], ["id", "preset_tag", "class", "dr-datepicker-preset-date__tags__tag", 3, "ngClass", "drTooltip", "drTooltipPosition", "click", 4, "ngFor", "ngForOf"], ["id", "preset_tag", 1, "dr-datepicker-preset-date__tags__tag", 3, "ngClass", "drTooltip", "drTooltipPosition", "click"], ["bindLabel", "title", "bindValue", "value", 1, "dr-datepicker__timeframe-select", 3, "ngModel", "items", "ngModelChange"], [1, "dr-quarterly-datepicker"], ["quarterlyDatePicker", ""], ["class", "quarter-selector", 3, "class", "quarter-selector--disabled", "quarter-selector--select-current-quarter", "click", 4, "ngFor", "ngForOf"], [1, "quarter-selector", 3, "click"]], template: function DrDatePickerCustomHeaderComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, DrDatePickerCustomHeaderComponent_div_0_Template, 3, 2, "div", 0);
             i0.ɵɵelementStart(1, "div", 1)(2, "div", 2);
             i0.ɵɵlistener("click", function DrDatePickerCustomHeaderComponent_Template_div_click_2_listener() { return ctx.pagingClicked(false); });
@@ -2377,7 +2379,7 @@ function DrButtonComponent_i_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵclassMap(ctx_r2.iconAfter);
     i0.ɵɵstyleProp("font-size", ctx_r2.iconAfterSize)("color", ctx_r2.iconAfterColor || "inherit");
 } }
-const _c0$J = ["*"];
+const _c0$K = ["*"];
 class DrButtonComponent {
     constructor() {
         this.theme = 'primary';
@@ -2391,7 +2393,7 @@ class DrButtonComponent {
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrButtonComponent, selectors: [["dr-button"]], hostVars: 12, hostBindings: function DrButtonComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassMap(ctx.theme);
             i0.ɵɵclassProp("with-icon", ctx.icon)("with-icon-after", ctx.iconAfter)("disabled", ctx.disabled)("loading", ctx.isLoading)("active", ctx.isActive);
-        } }, inputs: { theme: "theme", icon: "icon", iconColor: "iconColor", iconSize: "iconSize", iconAfter: "iconAfter", iconAfterColor: "iconAfterColor", iconAfterSize: "iconAfterSize", disabled: "disabled", isLoading: "isLoading", isActive: "isActive" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$J, decls: 5, vars: 4, consts: [[3, "disabled"], ["class", "dr-button__icon", 3, "class", "font-size", "color", 4, "ngIf"], ["class", "dr-button__spinner", 4, "ngIf"], ["class", "dr-button__icon dr-button__icon--after", 3, "class", "font-size", "color", 4, "ngIf"], [1, "dr-button__icon"], [1, "dr-button__spinner"], [1, "dr-icon-load"], [1, "dr-button__icon", "dr-button__icon--after"]], template: function DrButtonComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { theme: "theme", icon: "icon", iconColor: "iconColor", iconSize: "iconSize", iconAfter: "iconAfter", iconAfterColor: "iconAfterColor", iconAfterSize: "iconAfterSize", disabled: "disabled", isLoading: "isLoading", isActive: "isActive" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$K, decls: 5, vars: 4, consts: [[3, "disabled"], ["class", "dr-button__icon", 3, "class", "font-size", "color", 4, "ngIf"], ["class", "dr-button__spinner", 4, "ngIf"], ["class", "dr-button__icon dr-button__icon--after", 3, "class", "font-size", "color", 4, "ngIf"], [1, "dr-button__icon"], [1, "dr-button__spinner"], [1, "dr-icon-load"], [1, "dr-button__icon", "dr-button__icon--after"]], template: function DrButtonComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "button", 0);
             i0.ɵɵtemplate(1, DrButtonComponent_i_1_Template, 1, 6, "i", 1);
@@ -2500,7 +2502,7 @@ class DrDatePickerFormatDirective {
             args: ['drDatePickerFormat']
         }] }); })();
 
-const _c0$I = ["datePicker"];
+const _c0$J = ["datePicker"];
 function DrDatePickerComponent_i_0_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "i", 2);
@@ -2873,7 +2875,7 @@ class DrDatePickerComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrDatePickerComponent_Factory(t) { return new (t || DrDatePickerComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1$4.DateAdapter), i0.ɵɵdirectiveInject(DrDatePickerService)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrDatePickerComponent, selectors: [["dr-date-picker"]], viewQuery: function DrDatePickerComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$I, 5);
+            i0.ɵɵviewQuery(_c0$J, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.datePicker = _t.first);
@@ -4082,11 +4084,11 @@ class ListTagComponent {
             type: Output
         }] }); })();
 
-const _c0$H = ["dynamicInputRef"];
+const _c0$I = ["dynamicInputRef"];
 function DrSelectAddItemComponent_div_1_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 3);
-    i0.ɵɵlistener("click", function DrSelectAddItemComponent_div_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r3); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onDynamicAdding()); });
+    i0.ɵɵlistener("click", function DrSelectAddItemComponent_div_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r3); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.instantAddValue ? ctx_r2.onDynamicAdd(ctx_r2.instantAddValue) : ctx_r2.onDynamicAdding()); });
     i0.ɵɵelement(1, "i", 4);
     i0.ɵɵelementStart(2, "p", 5);
     i0.ɵɵtext(3);
@@ -4145,6 +4147,7 @@ class DrSelectAddItemComponent {
         this.dynamicAddLabel = 'Add new';
         this.values = [];
         this.showOnlyInput = false;
+        this.instantAddValue = '';
         this.dynamicValueAdded = new EventEmitter();
     }
     ngOnChanges(changes) {
@@ -4168,6 +4171,9 @@ class DrSelectAddItemComponent {
     }
     onDynamicAdd(value, keydownEvent) {
         this.isDirty = true;
+        if (this.instantAddValue) {
+            this.dynamicValue = this.instantAddValue;
+        }
         if (!this.isDynamicValueValid())
             return;
         if (keydownEvent && keydownEvent.key !== 'Enter')
@@ -4186,11 +4192,11 @@ class DrSelectAddItemComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrSelectAddItemComponent_Factory(t) { return new (t || DrSelectAddItemComponent)(i0.ɵɵdirectiveInject(DrSelectComponent)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrSelectAddItemComponent, selectors: [["dr-select-add-item"]], viewQuery: function DrSelectAddItemComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$H, 5);
+            i0.ɵɵviewQuery(_c0$I, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.inputRef = _t.first);
-        } }, inputs: { dynamicAddLabel: "dynamicAddLabel", bindValue: "bindValue", values: "values", alertMsg: "alertMsg", showOnlyInput: "showOnlyInput" }, outputs: { dynamicValueAdded: "dynamicValueAdded" }, features: [i0.ɵɵNgOnChangesFeature], decls: 3, vars: 2, consts: [[1, "dr-select__dynamic-add", "dynamic-add"], ["class", "dynamic-add__add-item", 3, "click", 4, "ngIf"], ["class", "dynamic-add__field", 4, "ngIf"], [1, "dynamic-add__add-item", 3, "click"], [1, "dr-icon-add"], [1, "dynamic-add__add-item__text"], [1, "dynamic-add__field"], ["class", "dynamic-add__field__alert", 4, "ngIf"], ["placeholder", "Type...", 1, "dynamic-add__field__input", 3, "ngModel", "ngModelChange", "keydown"], ["dynamicInputRef", ""], [1, "dynamic-add__field__buttons"], ["theme", "icon", "icon", "dr-icon-approve", "iconSize", "18px", 3, "click", 4, "ngIf"], ["theme", "icon", "icon", "dr-icon-exit", "iconSize", "18px", 3, "click"], [1, "dynamic-add__field__alert"], ["theme", "icon", "icon", "dr-icon-approve", "iconSize", "18px", 3, "click"]], template: function DrSelectAddItemComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { dynamicAddLabel: "dynamicAddLabel", bindValue: "bindValue", values: "values", alertMsg: "alertMsg", showOnlyInput: "showOnlyInput", instantAddValue: "instantAddValue" }, outputs: { dynamicValueAdded: "dynamicValueAdded" }, features: [i0.ɵɵNgOnChangesFeature], decls: 3, vars: 2, consts: [[1, "dr-select__dynamic-add", "dynamic-add"], ["class", "dynamic-add__add-item", 3, "click", 4, "ngIf"], ["class", "dynamic-add__field", 4, "ngIf"], [1, "dynamic-add__add-item", 3, "click"], [1, "dr-icon-add"], [1, "dynamic-add__add-item__text"], [1, "dynamic-add__field"], ["class", "dynamic-add__field__alert", 4, "ngIf"], ["placeholder", "Type...", 1, "dynamic-add__field__input", 3, "ngModel", "ngModelChange", "keydown"], ["dynamicInputRef", ""], [1, "dynamic-add__field__buttons"], ["theme", "icon", "icon", "dr-icon-approve", "iconSize", "18px", 3, "click", 4, "ngIf"], ["theme", "icon", "icon", "dr-icon-exit", "iconSize", "18px", 3, "click"], [1, "dynamic-add__field__alert"], ["theme", "icon", "icon", "dr-icon-approve", "iconSize", "18px", 3, "click"]], template: function DrSelectAddItemComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵtemplate(1, DrSelectAddItemComponent_div_1_Template, 4, 1, "div", 1);
             i0.ɵɵtemplate(2, DrSelectAddItemComponent_div_2_Template, 7, 5, "div", 2);
@@ -4204,7 +4210,7 @@ class DrSelectAddItemComponent {
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrSelectAddItemComponent, [{
         type: Component,
-        args: [{ selector: 'dr-select-add-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dr-select__dynamic-add dynamic-add\">\n    <div *ngIf=\"!(showOnlyInput && isDynamicAdding)\" class=\"dynamic-add__add-item\" (click)=\"onDynamicAdding()\">\n        <i class=\"dr-icon-add\"></i>\n        <p class=\"dynamic-add__add-item__text\">{{ dynamicAddLabel }}</p>\n    </div>\n    <div *ngIf=\"isDynamicAdding\" class=\"dynamic-add__field\">\n        <p *ngIf=\"alertMsg && !isDynamicValueValid() && isDirty\" class=\"dynamic-add__field__alert\">{{ alertMsg }}</p>\n        <dr-input\n            #dynamicInputRef\n            class=\"dynamic-add__field__input\"\n            [class.dynamic-add__field__input--error]=\"!isDynamicValueValid() && isDirty\"\n            [(ngModel)]=\"dynamicValue\"\n            (keydown)=\"onDynamicAdd(dynamicValue, $event)\"\n            placeholder=\"Type...\"></dr-input>\n        <div class=\"dynamic-add__field__buttons\">\n            <dr-button\n                *ngIf=\"dynamicValue && isDynamicValueValid()\"\n                theme=\"icon\"\n                icon=\"dr-icon-approve\"\n                iconSize=\"18px\"\n                (click)=\"onDynamicAdd(dynamicValue)\"></dr-button>\n            <dr-button theme=\"icon\" icon=\"dr-icon-exit\" iconSize=\"18px\" (click)=\"onDynamicAddingClose()\"></dr-button>\n        </div>\n    </div>\n</div>\n", styles: [".dynamic-add__add-item{cursor:pointer;display:flex;align-items:center;border-bottom:1px solid #dfe0e3;padding:6px}.dynamic-add__add-item:hover{background:#f9f7ff}.dynamic-add__add-item__text{font-size:14px;line-height:22px;margin:0;color:#6d6e6f}.dynamic-add__add-item .dr-icon-add{color:#6d6e6f}.dynamic-add__field{position:relative}.dynamic-add__field__buttons{position:absolute;top:0;right:0;bottom:0;display:flex;align-items:center}.dynamic-add__field__alert{font-size:12px;position:absolute;color:#bf1d30;z-index:100;right:30px}::ng-deep .ng-dropdown-panel .ng-dropdown-footer:has(.dynamic-add),::ng-deep .ng-dropdown-panel .ng-dropdown-header:has(.dynamic-add){padding:0;border:none}::ng-deep .ng-dropdown-panel .ng-dropdown-footer .dynamic-add__add-item{border-bottom:none}::ng-deep .dynamic-add__field__input{padding-left:12px!important;height:36px!important;border:none!important;background:#f9f7ff!important;border-radius:0!important}::ng-deep .dynamic-add__field__input>input{background:#f9f7ff}::ng-deep .dynamic-add__field__input>input::placeholder{line-height:22px;font-size:14px;font-weight:400;color:#9ea1aa}::ng-deep .dynamic-add__field__input--error{background:#ffdfe4!important}::ng-deep .dynamic-add__field__input--error>input{background:#ffdfe4}\n"] }]
+        args: [{ selector: 'dr-select-add-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dr-select__dynamic-add dynamic-add\">\n    <div\n        *ngIf=\"!(showOnlyInput && isDynamicAdding)\"\n        class=\"dynamic-add__add-item\"\n        (click)=\"instantAddValue ? onDynamicAdd(instantAddValue) : onDynamicAdding()\">\n        <i class=\"dr-icon-add\"></i>\n        <p class=\"dynamic-add__add-item__text\">{{ dynamicAddLabel }}</p>\n    </div>\n    <div *ngIf=\"isDynamicAdding\" class=\"dynamic-add__field\">\n        <p *ngIf=\"alertMsg && !isDynamicValueValid() && isDirty\" class=\"dynamic-add__field__alert\">{{ alertMsg }}</p>\n        <dr-input\n            #dynamicInputRef\n            class=\"dynamic-add__field__input\"\n            [class.dynamic-add__field__input--error]=\"!isDynamicValueValid() && isDirty\"\n            [(ngModel)]=\"dynamicValue\"\n            (keydown)=\"onDynamicAdd(dynamicValue, $event)\"\n            placeholder=\"Type...\"></dr-input>\n        <div class=\"dynamic-add__field__buttons\">\n            <dr-button\n                *ngIf=\"dynamicValue && isDynamicValueValid()\"\n                theme=\"icon\"\n                icon=\"dr-icon-approve\"\n                iconSize=\"18px\"\n                (click)=\"onDynamicAdd(dynamicValue)\"></dr-button>\n            <dr-button theme=\"icon\" icon=\"dr-icon-exit\" iconSize=\"18px\" (click)=\"onDynamicAddingClose()\"></dr-button>\n        </div>\n    </div>\n</div>\n", styles: [".dynamic-add__add-item{cursor:pointer;display:flex;align-items:center;border-bottom:1px solid #dfe0e3;padding:6px}.dynamic-add__add-item:hover{background:#f9f7ff}.dynamic-add__add-item__text{font-size:14px;line-height:22px;margin:0;color:#6d6e6f}.dynamic-add__add-item .dr-icon-add{color:#6d6e6f}.dynamic-add__field{position:relative}.dynamic-add__field__buttons{position:absolute;top:0;right:0;bottom:0;display:flex;align-items:center}.dynamic-add__field__alert{font-size:12px;position:absolute;color:#bf1d30;z-index:100;right:30px}::ng-deep .ng-dropdown-panel .ng-dropdown-footer:has(.dynamic-add),::ng-deep .ng-dropdown-panel .ng-dropdown-header:has(.dynamic-add){padding:0;border:none}::ng-deep .ng-dropdown-panel .ng-dropdown-footer .dynamic-add__add-item{border-bottom:none}::ng-deep .dynamic-add__field__input{padding-left:12px!important;height:36px!important;border:none!important;background:#f9f7ff!important;border-radius:0!important}::ng-deep .dynamic-add__field__input>input{background:#f9f7ff}::ng-deep .dynamic-add__field__input>input::placeholder{line-height:22px;font-size:14px;font-weight:400;color:#9ea1aa}::ng-deep .dynamic-add__field__input--error{background:#ffdfe4!important}::ng-deep .dynamic-add__field__input--error>input{background:#ffdfe4}\n"] }]
     }], function () { return [{ type: DrSelectComponent }]; }, { dynamicAddLabel: [{
             type: Input
         }], bindValue: [{
@@ -4215,6 +4221,8 @@ class DrSelectAddItemComponent {
             type: Input
         }], showOnlyInput: [{
             type: Input
+        }], instantAddValue: [{
+            type: Input
         }], dynamicValueAdded: [{
             type: Output
         }], inputRef: [{
@@ -4673,7 +4681,7 @@ class DrTagComponent {
             type: Output
         }] }); })();
 
-const _c0$G = ["*"];
+const _c0$H = ["*"];
 class RadioButtonComponent {
     get disabled() {
         return this._disabled;
@@ -4727,7 +4735,7 @@ class RadioButtonComponent {
                     useExisting: RadioButtonComponent,
                     multi: true,
                 },
-            ])], ngContentSelectors: _c0$G, decls: 4, vars: 5, consts: [["type", "radio", 3, "name", "value", "ngModel", "disabled", "change", "ngModelChange", "click"]], template: function RadioButtonComponent_Template(rf, ctx) { if (rf & 1) {
+            ])], ngContentSelectors: _c0$H, decls: 4, vars: 5, consts: [["type", "radio", 3, "name", "value", "ngModel", "disabled", "change", "ngModelChange", "click"]], template: function RadioButtonComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "label")(1, "input", 0);
             i0.ɵɵlistener("change", function RadioButtonComponent_Template_input_change_1_listener() { return ctx.valueChanged(ctx.value); })("ngModelChange", function RadioButtonComponent_Template_input_ngModelChange_1_listener($event) { return ctx.modelValue = $event; })("click", function RadioButtonComponent_Template_input_click_1_listener($event) { return ctx.toggleChange($event); });
@@ -4766,7 +4774,7 @@ class RadioButtonComponent {
             type: Input
         }] }); })();
 
-const _c0$F = [[["dr-radio-button"]]];
+const _c0$G = [[["dr-radio-button"]]];
 const _c1$i = ["dr-radio-button"];
 class RadioGroupComponent {
     get value() {
@@ -4907,7 +4915,7 @@ class RadioGroupComponent {
                     multi: true,
                 },
             ])], ngContentSelectors: _c1$i, decls: 1, vars: 0, template: function RadioGroupComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵprojectionDef(_c0$F);
+            i0.ɵɵprojectionDef(_c0$G);
             i0.ɵɵprojection(0);
         } }, encapsulation: 2, changeDetection: 0 }); }
 }
@@ -4944,7 +4952,7 @@ class RadioGroupComponent {
             type: Output
         }] }); })();
 
-const _c0$E = ["checkboxContent"];
+const _c0$F = ["checkboxContent"];
 const _c1$h = ["*"];
 class CheckboxComponent {
     get indeterminate() {
@@ -4995,7 +5003,7 @@ class CheckboxComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function CheckboxComponent_Factory(t) { return new (t || CheckboxComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: CheckboxComponent, selectors: [["dr-checkbox"]], viewQuery: function CheckboxComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$E, 5);
+            i0.ɵɵviewQuery(_c0$F, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.checkboxContent = _t.first);
@@ -5057,7 +5065,7 @@ class CheckboxComponent {
             args: ['checkboxContent']
         }] }); })();
 
-const _c0$D = ["*"];
+const _c0$E = ["*"];
 var LinkTheme;
 (function (LinkTheme) {
     LinkTheme["DEFAULT"] = "DEFAULT";
@@ -5073,7 +5081,7 @@ class DrLinkComponent {
         this.theme = LinkTheme.DEFAULT;
     }
     /** @nocollapse */ static { this.ɵfac = function DrLinkComponent_Factory(t) { return new (t || DrLinkComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLinkComponent, selectors: [["dr-link"]], inputs: { link: "link", fontSize: "fontSize", fontWeight: "fontWeight", theme: "theme" }, ngContentSelectors: _c0$D, decls: 2, vars: 7, consts: [[1, "dr-link", 3, "href"]], template: function DrLinkComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLinkComponent, selectors: [["dr-link"]], inputs: { link: "link", fontSize: "fontSize", fontWeight: "fontWeight", theme: "theme" }, ngContentSelectors: _c0$E, decls: 2, vars: 7, consts: [[1, "dr-link", 3, "href"]], template: function DrLinkComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "a", 0);
             i0.ɵɵprojection(1);
@@ -5098,7 +5106,7 @@ class DrLinkComponent {
             type: Input
         }] }); })();
 
-const _c0$C = ["class", "component"];
+const _c0$D = ["class", "component"];
 const _c1$g = function (a0) { return { "dr-datepicker-preset-date__tags__tag--selected": a0 }; };
 function DrFiscalMonthCalendarHeaderComponent_div_0_div_1_div_2_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
@@ -5201,7 +5209,7 @@ class DrFiscalMonthCalendarHeaderComponent extends DrDatePickerCustomHeaderCompo
         });
     }
     /** @nocollapse */ static { this.ɵfac = /** @pureOrBreakMyCode */ function () { let ɵDrFiscalMonthCalendarHeaderComponent_BaseFactory; return function DrFiscalMonthCalendarHeaderComponent_Factory(t) { return (ɵDrFiscalMonthCalendarHeaderComponent_BaseFactory || (ɵDrFiscalMonthCalendarHeaderComponent_BaseFactory = i0.ɵɵgetInheritedFactory(DrFiscalMonthCalendarHeaderComponent)))(t || DrFiscalMonthCalendarHeaderComponent); }; }(); }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrFiscalMonthCalendarHeaderComponent, selectors: [["dr-fiscal-month-calendar-header", 8, "component"]], features: [i0.ɵɵInheritDefinitionFeature], attrs: _c0$C, decls: 12, vars: 4, consts: [["class", "dr-datepicker__timeframe-select__wrapper", 4, "ngIf"], [1, "dr-date-paging"], [1, "dr-date-paging", "flip-page-button", 3, "click"], [1, "dr-icon-arrow-left", "presentation_buttons-navigate_input"], [1, "example-header-label"], [3, "click"], [1, "dr-icon-arrow-right", "presentation_buttons-navigate_input"], ["class", "dr-quarterly-datepicker", 4, "ngIf"], [1, "dr-datepicker__timeframe-select__wrapper"], ["class", "dr-datepicker-preset-date", 4, "ngIf"], ["class", "dr-datepicker__timeframe-select", "bindLabel", "title", "bindValue", "value", 3, "ngModel", "items", "ngModelChange", 4, "ngIf"], [1, "dr-datepicker-preset-date"], [1, "dr-datepicker-preset-date__tags", 3, "ngClass"], ["id", "preset_tag", "class", "dr-datepicker-preset-date__tags__tag", 3, "ngClass", "drTooltip", "drTooltipPosition", "click", 4, "ngFor", "ngForOf"], ["id", "preset_tag", 1, "dr-datepicker-preset-date__tags__tag", 3, "ngClass", "drTooltip", "drTooltipPosition", "click"], ["bindLabel", "title", "bindValue", "value", 1, "dr-datepicker__timeframe-select", 3, "ngModel", "items", "ngModelChange"], [1, "dr-quarterly-datepicker"], ["quarterlyDatePicker", ""], ["class", "quarter-selector", 3, "class", "quarter-selector--disabled", "quarter-selector--select-current-quarter", "click", 4, "ngFor", "ngForOf"], [1, "quarter-selector", 3, "click"]], template: function DrFiscalMonthCalendarHeaderComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrFiscalMonthCalendarHeaderComponent, selectors: [["dr-fiscal-month-calendar-header", 8, "component"]], features: [i0.ɵɵInheritDefinitionFeature], attrs: _c0$D, decls: 12, vars: 4, consts: [["class", "dr-datepicker__timeframe-select__wrapper", 4, "ngIf"], [1, "dr-date-paging"], [1, "dr-date-paging", "flip-page-button", 3, "click"], [1, "dr-icon-arrow-left", "presentation_buttons-navigate_input"], [1, "example-header-label"], [3, "click"], [1, "dr-icon-arrow-right", "presentation_buttons-navigate_input"], ["class", "dr-quarterly-datepicker", 4, "ngIf"], [1, "dr-datepicker__timeframe-select__wrapper"], ["class", "dr-datepicker-preset-date", 4, "ngIf"], ["class", "dr-datepicker__timeframe-select", "bindLabel", "title", "bindValue", "value", 3, "ngModel", "items", "ngModelChange", 4, "ngIf"], [1, "dr-datepicker-preset-date"], [1, "dr-datepicker-preset-date__tags", 3, "ngClass"], ["id", "preset_tag", "class", "dr-datepicker-preset-date__tags__tag", 3, "ngClass", "drTooltip", "drTooltipPosition", "click", 4, "ngFor", "ngForOf"], ["id", "preset_tag", 1, "dr-datepicker-preset-date__tags__tag", 3, "ngClass", "drTooltip", "drTooltipPosition", "click"], ["bindLabel", "title", "bindValue", "value", 1, "dr-datepicker__timeframe-select", 3, "ngModel", "items", "ngModelChange"], [1, "dr-quarterly-datepicker"], ["quarterlyDatePicker", ""], ["class", "quarter-selector", 3, "class", "quarter-selector--disabled", "quarter-selector--select-current-quarter", "click", 4, "ngFor", "ngForOf"], [1, "quarter-selector", 3, "click"]], template: function DrFiscalMonthCalendarHeaderComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, DrFiscalMonthCalendarHeaderComponent_div_0_Template, 3, 2, "div", 0);
             i0.ɵɵelementStart(1, "div", 1)(2, "div", 2);
             i0.ɵɵlistener("click", function DrFiscalMonthCalendarHeaderComponent_Template_div_click_2_listener() { return ctx.pagingClicked(false); });
@@ -5420,7 +5428,7 @@ function DrDatePickerWithTimeframeComponent_dr_button_11_Template(rf, ctx) { if
     const ctx_r4 = i0.ɵɵnextContext();
     i0.ɵɵproperty("disabled", ctx_r4.isNextDateDisabled);
 } }
-const _c0$B = function (a0) { return { formattedValue: a0 }; };
+const _c0$C = function (a0) { return { formattedValue: a0 }; };
 class DrDatePickerWithTimeframeComponent extends DrDatePickerComponent {
     set dateFormatConfig(value) {
         if (value) {
@@ -5609,7 +5617,7 @@ class DrDatePickerWithTimeframeComponent extends DrDatePickerComponent {
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("drTooltip", ctx.datepickerTooltip)("drTooltipPosition", ctx.datepickerTooltipPosition)("drTooltipMousleaveTimeout", ctx.datepickerTooltipTimeout);
             i0.ɵɵadvance(3);
-            i0.ɵɵproperty("ngTemplateOutlet", _r1)("ngTemplateOutletContext", i0.ɵɵpureFunction1(18, _c0$B, i0.ɵɵpipeBind1(5, 14, ctx.displayedFormattedValue$)));
+            i0.ɵɵproperty("ngTemplateOutlet", _r1)("ngTemplateOutletContext", i0.ɵɵpureFunction1(18, _c0$C, i0.ɵɵpipeBind1(5, 14, ctx.displayedFormattedValue$)));
             i0.ɵɵadvance(4);
             i0.ɵɵproperty("ngModel", i0.ɵɵpipeBind1(10, 16, ctx.displayValue$))("matDatepicker", _r5)("readonly", ctx.readonly)("min", ctx._min)("max", ctx._max);
             i0.ɵɵadvance(3);
@@ -5825,7 +5833,7 @@ function DrToggleComponent_span_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(1);
     i0.ɵɵtextInterpolate(ctx_r1.toggleTitle);
 } }
-const _c0$A = ["*"];
+const _c0$B = ["*"];
 class DrToggleComponent {
     set disabled(value) {
         this.setDisabledState(value);
@@ -5870,7 +5878,7 @@ class DrToggleComponent {
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrToggleComponent, selectors: [["dr-toggle"]], hostVars: 3, hostBindings: function DrToggleComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵattribute("id", ctx.hostId);
             i0.ɵɵclassMap(ctx.elementClass);
-        } }, inputs: { id: "id", toggleTitle: "toggleTitle", toggleTitleRight: "toggleTitleRight", successType: "successType", checkedStatus: "checkedStatus", disabled: "disabled" }, outputs: { checkedChange: "checkedChange" }, features: [i0.ɵɵProvidersFeature([{ provide: NG_VALUE_ACCESSOR, useExisting: DrToggleComponent, multi: true }])], ngContentSelectors: _c0$A, decls: 7, vars: 10, consts: [["class", "toggle-title mr-3", 4, "ngIf"], [1, "toggle-container"], ["type", "checkbox", 3, "checked", "disabled", "click"], [1, "toggle-body"], ["class", "toggle-title ml-3", 4, "ngIf"], [1, "toggle-title", "mr-3"], [1, "toggle-title", "ml-3"]], template: function DrToggleComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { id: "id", toggleTitle: "toggleTitle", toggleTitleRight: "toggleTitleRight", successType: "successType", checkedStatus: "checkedStatus", disabled: "disabled" }, outputs: { checkedChange: "checkedChange" }, features: [i0.ɵɵProvidersFeature([{ provide: NG_VALUE_ACCESSOR, useExisting: DrToggleComponent, multi: true }])], ngContentSelectors: _c0$B, decls: 7, vars: 10, consts: [["class", "toggle-title mr-3", 4, "ngIf"], [1, "toggle-container"], ["type", "checkbox", 3, "checked", "disabled", "click"], [1, "toggle-body"], ["class", "toggle-title ml-3", 4, "ngIf"], [1, "toggle-title", "mr-3"], [1, "toggle-title", "ml-3"]], template: function DrToggleComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵtemplate(0, DrToggleComponent_span_0_Template, 2, 1, "span", 0);
             i0.ɵɵelementStart(1, "label", 1)(2, "input", 2);
@@ -6487,7 +6495,7 @@ class DateTimePickerComponent {
             type: Input
         }] }); })();
 
-const _c0$z = ["stepTextLabel"];
+const _c0$A = ["stepTextLabel"];
 const _c1$f = ["stepper"];
 function StepperComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     const _r11 = i0.ɵɵgetCurrentView();
@@ -6718,7 +6726,7 @@ class StepperComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function StepperComponent_Factory(t) { return new (t || StepperComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: StepperComponent, selectors: [["dr-stepper"]], contentQueries: function StepperComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
-            i0.ɵɵcontentQuery(dirIndex, _c0$z, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c0$A, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.stepTextLabelTemplate = _t.first);
@@ -6893,7 +6901,7 @@ function DrChatFormComponent_dr_button_9_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(1, "Stop generating");
     i0.ɵɵelementEnd();
 } }
-const _c0$y = function (a0, a1) { return { "message-row__input--focused": a0, "message-row__input--filled": a1 }; };
+const _c0$z = function (a0, a1) { return { "message-row__input--focused": a0, "message-row__input--filled": a1 }; };
 class DrChatFormComponent {
     constructor(cdr, domSanitizer) {
         this.cdr = cdr;
@@ -7049,7 +7057,7 @@ class DrChatFormComponent {
             const _r1 = i0.ɵɵreference(4);
             i0.ɵɵproperty("ngIf", ctx.droppedFiles == null ? null : ctx.droppedFiles.length);
             i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(11, _c0$y, ctx.inputFocus, !!(ctx.message == null ? null : ctx.message.length)));
+            i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(11, _c0$z, ctx.inputFocus, !!(ctx.message == null ? null : ctx.message.length)));
             i0.ɵɵadvance(1);
             i0.ɵɵstyleMap(ctx.getTextAreaHeight(_r1));
             i0.ɵɵpropertyInterpolate("placeholder", ctx.fileOver ? ctx.dropFilePlaceholder : ctx.messagePlaceholder);
@@ -7164,7 +7172,7 @@ function DrAvatarComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵstyleProp("width", ctx_r0.drAvatarSize || null)("height", ctx_r0.drAvatarSize || null);
 } }
-const _c0$x = function (a0, a1) { return { "users-section__default": a0, "users-section__user--clickable": a1 }; };
+const _c0$y = function (a0, a1) { return { "users-section__default": a0, "users-section__user--clickable": a1 }; };
 function DrAvatarComponent_div_1_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 5);
@@ -7178,7 +7186,7 @@ function DrAvatarComponent_div_1_Template(rf, ctx) { if (rf & 1) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵclassMap(user_r5.status);
     i0.ɵɵstyleProp("width", ctx_r1.drAvatarSize || null)("height", ctx_r1.drAvatarSize || null)("background-color", ctx_r1.getAvatarColor(user_r5));
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(18, _c0$x, ctx_r1.showUnassigned && !user_r5.email, ctx_r1.drAvatarIsClickable))("drTooltip", i0.ɵɵpipeBind1(1, 13, user_r5))("drTooltipClass", ctx_r1.drAvatarTooltipClass)("drTooltipPosition", ctx_r1.drAvatarTooltipPosition);
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(18, _c0$y, ctx_r1.showUnassigned && !user_r5.email, ctx_r1.drAvatarIsClickable))("drTooltip", i0.ɵɵpipeBind1(1, 13, user_r5))("drTooltipClass", ctx_r1.drAvatarTooltipClass)("drTooltipPosition", ctx_r1.drAvatarTooltipPosition);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(3, 15, user_r5, "initials"), "\n");
 } }
@@ -7454,7 +7462,7 @@ class DrChatMessageFileComponent {
             type: Input
         }] }); })();
 
-const _c0$w = ["drChatMessageActions"];
+const _c0$x = ["drChatMessageActions"];
 function DrChatMessageComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵelement(1, "div", 8);
@@ -7556,7 +7564,7 @@ class DrChatMessageComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrChatMessageComponent_Factory(t) { return new (t || DrChatMessageComponent)(i0.ɵɵdirectiveInject(DrChatCustomMessageService)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrChatMessageComponent, selectors: [["dr-chat-message"]], contentQueries: function DrChatMessageComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
-            i0.ɵɵcontentQuery(dirIndex, _c0$w, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c0$x, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.drChatMessageActions = _t.first);
@@ -7627,7 +7635,7 @@ class DrChatMessageComponent {
             args: ['drChatMessageActions']
         }] }); })();
 
-const _c0$v = ["suggestionsContainer"];
+const _c0$w = ["suggestionsContainer"];
 function DrChatSuggestionsComponent_ng_container_2_div_1_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0);
 } }
@@ -7772,7 +7780,7 @@ class DrChatSuggestionsComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrChatSuggestionsComponent_Factory(t) { return new (t || DrChatSuggestionsComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrChatSuggestionsComponent, selectors: [["dr-chat-suggestions"]], viewQuery: function DrChatSuggestionsComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$v, 5);
+            i0.ɵɵviewQuery(_c0$w, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.suggestionContainer = _t.first);
@@ -7806,7 +7814,7 @@ class DrChatSuggestionsComponent {
             args: ['suggestionsContainer', { static: false }]
         }] }); })();
 
-const _c0$u = ["drChatHeader"];
+const _c0$v = ["drChatHeader"];
 const _c1$d = ["drChatLoader"];
 const _c2$6 = ["drChatContent"];
 const _c3$4 = ["messagesContainer"];
@@ -7943,7 +7951,7 @@ class DrChatComponent {
     /** @nocollapse */ static { this.ɵfac = function DrChatComponent_Factory(t) { return new (t || DrChatComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrChatComponent, selectors: [["dr-chat"]], contentQueries: function DrChatComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
             i0.ɵɵcontentQuery(dirIndex, DrChatFormComponent, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c0$u, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c0$v, 5);
             i0.ɵɵcontentQuery(dirIndex, _c1$d, 5);
             i0.ɵɵcontentQuery(dirIndex, _c2$6, 5);
             i0.ɵɵcontentQuery(dirIndex, DrChatMessageComponent, 4);
@@ -8032,7 +8040,7 @@ class DrChatComponent {
             args: [DrChatSuggestionsComponent]
         }] }); })();
 
-const _c0$t = ["textAreaElement"];
+const _c0$u = ["textAreaElement"];
 const _c1$c = ["fileInput"];
 function DrChatFormDropdownComponent_dr_chat_dropped_files_3_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
@@ -8265,7 +8273,7 @@ class DrChatFormDropdownComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrChatFormDropdownComponent_Factory(t) { return new (t || DrChatFormDropdownComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1$5.DomSanitizer)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrChatFormDropdownComponent, selectors: [["dr-chat-form-dropdown"]], viewQuery: function DrChatFormDropdownComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$t, 5);
+            i0.ɵɵviewQuery(_c0$u, 5);
             i0.ɵɵviewQuery(_c1$c, 5);
         } if (rf & 2) {
             let _t;
@@ -8414,14 +8422,14 @@ class DrChatCustomMessageDirective {
             type: Input
         }] }); })();
 
-const _c0$s = ["*"];
+const _c0$t = ["*"];
 class DrChatAlertComponent {
     constructor() {
         this.iconClass = 'dr-icon-info';
         this.close = new EventEmitter();
     }
     /** @nocollapse */ static { this.ɵfac = function DrChatAlertComponent_Factory(t) { return new (t || DrChatAlertComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrChatAlertComponent, selectors: [["dr-chat-alert"]], inputs: { iconClass: "iconClass" }, outputs: { close: "close" }, ngContentSelectors: _c0$s, decls: 3, vars: 2, consts: [["theme", "icon", "icon", "dr-icon-exit", "drTooltip", "Close", 1, "chat-alert-close-btn", 3, "click"]], template: function DrChatAlertComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrChatAlertComponent, selectors: [["dr-chat-alert"]], inputs: { iconClass: "iconClass" }, outputs: { close: "close" }, ngContentSelectors: _c0$t, decls: 3, vars: 2, consts: [["theme", "icon", "icon", "dr-icon-exit", "drTooltip", "Close", 1, "chat-alert-close-btn", 3, "click"]], template: function DrChatAlertComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelement(0, "i");
             i0.ɵɵprojection(1);
@@ -8518,7 +8526,7 @@ function DrAlertComponent_span_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(1);
     i0.ɵɵtextInterpolate(ctx_r0.text);
 } }
-const _c0$r = ["*"];
+const _c0$s = ["*"];
 const ALERT_THEME_ICONS = {
     [DrAlertTheme.SUCCESS]: 'dr-icon-uploaded-success',
     [DrAlertTheme.BOLD_ERROR]: 'dr-icon-error',
@@ -8539,7 +8547,7 @@ class DrAlertComponent {
     /** @nocollapse */ static { this.ɵfac = function DrAlertComponent_Factory(t) { return new (t || DrAlertComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrAlertComponent, selectors: [["dr-alert"]], hostVars: 2, hostBindings: function DrAlertComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassMap(ctx.elementClass);
-        } }, inputs: { theme: "theme", customIconClass: "customIconClass", text: "text" }, ngContentSelectors: _c0$r, decls: 6, vars: 3, consts: [[1, "dr-alert__content-wrapper"], ["class", "dr-alert__text", 4, "ngIf"], [1, "dr-alert__custom-content"], ["contentRef", ""], [1, "dr-alert__text"]], template: function DrAlertComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { theme: "theme", customIconClass: "customIconClass", text: "text" }, ngContentSelectors: _c0$s, decls: 6, vars: 3, consts: [[1, "dr-alert__content-wrapper"], ["class", "dr-alert__text", 4, "ngIf"], [1, "dr-alert__custom-content"], ["contentRef", ""], [1, "dr-alert__text"]], template: function DrAlertComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵelement(1, "i");
@@ -8585,7 +8593,7 @@ class CodeEditorHintWrapperComponent {
             }]
     }], null, null); })();
 
-const _c0$q = ["ref"];
+const _c0$r = ["ref"];
 class DrCodemirrorComponent {
     set options(value) {
         this._options = value;
@@ -8715,7 +8723,7 @@ class DrCodemirrorComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrCodemirrorComponent_Factory(t) { return new (t || DrCodemirrorComponent)(i0.ɵɵdirectiveInject(i0.KeyValueDiffers), i0.ɵɵdirectiveInject(i0.NgZone)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrCodemirrorComponent, selectors: [["dr-codemirror"]], viewQuery: function DrCodemirrorComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$q, 5);
+            i0.ɵɵviewQuery(_c0$r, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.ref = _t.first);
@@ -8867,7 +8875,7 @@ class DrErrorComponent {
             args: ['class.no-icon']
         }] }); })();
 
-const _c0$p = ["codeEditor"];
+const _c0$q = ["codeEditor"];
 function DrCodeEditorComponent_span_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 4);
     i0.ɵɵtext(1);
@@ -9146,7 +9154,7 @@ class DrCodeEditorComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrCodeEditorComponent_Factory(t) { return new (t || DrCodeEditorComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ComponentFactoryResolver), i0.ɵɵdirectiveInject(i0.Injector)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrCodeEditorComponent, selectors: [["dr-code-editor"]], viewQuery: function DrCodeEditorComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$p, 5);
+            i0.ɵɵviewQuery(_c0$q, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.codeEditor = _t.first);
@@ -9914,7 +9922,7 @@ const getAlignmentDimension = (position) => {
     return DrPopoverAlignmentDimension.Width;
 };
 
-const _c0$o = ["popoverContainer"];
+const _c0$p = ["popoverContainer"];
 function DrPopoverComponent_ng_container_2_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0);
 } }
@@ -10004,7 +10012,7 @@ class DrPopoverComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrPopoverComponent_Factory(t) { return new (t || DrPopoverComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ViewContainerRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(DrPopoverRef)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrPopoverComponent, selectors: [["dr-popover"]], viewQuery: function DrPopoverComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$o, 7, ElementRef);
+            i0.ɵɵviewQuery(_c0$p, 7, ElementRef);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.popoverContainer = _t.first);
@@ -10327,7 +10335,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
-const _c0$n = ["menuContainer"];
+const _c0$o = ["menuContainer"];
 function DrDropdownComponent_dr_dropdown_item_4_ng_container_1_i_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "i", 11);
 } if (rf & 2) {
@@ -10558,7 +10566,7 @@ class DrDropdownComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrDropdownComponent_Factory(t) { return new (t || DrDropdownComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrDropdownComponent, selectors: [["dr-dropdown"]], viewQuery: function DrDropdownComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$n, 7);
+            i0.ɵɵviewQuery(_c0$o, 7);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.menuContainer = _t.first);
@@ -10797,7 +10805,7 @@ class DrDropdownChildDirective {
             }]
     }], null, null); })();
 
-const _c0$m = [[["", "dropdownItemContent", ""]], [["", "dropdownItemActions", ""]]];
+const _c0$n = [[["", "dropdownItemContent", ""]], [["", "dropdownItemActions", ""]]];
 const _c1$a = ["[dropdownItemContent]", "[dropdownItemActions]"];
 class DrDropdownItemComponent {
     constructor() {
@@ -10807,7 +10815,7 @@ class DrDropdownItemComponent {
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrDropdownItemComponent, selectors: [["dr-dropdown-item"]], hostVars: 1, hostBindings: function DrDropdownItemComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵattribute("role", ctx.role);
         } }, inputs: { selected: "selected", disabled: "disabled", divider: "divider" }, ngContentSelectors: _c1$a, decls: 5, vars: 6, consts: [[1, "dr-dropdown-item"], [1, "dr-dropdown-text"], [1, "dr-dropdown-actions"]], template: function DrDropdownItemComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵprojectionDef(_c0$m);
+            i0.ɵɵprojectionDef(_c0$n);
             i0.ɵɵelementStart(0, "div", 0)(1, "span", 1);
             i0.ɵɵprojection(2);
             i0.ɵɵelementEnd();
@@ -10849,7 +10857,7 @@ class DrDropdownItemShowPipe {
 function DrTabComponent_ng_template_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵprojection(0);
 } }
-const _c0$l = ["*"];
+const _c0$m = ["*"];
 class DrTabComponent {
     constructor() { }
     ngOnInit() { }
@@ -10859,7 +10867,7 @@ class DrTabComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.contentTemplate = _t.first);
-        } }, inputs: { id: "id", label: "label", icon: "icon", disabled: "disabled", tooltip: "tooltip", customLabelTemplate: "customLabelTemplate" }, ngContentSelectors: _c0$l, decls: 1, vars: 0, template: function DrTabComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { id: "id", label: "label", icon: "icon", disabled: "disabled", tooltip: "tooltip", customLabelTemplate: "customLabelTemplate" }, ngContentSelectors: _c0$m, decls: 1, vars: 0, template: function DrTabComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵtemplate(0, DrTabComponent_ng_template_0_Template, 1, 0, "ng-template");
         } }, encapsulation: 2 }); }
@@ -11134,7 +11142,7 @@ class DrTabsComponent {
             args: [DrTabComponent]
         }] }); })();
 
-const _c0$k = [[["dr-accordion-item"]]];
+const _c0$l = [[["dr-accordion-item"]]];
 const _c1$9 = ["dr-accordion-item"];
 class DrAccordionComponent {
     constructor() {
@@ -11169,7 +11177,7 @@ class DrAccordionComponent {
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrAccordionComponent, selectors: [["dr-accordion"]], hostVars: 2, hostBindings: function DrAccordionComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassMap(ctx.theme);
         } }, inputs: { multi: "multi", theme: "theme" }, ngContentSelectors: _c1$9, decls: 1, vars: 0, template: function DrAccordionComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵprojectionDef(_c0$k);
+            i0.ɵɵprojectionDef(_c0$l);
             i0.ɵɵprojection(0);
         } }, styles: ["[_nghost-%COMP%]{display:block;box-shadow:#2c33491a 0 5px 10px}.borderless[_nghost-%COMP%]{box-shadow:none}"], changeDetection: 0 }); }
 }
@@ -11186,7 +11194,7 @@ class DrAccordionComponent {
             args: ['class']
         }] }); })();
 
-const _c0$j = [[["dr-accordion-item-header"]], [["dr-accordion-item-body"]]];
+const _c0$k = [[["dr-accordion-item-header"]], [["dr-accordion-item-body"]]];
 const _c1$8 = ["dr-accordion-item-header", "dr-accordion-item-body"];
 class DrAccordionItemComponent {
     /**
@@ -11288,7 +11296,7 @@ class DrAccordionItemComponent {
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrAccordionItemComponent, selectors: [["dr-accordion-item"]], hostVars: 6, hostBindings: function DrAccordionItemComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassProp("collapsed", ctx.collapsed)("expanded", ctx.expanded)("disabled", ctx.disabled);
         } }, inputs: { collapsed: "collapsed", expanded: "expanded", disabled: "disabled" }, outputs: { collapsedChange: "collapsedChange" }, features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c1$8, decls: 2, vars: 0, template: function DrAccordionItemComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵprojectionDef(_c0$j);
+            i0.ɵɵprojectionDef(_c0$k);
             i0.ɵɵprojection(0);
             i0.ɵɵprojection(1, 1);
         } }, styles: ["[_nghost-%COMP%]{background-color:#fff;color:#222b45;font-family:Poppins,sans-serif;font-size:16px;font-weight:400;line-height:1.25rem;display:flex;flex-direction:column}"], changeDetection: 0 }); }
@@ -11330,7 +11338,7 @@ function DrAccordionItemHeaderComponent_i_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵclassMap("dr-accordion-item-header-icon " + ctx_r0.icon);
     i0.ɵɵclassProp("dr-accordion-item-header-icon--additional-padding", ctx_r0.chevronPosition === "left");
 } }
-const _c0$i = function (a0) { return { rotationDegree: a0 }; };
+const _c0$j = function (a0) { return { rotationDegree: a0 }; };
 const _c1$7 = function (a0, a1) { return { value: a0, params: a1 }; };
 function DrAccordionItemHeaderComponent_i_1_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
@@ -11340,7 +11348,7 @@ function DrAccordionItemHeaderComponent_i_1_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵclassMap(ctx_r1.chevronIconClass);
-    i0.ɵɵproperty("@expansionIndicator", i0.ɵɵpureFunction2(5, _c1$7, ctx_r1.state, i0.ɵɵpureFunction1(3, _c0$i, ctx_r1.chevronRotationDegree)));
+    i0.ɵɵproperty("@expansionIndicator", i0.ɵɵpureFunction2(5, _c1$7, ctx_r1.state, i0.ɵɵpureFunction1(3, _c0$j, ctx_r1.chevronRotationDegree)));
 } }
 const _c2$3 = [[["dr-accordion-item-title"]], [["dr-accordion-item-description"]], "*"];
 const _c3$1 = ["dr-accordion-item-title", "dr-accordion-item-description", "*"];
@@ -11469,7 +11477,7 @@ class DrAccordionItemHeaderComponent {
             args: ['keydown.enter']
         }] }); })();
 
-const _c0$h = function (a0) { return { value: a0 }; };
+const _c0$i = function (a0) { return { value: a0 }; };
 const _c1$6 = ["*"];
 const accordionItemBodyTrigger = trigger('accordionItemBody', [
     state('collapsed', style({
@@ -11507,7 +11515,7 @@ class DrAccordionItemBodyComponent {
             i0.ɵɵprojection(2);
             i0.ɵɵelementEnd()();
         } if (rf & 2) {
-            i0.ɵɵproperty("@accordionItemBody", i0.ɵɵpureFunction1(1, _c0$h, ctx.state));
+            i0.ɵɵproperty("@accordionItemBody", i0.ɵɵpureFunction1(1, _c0$i, ctx.state));
         } }, styles: [".item-body[_ngcontent-%COMP%]{flex:1;-ms-flex:1 1 auto;overflow:auto;position:relative}"], data: { animation: [accordionItemBodyTrigger] }, changeDetection: 0 }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrAccordionItemBodyComponent, [{
@@ -11523,13 +11531,13 @@ class DrAccordionItemBodyComponent {
                 type: Host
             }] }, { type: i0.ChangeDetectorRef }]; }, null); })();
 
-const _c0$g = [[["dr-layout-header"]], [["dr-layout-body"]]];
+const _c0$h = [[["dr-layout-header"]], [["dr-layout-body"]]];
 const _c1$5 = ["dr-layout-header", "dr-layout-body"];
 class DrLayoutComponent {
     constructor() { }
     /** @nocollapse */ static { this.ɵfac = function DrLayoutComponent_Factory(t) { return new (t || DrLayoutComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutComponent, selectors: [["dr-layout"]], ngContentSelectors: _c1$5, decls: 6, vars: 0, consts: [[1, "dr-layout"], [1, "dr-layout__container"], [1, "content"], [1, "columns"]], template: function DrLayoutComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵprojectionDef(_c0$g);
+            i0.ɵɵprojectionDef(_c0$h);
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵprojection(1);
             i0.ɵɵelementStart(2, "div", 1)(3, "div", 2)(4, "div", 3);
@@ -11542,11 +11550,11 @@ class DrLayoutComponent {
         args: [{ selector: 'dr-layout', template: "<div class=\"dr-layout\">\n    <ng-content select=\"dr-layout-header\"></ng-content>\n    <div class=\"dr-layout__container\">\n        <div class=\"content\">\n            <div class=\"columns\">\n                <ng-content select=\"dr-layout-body\"></ng-content>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [":host{font-size:16px;font-weight:400;font-family:Poppins,sans-serif;line-height:1.25rem;-webkit-font-smoothing:antialiased}:host .dr-layout{display:flex;flex-direction:column;min-height:100vh;font-size:16px;font-weight:400;line-height:1.4rem}:host .dr-layout ::ng-deep dr-layout-header{display:block;position:fixed;top:0;left:0;right:0;z-index:1040}:host .dr-layout ::ng-deep dr-layout-header nav{align-items:center;justify-content:flex-start;display:flex}:host .dr-layout__container{display:flex;flex:1;-ms-flex:1 1 auto;flex-direction:row}:host .dr-layout__container .content{display:flex;flex:1;-ms-flex:1 1 auto;flex-direction:column;min-width:0}:host .dr-layout__container .content .columns{display:flex;flex:1;-ms-flex:1 1 auto;flex-direction:row;width:100%}:host .dr-layout__container .content .columns ::ng-deep dr-layout-body{flex:1 0;min-width:0}\n"] }]
     }], function () { return []; }, null); })();
 
-const _c0$f = ["*"];
+const _c0$g = ["*"];
 class DrLayoutHeaderComponent {
     constructor() { }
     /** @nocollapse */ static { this.ɵfac = function DrLayoutHeaderComponent_Factory(t) { return new (t || DrLayoutHeaderComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutHeaderComponent, selectors: [["dr-layout-header"]], ngContentSelectors: _c0$f, decls: 2, vars: 0, template: function DrLayoutHeaderComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutHeaderComponent, selectors: [["dr-layout-header"]], ngContentSelectors: _c0$g, decls: 2, vars: 0, template: function DrLayoutHeaderComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "nav");
             i0.ɵɵprojection(1);
@@ -11565,11 +11573,11 @@ class DrLayoutHeaderComponent {
             }]
     }], function () { return []; }, null); })();
 
-const _c0$e = ["*"];
+const _c0$f = ["*"];
 class DrLayoutBodyComponent {
     constructor() { }
     /** @nocollapse */ static { this.ɵfac = function DrLayoutBodyComponent_Factory(t) { return new (t || DrLayoutBodyComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutBodyComponent, selectors: [["dr-layout-body"]], ngContentSelectors: _c0$e, decls: 1, vars: 0, template: function DrLayoutBodyComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutBodyComponent, selectors: [["dr-layout-body"]], ngContentSelectors: _c0$f, decls: 1, vars: 0, template: function DrLayoutBodyComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵprojection(0);
         } }, encapsulation: 2 }); }
@@ -11591,7 +11599,7 @@ function DrDetailsListComponent_li_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(1);
     i0.ɵɵtextInterpolate(item_r1);
 } }
-const _c0$d = function (a0) { return { value: a0 }; };
+const _c0$e = function (a0) { return { value: a0 }; };
 class DrDetailsListComponent {
     set items(val) {
         if (!val) {
@@ -11638,7 +11646,7 @@ class DrDetailsListComponent {
             i0.ɵɵadvance(1);
             i0.ɵɵtextInterpolate1(" ", ctx.title, " ");
             i0.ɵɵadvance(1);
-            i0.ɵɵproperty("@expansionIndicatorList", i0.ɵɵpureFunction1(7, _c0$d, ctx.state));
+            i0.ɵɵproperty("@expansionIndicatorList", i0.ɵɵpureFunction1(7, _c0$e, ctx.state));
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngForOf", ctx.list);
         } }, dependencies: [i1.NgForOf], styles: ["[_nghost-%COMP%]{font-family:Poppins,sans-serif;font-size:14px;line-height:22px;color:#6d6e6f;font-weight:400}[_nghost-%COMP%]   .details[_ngcontent-%COMP%]{display:flex;flex-direction:column}[_nghost-%COMP%]   .details__header[_ngcontent-%COMP%]{display:flex;align-items:center;cursor:pointer}[_nghost-%COMP%]   .details__header[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]{margin-right:4px}[_nghost-%COMP%]   .details__list[_ngcontent-%COMP%]{display:flex;flex-direction:column;padding-left:28px;margin:8px 0}[_nghost-%COMP%]   .details__list[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{list-style-type:disc}"], data: { animation: [
@@ -11682,7 +11690,7 @@ class DrDetailsListComponent {
             type: Input
         }] }); })();
 
-const _c0$c = ["content"];
+const _c0$d = ["content"];
 const _c1$4 = function (a0, a1) { return { "dr-icon-maximize": a0, "dr-icon-minimize": a1 }; };
 function DialogWrapperComponent_i_1_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
@@ -11877,7 +11885,7 @@ class DialogWrapperComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DialogWrapperComponent_Factory(t) { return new (t || DialogWrapperComponent)(i0.ɵɵdirectiveInject(i1$6.MatLegacyDialogRef), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i0.ComponentFactoryResolver), i0.ɵɵdirectiveInject(MAT_LEGACY_DIALOG_DATA)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DialogWrapperComponent, selectors: [["dr-dialog-wrapper"]], viewQuery: function DialogWrapperComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$c, 5, ViewContainerRef);
+            i0.ɵɵviewQuery(_c0$d, 5, ViewContainerRef);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.content = _t.first);
@@ -12080,7 +12088,7 @@ function DialogModalWrapperComponent_form_7_div_2_label_9_Template(rf, ctx) { if
     i0.ɵɵadvance(1);
     i0.ɵɵtextInterpolate1(" ", ctx_r19.dialogData.serverErrorMessage, " ");
 } }
-const _c0$b = function (a0) { return { display: a0 }; };
+const _c0$c = function (a0) { return { display: a0 }; };
 const _c1$3 = function (a0, a1) { return { "col-md-10": a0, "col-md-12": a1 }; };
 function DialogModalWrapperComponent_form_7_div_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 16);
@@ -12098,7 +12106,7 @@ function DialogModalWrapperComponent_form_7_div_2_Template(rf, ctx) { if (rf & 1
     const field_r11 = ctx.$implicit;
     const ctx_r10 = i0.ɵɵnextContext(2);
     i0.ɵɵclassMap(field_r11.formGroupClass);
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(12, _c0$b, field_r11.isLabelFullWidth ? "block" : "flex"));
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(12, _c0$c, field_r11.isLabelFullWidth ? "block" : "flex"));
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngIf", field_r11.label && field_r11.type !== ctx_r10.dialogFieldType.CHECKBOX);
     i0.ɵɵadvance(1);
@@ -12806,7 +12814,7 @@ function TreeviewItemComponent_div_0_div_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngForOf", ctx_r2.item.children);
 } }
-const _c0$a = function (a0, a1, a2) { return { item: a0, onCollapseExpand: a1, onCheckedChange: a2 }; };
+const _c0$b = function (a0, a1, a2) { return { item: a0, onCollapseExpand: a1, onCheckedChange: a2 }; };
 function TreeviewItemComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 1);
     i0.ɵɵtemplate(1, TreeviewItemComponent_div_0_ng_template_1_Template, 0, 0, "ng-template", 2);
@@ -12815,7 +12823,7 @@ function TreeviewItemComponent_div_0_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.template)("ngTemplateOutletContext", i0.ɵɵpureFunction3(3, _c0$a, ctx_r0.item, ctx_r0.onCollapseExpand, ctx_r0.onCheckedChange));
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.template)("ngTemplateOutletContext", i0.ɵɵpureFunction3(3, _c0$b, ctx_r0.item, ctx_r0.onCollapseExpand, ctx_r0.onCheckedChange));
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngIf", !ctx_r0.item.collapsed);
 } }
@@ -13399,12 +13407,6 @@ var TooltipInfoIconTheme;
     TooltipInfoIconTheme["SUCCESS"] = "success";
 })(TooltipInfoIconTheme || (TooltipInfoIconTheme = {}));
 
-var EmojiPickerMode;
-(function (EmojiPickerMode) {
-    EmojiPickerMode["BUTTON"] = "button";
-    EmojiPickerMode["FLAT"] = "flat";
-})(EmojiPickerMode || (EmojiPickerMode = {}));
-
 class ClickOutsideDirective {
     constructor(_document /*: HTMLDocument*/, _el) {
         this._document = _document;
@@ -13731,32 +13733,6 @@ class DrToastrService {
             }]
     }], function () { return [{ type: i1$7.ToastrService }]; }, null); })();
 
-class EmojiDataService {
-    constructor() {
-        this.emojiService = new EmojiService();
-    }
-    getEmojiPickerSet() {
-        const emojiSet = {};
-        const allEmojis = this.emojiService.emojis;
-        allEmojis.forEach((emoji) => {
-            if (emoji.shortName && emoji.native) {
-                emojiSet[emoji.shortName] = {
-                    emoji: emoji.native,
-                };
-            }
-        });
-        return emojiSet;
-    }
-    /** @nocollapse */ static { this.ɵfac = function EmojiDataService_Factory(t) { return new (t || EmojiDataService)(); }; }
-    /** @nocollapse */ static { this.ɵprov = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjectable({ token: EmojiDataService, factory: EmojiDataService.ɵfac, providedIn: 'root' }); }
-}
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(EmojiDataService, [{
-        type: Injectable,
-        args: [{
-                providedIn: 'root',
-            }]
-    }], function () { return []; }, null); })();
-
 const components$1 = [
     DateTagComponent,
     DayTagComponent,
@@ -14004,7 +13980,7 @@ class DrImageCropperCanvasService {
         type: Injectable
     }], null, null); })();
 
-const _c0$9 = ["imageCanvas"];
+const _c0$a = ["imageCanvas"];
 class DrImageCropperComponent {
     constructor(canvasService) {
         this.canvasService = canvasService;
@@ -14062,7 +14038,7 @@ class DrImageCropperComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrImageCropperComponent_Factory(t) { return new (t || DrImageCropperComponent)(i0.ɵɵdirectiveInject(DrImageCropperCanvasService)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrImageCropperComponent, selectors: [["dr-image-cropper"]], viewQuery: function DrImageCropperComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$9, 7);
+            i0.ɵɵviewQuery(_c0$a, 7);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.canvasElement = _t.first);
@@ -14432,78 +14408,6 @@ class TreeviewModule {
     }], null, null); })();
 (function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(TreeviewModule, { declarations: [TreeviewComponent, TreeviewItemComponent, TreeviewPipe], imports: [FormsModule, CommonModule], exports: [TreeviewComponent, TreeviewPipe] }); })();
 
-function EmojiPickerComponent_ng_container_0_ng_template_4_ng_container_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0);
-} }
-function EmojiPickerComponent_ng_container_0_ng_template_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 5);
-    i0.ɵɵtemplate(1, EmojiPickerComponent_ng_container_0_ng_template_4_ng_container_1_Template, 1, 0, "ng-container", 6);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    i0.ɵɵnextContext(2);
-    const _r1 = i0.ɵɵreference(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", _r1);
-} }
-function EmojiPickerComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "dr-button", 2, 3);
-    i0.ɵɵlistener("click", function EmojiPickerComponent_ng_container_0_Template_dr_button_click_1_listener() { i0.ɵɵrestoreView(_r8); const ctx_r7 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r7.toggleEmojiPicker()); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(4, EmojiPickerComponent_ng_container_0_ng_template_4_Template, 2, 1, "ng-template", 4);
-    i0.ɵɵlistener("backdropClick", function EmojiPickerComponent_ng_container_0_Template_ng_template_backdropClick_4_listener() { i0.ɵɵrestoreView(_r8); const ctx_r9 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r9.closeEmojiPicker()); });
-    i0.ɵɵelementContainerEnd();
-} if (rf & 2) {
-    const _r4 = i0.ɵɵreference(3);
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(4);
-    i0.ɵɵproperty("cdkConnectedOverlayOrigin", _r4)("cdkConnectedOverlayOpen", ctx_r0.emojisOpened)("cdkConnectedOverlayHasBackdrop", true)("cdkConnectedOverlayBackdropClass", "emoji-modal-backdrop");
-} }
-function EmojiPickerComponent_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "emoji-mart", 7);
-    i0.ɵɵlistener("emojiSelect", function EmojiPickerComponent_ng_template_1_Template_emoji_mart_emojiSelect_0_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r10 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r10.onEmojiSelected($event)); });
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    i0.ɵɵproperty("darkMode", false);
-} }
-class EmojiPickerComponent {
-    constructor() {
-        this.mode = EmojiPickerMode.BUTTON;
-        this.emojiSelected = new EventEmitter();
-        this.emojisOpened = false;
-        this.EmojiPickerMode = EmojiPickerMode;
-    }
-    toggleEmojiPicker() {
-        this.emojisOpened = !this.emojisOpened;
-    }
-    closeEmojiPicker() {
-        this.emojisOpened = false;
-    }
-    onEmojiSelected(event) {
-        const emojiReaction = { id: event.emoji.id, emoji: event.emoji.native };
-        this.emojiSelected.emit(emojiReaction);
-        this.closeEmojiPicker();
-    }
-    /** @nocollapse */ static { this.ɵfac = function EmojiPickerComponent_Factory(t) { return new (t || EmojiPickerComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: EmojiPickerComponent, selectors: [["dr-emoji-picker"]], inputs: { mode: "mode" }, outputs: { emojiSelected: "emojiSelected" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 3, vars: 2, consts: [[4, "ngIf", "ngIfElse"], ["flatTpl", ""], ["theme", "icon", "icon", "dr-icon-emoji-smiley", "cdkOverlayOrigin", "", 3, "click"], ["emojiButton", "", "trigger", "cdkOverlayOrigin"], ["cdkConnectedOverlay", "", 3, "cdkConnectedOverlayOrigin", "cdkConnectedOverlayOpen", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayBackdropClass", "backdropClick"], [1, "emoji-picker-popup"], [4, "ngTemplateOutlet"], ["emoji", "thumbsup", "color", "#0D99FF", 1, "emoji-picker-section", 3, "darkMode", "emojiSelect"]], template: function EmojiPickerComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, EmojiPickerComponent_ng_container_0_Template, 5, 4, "ng-container", 0);
-            i0.ɵɵtemplate(1, EmojiPickerComponent_ng_template_1_Template, 1, 1, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
-        } if (rf & 2) {
-            const _r1 = i0.ɵɵreference(2);
-            i0.ɵɵproperty("ngIf", ctx.mode === ctx.EmojiPickerMode.BUTTON)("ngIfElse", _r1);
-        } }, dependencies: [DrButtonComponent, PickerComponent, CdkOverlayOrigin, CdkConnectedOverlay, NgIf, NgTemplateOutlet], styles: [".emoji-picker-popup[_ngcontent-%COMP%]{position:relative;overflow:hidden;margin-top:8px;z-index:1000;box-shadow:0 2px 36px #00000026;border-radius:12px}.emoji-picker-popup[_ngcontent-%COMP%]   .emoji-picker-section[_ngcontent-%COMP%]{display:block}.emoji-picker-popup[_ngcontent-%COMP%]   .emoji-picker-section[_ngcontent-%COMP%]     section.emoji-mart{border-color:transparent}"], changeDetection: 0 }); }
-}
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(EmojiPickerComponent, [{
-        type: Component,
-        args: [{ selector: 'dr-emoji-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [DrButtonComponent, PickerComponent, CdkOverlayOrigin, CdkConnectedOverlay, NgIf, NgTemplateOutlet], template: "<ng-container *ngIf=\"mode === EmojiPickerMode.BUTTON; else flatTpl\">\n    <dr-button\n        #emojiButton\n        theme=\"icon\"\n        icon=\"dr-icon-emoji-smiley\"\n        cdkOverlayOrigin\n        #trigger=\"cdkOverlayOrigin\"\n        (click)=\"toggleEmojiPicker()\"></dr-button>\n    <ng-template\n        cdkConnectedOverlay\n        [cdkConnectedOverlayOrigin]=\"trigger\"\n        [cdkConnectedOverlayOpen]=\"emojisOpened\"\n        [cdkConnectedOverlayHasBackdrop]=\"true\"\n        [cdkConnectedOverlayBackdropClass]=\"'emoji-modal-backdrop'\"\n        (backdropClick)=\"closeEmojiPicker()\">\n        <div class=\"emoji-picker-popup\">\n            <ng-container *ngTemplateOutlet=\"flatTpl\"></ng-container>\n        </div>\n    </ng-template>\n</ng-container>\n\n<ng-template #flatTpl>\n    <!-- See details here: https://github.com/scttcper/ngx-emoji-mart -->\n    <emoji-mart\n        emoji=\"thumbsup\"\n        color=\"#0D99FF\"\n        [darkMode]=\"false\"\n        (emojiSelect)=\"onEmojiSelected($event)\"\n        class=\"emoji-picker-section\"></emoji-mart>\n</ng-template>\n", styles: [".emoji-picker-popup{position:relative;overflow:hidden;margin-top:8px;z-index:1000;box-shadow:0 2px 36px #00000026;border-radius:12px}.emoji-picker-popup .emoji-picker-section{display:block}.emoji-picker-popup .emoji-picker-section ::ng-deep section.emoji-mart{border-color:transparent}\n"] }]
-    }], null, { mode: [{
-            type: Input
-        }], emojiSelected: [{
-            type: Output
-        }] }); })();
-
 class DrAlertModule {
     /** @nocollapse */ static { this.ɵfac = function DrAlertModule_Factory(t) { return new (t || DrAlertModule)(); }; }
     /** @nocollapse */ static { this.ɵmod = /** @pureOrBreakMyCode */ i0.ɵɵdefineNgModule({ type: DrAlertModule }); }
@@ -14577,13 +14481,13 @@ function DrChipComponent_i_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵlistener("click", function DrChipComponent_i_4_Template_i_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.remove.next(null)); });
     i0.ɵɵelementEnd();
 } }
-const _c0$8 = ["*"];
+const _c0$9 = ["*"];
 class DrChipComponent {
     constructor() {
         this.remove = new EventEmitter();
     }
     /** @nocollapse */ static { this.ɵfac = function DrChipComponent_Factory(t) { return new (t || DrChipComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrChipComponent, selectors: [["dr-chip"]], inputs: { label: "label", icon: "icon", removable: "removable" }, outputs: { remove: "remove" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$8, decls: 5, vars: 4, consts: [["class", "chip__icon", 3, "class", 4, "ngIf"], [1, "chip__label"], [4, "ngIf"], ["class", "chip__remove dr-icon-exit", 3, "click", 4, "ngIf"], [1, "chip__icon"], [1, "chip__remove", "dr-icon-exit", 3, "click"]], template: function DrChipComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrChipComponent, selectors: [["dr-chip"]], inputs: { label: "label", icon: "icon", removable: "removable" }, outputs: { remove: "remove" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$9, decls: 5, vars: 4, consts: [["class", "chip__icon", 3, "class", 4, "ngIf"], [1, "chip__label"], [4, "ngIf"], ["class", "chip__remove dr-icon-exit", 3, "click", 4, "ngIf"], [1, "chip__icon"], [1, "chip__remove", "dr-icon-exit", 3, "click"]], template: function DrChipComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵtemplate(0, DrChipComponent_i_0_Template, 1, 2, "i", 0);
             i0.ɵɵelementStart(1, "div", 1);
@@ -14614,7 +14518,7 @@ class DrChipComponent {
             type: Output
         }] }); })();
 
-const _c0$7 = ["carouselContainer"];
+const _c0$8 = ["carouselContainer"];
 const _c1$2 = ["carouselItem"];
 function DrGalleryComponent_dr_button_0_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
@@ -14840,7 +14744,7 @@ class DrGalleryComponent {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.template = _t.first);
         } }, viewQuery: function DrGalleryComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$7, 5);
+            i0.ɵɵviewQuery(_c0$8, 5);
             i0.ɵɵviewQuery(_c1$2, 5);
         } if (rf & 2) {
             let _t;
@@ -14902,7 +14806,7 @@ function DrProgressBarComponent_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(1);
     i0.ɵɵtextInterpolate1("", ctx_r0.progress || 0, "%");
 } }
-const _c0$6 = ["*"];
+const _c0$7 = ["*"];
 class DrProgressBarComponent {
     constructor() {
         /**
@@ -14914,7 +14818,7 @@ class DrProgressBarComponent {
     /** @nocollapse */ static { this.ɵfac = function DrProgressBarComponent_Factory(t) { return new (t || DrProgressBarComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrProgressBarComponent, selectors: [["dr-progress-bar"]], hostVars: 2, hostBindings: function DrProgressBarComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassMap(ctx.theme);
-        } }, inputs: { progress: "progress", showValue: "showValue", theme: "theme" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$6, decls: 5, vars: 3, consts: [[1, "progress-bar__background"], [1, "progress-bar__background__fill"], [1, "progress-bar__value"], [4, "ngIf"]], template: function DrProgressBarComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { progress: "progress", showValue: "showValue", theme: "theme" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$7, decls: 5, vars: 3, consts: [[1, "progress-bar__background"], [1, "progress-bar__background__fill"], [1, "progress-bar__value"], [4, "ngIf"]], template: function DrProgressBarComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵelement(1, "div", 1);
@@ -14945,7 +14849,7 @@ class DrProgressBarComponent {
             args: ['class']
         }] }); })();
 
-const _c0$5 = ["*"];
+const _c0$6 = ["*"];
 class DrBadgeComponent {
     constructor() {
         this.color = 'stone';
@@ -14957,7 +14861,7 @@ class DrBadgeComponent {
     /** @nocollapse */ static { this.ɵfac = function DrBadgeComponent_Factory(t) { return new (t || DrBadgeComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrBadgeComponent, selectors: [["dr-badge"]], hostVars: 2, hostBindings: function DrBadgeComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassMap(ctx.elementClasses);
-        } }, inputs: { color: "color", size: "size" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$5, decls: 1, vars: 0, template: function DrBadgeComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { color: "color", size: "size" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$6, decls: 1, vars: 0, template: function DrBadgeComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵprojection(0);
         } }, styles: ["[_nghost-%COMP%]{display:inline-flex;align-items:center;color:#333;border-radius:4px;box-sizing:border-box;font-size:12px;line-height:16px;font-weight:500}.small[_nghost-%COMP%]{gap:2px;padding:2px 4px}.medium[_nghost-%COMP%]{gap:4px;padding:4px 8px}.light-purple[_nghost-%COMP%]{background-color:#dfd9ff}.water[_nghost-%COMP%]{background-color:#d9f2ff}.baby-blue[_nghost-%COMP%]{background-color:#d9e6ff}.baby-pink[_nghost-%COMP%]{background-color:#ffdbf1}.light-turquoise[_nghost-%COMP%]{background-color:#d6fcf9}.bright-green[_nghost-%COMP%]{background-color:#d9ffea}.stone[_nghost-%COMP%]{background-color:#f6f4f4}.peach[_nghost-%COMP%]{background-color:#ffe5b4}.soft-coral[_nghost-%COMP%]{background-color:#ffd2c2}.pale-yellow[_nghost-%COMP%]{background-color:#fffacd}.pastel-olive[_nghost-%COMP%]{background-color:#dce2b9}.powder-blue-grey[_nghost-%COMP%]{background-color:#d3dbe3}.muted-plum[_nghost-%COMP%]{background-color:#e7c7db}"], changeDetection: 0 }); }
@@ -15042,7 +14946,7 @@ class BottomPositionStrategy {
     }
 }
 
-const _c0$4 = ["handleRef"];
+const _c0$5 = ["handleRef"];
 function DrawerContainer_div_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "div", 3, 4);
 } }
@@ -15156,7 +15060,7 @@ class DrawerContainer extends CdkDialogContainer {
     /** @nocollapse */ static { this.ɵfac = function DrawerContainer_Factory(t) { return new (t || DrawerContainer)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1$8.FocusTrapFactory), i0.ɵɵdirectiveInject(DOCUMENT, 8), i0.ɵɵdirectiveInject(DrawerConfig), i0.ɵɵdirectiveInject(i1$8.InteractivityChecker), i0.ɵɵdirectiveInject(i0.NgZone), i0.ɵɵdirectiveInject(i1$1.OverlayRef), i0.ɵɵdirectiveInject(i1$8.FocusMonitor)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrawerContainer, selectors: [["dr-drawer-container"]], viewQuery: function DrawerContainer_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(CdkPortalOutlet, 7);
-            i0.ɵɵviewQuery(_c0$4, 5);
+            i0.ɵɵviewQuery(_c0$5, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx._portalOutlet = _t.first);
@@ -15713,7 +15617,7 @@ function SeparateTableComponent_div_2_div_1_Template(rf, ctx) { if (rf & 1) {
 function SeparateTableComponent_div_2_div_3_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0);
 } }
-const _c0$3 = function (a0, a1) { return { $implicit: a0, column: a1 }; };
+const _c0$4 = function (a0, a1) { return { $implicit: a0, column: a1 }; };
 function SeparateTableComponent_div_2_div_3_Template(rf, ctx) { if (rf & 1) {
     const _r14 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 11);
@@ -15727,7 +15631,7 @@ function SeparateTableComponent_div_2_div_3_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵreference(4);
     i0.ɵɵproperty("ngStyle", column_r11.styles);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", column_r11.cellTemplate || _r1)("ngTemplateOutletContext", i0.ɵɵpureFunction2(3, _c0$3, row_r3, column_r11));
+    i0.ɵɵproperty("ngTemplateOutlet", column_r11.cellTemplate || _r1)("ngTemplateOutletContext", i0.ɵɵpureFunction2(3, _c0$4, row_r3, column_r11));
 } }
 function SeparateTableComponent_div_2_Template(rf, ctx) { if (rf & 1) {
     const _r17 = i0.ɵɵgetCurrentView();
@@ -15844,7 +15748,7 @@ class ElementOverflowDirective {
             type: Input
         }] }); })();
 
-const _c0$2 = ["container"];
+const _c0$3 = ["container"];
 function DrListOverflowComponent_div_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 4);
     i0.ɵɵtext(1, "...");
@@ -15939,7 +15843,7 @@ class DrListOverflowComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrListOverflowComponent_Factory(t) { return new (t || DrListOverflowComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrListOverflowComponent, selectors: [["dr-list-overflow"], ["", "drListOverflow", ""]], viewQuery: function DrListOverflowComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$2, 7);
+            i0.ɵɵviewQuery(_c0$3, 7);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.container = _t.first);
@@ -15970,7 +15874,7 @@ class DrListOverflowComponent {
             args: ['container', { static: true }]
         }] }); })();
 
-const _c0$1 = ["*"];
+const _c0$2 = ["*"];
 class TextOverflowComponent {
     constructor() {
         this.overflowType = 'horizontal';
@@ -15979,7 +15883,7 @@ class TextOverflowComponent {
         this.isOverflow = false;
     }
     /** @nocollapse */ static { this.ɵfac = function TextOverflowComponent_Factory(t) { return new (t || TextOverflowComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: TextOverflowComponent, selectors: [["dr-text-overflow"]], inputs: { overflowType: "overflowType", showTooltip: "showTooltip", tooltipPosition: "tooltipPosition" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$1, decls: 3, vars: 4, consts: [[1, "overflow-element", 3, "drElementOverflow", "drElementOverflowType", "drTooltip", "drTooltipPosition", "drElementOverflowChange"], ["el", ""]], template: function TextOverflowComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: TextOverflowComponent, selectors: [["dr-text-overflow"]], inputs: { overflowType: "overflowType", showTooltip: "showTooltip", tooltipPosition: "tooltipPosition" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$2, decls: 3, vars: 4, consts: [[1, "overflow-element", 3, "drElementOverflow", "drElementOverflowType", "drTooltip", "drTooltipPosition", "drElementOverflowChange"], ["el", ""]], template: function TextOverflowComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "div", 0, 1);
             i0.ɵɵlistener("drElementOverflowChange", function TextOverflowComponent_Template_div_drElementOverflowChange_0_listener($event) { return ctx.isOverflow = $event; });
@@ -16180,7 +16084,7 @@ class SearchPipe {
             }]
     }], null, null); })();
 
-const _c0 = ["dropdownItemTemplate"];
+const _c0$1 = ["dropdownItemTemplate"];
 const _c1 = ["labelItemTemplate"];
 function FilterDropdownComponent_ng_container_5_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
@@ -16512,7 +16416,7 @@ class FilterDropdownComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function FilterDropdownComponent_Factory(t) { return new (t || FilterDropdownComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: FilterDropdownComponent, selectors: [["dr-filter-dropdown"]], contentQueries: function FilterDropdownComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
-            i0.ɵɵcontentQuery(dirIndex, _c0, 5, TemplateRef);
+            i0.ɵɵcontentQuery(dirIndex, _c0$1, 5, TemplateRef);
             i0.ɵɵcontentQuery(dirIndex, _c1, 5, TemplateRef);
         } if (rf & 2) {
             let _t;
@@ -16623,9 +16527,152 @@ class FilterDropdownComponent {
 
 /* components */
 
+var EmojiPickerMode;
+(function (EmojiPickerMode) {
+    EmojiPickerMode["BUTTON"] = "button";
+    EmojiPickerMode["FLAT"] = "flat";
+})(EmojiPickerMode || (EmojiPickerMode = {}));
+
+const _c0 = ["pickerContainer"];
+function EmojiPickerComponent_ng_container_0_ng_template_4_ng_container_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0);
+} }
+function EmojiPickerComponent_ng_container_0_ng_template_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 5);
+    i0.ɵɵtemplate(1, EmojiPickerComponent_ng_container_0_ng_template_4_ng_container_1_Template, 1, 0, "ng-container", 6);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    i0.ɵɵnextContext(2);
+    const _r1 = i0.ɵɵreference(2);
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngTemplateOutlet", _r1);
+} }
+function EmojiPickerComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵelementStart(1, "dr-button", 2, 3);
+    i0.ɵɵlistener("click", function EmojiPickerComponent_ng_container_0_Template_dr_button_click_1_listener() { i0.ɵɵrestoreView(_r8); const ctx_r7 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r7.toggleEmojiPicker()); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(4, EmojiPickerComponent_ng_container_0_ng_template_4_Template, 2, 1, "ng-template", 4);
+    i0.ɵɵlistener("backdropClick", function EmojiPickerComponent_ng_container_0_Template_ng_template_backdropClick_4_listener() { i0.ɵɵrestoreView(_r8); const ctx_r9 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r9.destroyEmojiPicker()); });
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    const _r4 = i0.ɵɵreference(3);
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("cdkConnectedOverlayOrigin", _r4)("cdkConnectedOverlayOpen", ctx_r0.emojiOverlayOpened)("cdkConnectedOverlayPositions", ctx_r0.positions)("cdkConnectedOverlayPush", true)("cdkConnectedOverlayViewportMargin", 16)("cdkConnectedOverlayHasBackdrop", true)("cdkConnectedOverlayBackdropClass", "emoji-modal-backdrop");
+} }
+function EmojiPickerComponent_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0, null, 7);
+} }
+class EmojiPickerComponent {
+    constructor(cdr) {
+        this.cdr = cdr;
+        this.mode = EmojiPickerMode.BUTTON;
+        this.emojiSelected = new EventEmitter();
+        this.emojiOverlayOpened = false;
+        this.EmojiPickerMode = EmojiPickerMode;
+        this.positions = [
+            {
+                originX: 'start',
+                originY: 'top',
+                overlayX: 'start',
+                overlayY: 'bottom',
+                offsetY: -8,
+            },
+            {
+                originX: 'start',
+                originY: 'bottom',
+                overlayX: 'start',
+                overlayY: 'top',
+                offsetY: 8,
+            },
+            {
+                originX: 'end',
+                originY: 'top',
+                overlayX: 'end',
+                overlayY: 'bottom',
+                offsetY: -8,
+            },
+            {
+                originX: 'end',
+                originY: 'bottom',
+                overlayX: 'end',
+                overlayY: 'top',
+                offsetY: 8,
+            },
+        ];
+    }
+    async ngAfterViewInit() {
+        if (this.mode === EmojiPickerMode.FLAT) {
+            await this.renderEmojiPicker();
+        }
+    }
+    async toggleEmojiPicker() {
+        this.emojiOverlayOpened = !this.emojiOverlayOpened;
+        if (this.emojiOverlayOpened && !this.pickerComponentRef) {
+            // Wait for the overlay to render the template
+            setTimeout(async () => {
+                await this.renderEmojiPicker();
+                this.cdr.markForCheck();
+            }, 0);
+        }
+    }
+    onEmojiSelected(event) {
+        const emojiReaction = { id: event.emoji.id, emoji: event.emoji.native };
+        this.emojiSelected.emit(emojiReaction);
+        if (this.mode === EmojiPickerMode.BUTTON) {
+            this.destroyEmojiPicker();
+        }
+    }
+    destroyEmojiPicker() {
+        this.emojiOverlayOpened = false;
+        this.pickerComponentRef?.destroy();
+        this.pickerComponentRef = null;
+    }
+    async renderEmojiPicker() {
+        if (!this.PickerComponent) {
+            // See details here: https://github.com/scttcper/ngx-emoji-mart
+            this.PickerComponent = await import('@ctrl/ngx-emoji-mart').then((m) => m.PickerComponent);
+        }
+        this.pickerComponentRef = this.pickerContainer.createComponent(this.PickerComponent);
+        this.pickerComponentRef.instance.emoji = 'thumbsup';
+        this.pickerComponentRef.instance.darkMode = false;
+        this.pickerComponentRef.instance.color = '#0D99FF';
+        this.pickerComponentRef.instance.emojiSelect.subscribe((event) => this.onEmojiSelected(event));
+        this.cdr.detectChanges();
+    }
+    /** @nocollapse */ static { this.ɵfac = function EmojiPickerComponent_Factory(t) { return new (t || EmojiPickerComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: EmojiPickerComponent, selectors: [["dr-emoji-picker"]], viewQuery: function EmojiPickerComponent_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuery(_c0, 5, ViewContainerRef);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.pickerContainer = _t.first);
+        } }, inputs: { mode: "mode" }, outputs: { emojiSelected: "emojiSelected" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 3, vars: 2, consts: [[4, "ngIf", "ngIfElse"], ["flatTpl", ""], ["theme", "icon", "icon", "dr-icon-emoji-smiley", "cdkOverlayOrigin", "", 3, "click"], ["emojiButton", "", "trigger", "cdkOverlayOrigin"], ["cdkConnectedOverlay", "", 3, "cdkConnectedOverlayOrigin", "cdkConnectedOverlayOpen", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPush", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayBackdropClass", "backdropClick"], [1, "emoji-picker-popup"], [4, "ngTemplateOutlet"], ["pickerContainer", ""]], template: function EmojiPickerComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵtemplate(0, EmojiPickerComponent_ng_container_0_Template, 5, 7, "ng-container", 0);
+            i0.ɵɵtemplate(1, EmojiPickerComponent_ng_template_1_Template, 2, 0, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+        } if (rf & 2) {
+            const _r1 = i0.ɵɵreference(2);
+            i0.ɵɵproperty("ngIf", ctx.mode === ctx.EmojiPickerMode.BUTTON)("ngIfElse", _r1);
+        } }, dependencies: [DrButtonComponent, CdkOverlayOrigin, CdkConnectedOverlay, NgIf, NgTemplateOutlet], styles: [".emoji-picker-popup[_ngcontent-%COMP%]{position:relative;overflow:hidden;z-index:1000;box-shadow:0 2px 36px #00000026;border-radius:12px;width:352px;height:435px;background:#fff;animation:_ngcontent-%COMP%_fadeIn .2s ease-in-out}.emoji-picker-popup[_ngcontent-%COMP%]     section.emoji-mart{border-color:transparent;height:100%;overflow-y:auto}.emoji-picker-popup[_ngcontent-%COMP%]   .emoji-picker-section[_ngcontent-%COMP%]{display:block;height:100%}.emoji-picker-popup[_ngcontent-%COMP%]   .emoji-picker-section[_ngcontent-%COMP%]     section.emoji-mart{border-color:transparent}@keyframes _ngcontent-%COMP%_fadeIn{0%{opacity:0}to{opacity:1}}"], changeDetection: 0 }); }
+}
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(EmojiPickerComponent, [{
+        type: Component,
+        args: [{ selector: 'dr-emoji-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [DrButtonComponent, CdkOverlayOrigin, CdkConnectedOverlay, NgIf, NgTemplateOutlet], template: "<ng-container *ngIf=\"mode === EmojiPickerMode.BUTTON; else flatTpl\">\n    <dr-button\n        #emojiButton\n        theme=\"icon\"\n        icon=\"dr-icon-emoji-smiley\"\n        cdkOverlayOrigin\n        #trigger=\"cdkOverlayOrigin\"\n        (click)=\"toggleEmojiPicker()\"></dr-button>\n    <ng-template\n        cdkConnectedOverlay\n        [cdkConnectedOverlayOrigin]=\"trigger\"\n        [cdkConnectedOverlayOpen]=\"emojiOverlayOpened\"\n        [cdkConnectedOverlayPositions]=\"positions\"\n        [cdkConnectedOverlayPush]=\"true\"\n        [cdkConnectedOverlayViewportMargin]=\"16\"\n        [cdkConnectedOverlayHasBackdrop]=\"true\"\n        [cdkConnectedOverlayBackdropClass]=\"'emoji-modal-backdrop'\"\n        (backdropClick)=\"destroyEmojiPicker()\">\n        <div class=\"emoji-picker-popup\">\n            <ng-container *ngTemplateOutlet=\"flatTpl\"></ng-container>\n        </div>\n    </ng-template>\n</ng-container>\n\n<ng-template #flatTpl>\n    <!-- Placeholder where the emoji picker will be rendered -->\n    <ng-container #pickerContainer></ng-container>\n</ng-template>\n", styles: [".emoji-picker-popup{position:relative;overflow:hidden;z-index:1000;box-shadow:0 2px 36px #00000026;border-radius:12px;width:352px;height:435px;background:#fff;animation:fadeIn .2s ease-in-out}.emoji-picker-popup ::ng-deep section.emoji-mart{border-color:transparent;height:100%;overflow-y:auto}.emoji-picker-popup .emoji-picker-section{display:block;height:100%}.emoji-picker-popup .emoji-picker-section ::ng-deep section.emoji-mart{border-color:transparent}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}\n"] }]
+    }], function () { return [{ type: i0.ChangeDetectorRef }]; }, { mode: [{
+            type: Input
+        }], emojiSelected: [{
+            type: Output
+        }], pickerContainer: [{
+            type: ViewChild,
+            args: ['pickerContainer', { read: ViewContainerRef }]
+        }] }); })();
+
+// Export everything from local-api (excludes emoji-picker)
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AnyTagComponent, AutofocusDirective, BadgeStatus, CHAT_MESSAGE_TYPE, CROP_IMAGE_MODES, CalendarView, ChatMessage, ChatRole, CheckboxComponent, ClickOutsideDirective, ClickOutsideModule, CodeEditorHintWrapperComponent, CustomDateAdapter, CustomDateFormat, DEFAULT_LINK_FONT_SIZE, DEFAULT_LINK_FONT_WEIGHT, DIALOG_BUTTON_LABEL, DIALOG_FIELD_TYPE, DIALOG_SIZE, DR_DRAWER_DATA, DR_DRAWER_DEFAULT_OPTIONS, DR_SHINE_ANIMATION_CLASS, DataAnalyticsService, DateFromats, DatePickerPeriodPosition, DateTagComponent, DateTagModule, DateTags, DateTimePickerComponent, DayTagComponent, DefaultToastrComponent, DefaultTreeviewEventParser, DefaultTreeviewI18n, DialogModalWrapperComponent, DialogService, DialogWrapperComponent, DownlineTreeviewEventParser, DrAccordionComponent, DrAccordionItemBodyComponent, DrAccordionItemComponent, DrAccordionItemHeaderComponent, DrAccordionModule, DrAlertComponent, DrAlertModule, DrAlertTheme, DrAvatarComponent, DrAvatarModule, DrAvatarPipe, DrAvatarService, DrBadgeComponent, DrBadgeStatusComponent, DrBadgeStatusModule, DrButtonComponent, DrChatAlertComponent, DrChatComponent, DrChatCustomMessageDirective, DrChatDroppedFilesComponent, DrChatFormComponent, DrChatFormDropdownComponent, DrChatMessageComponent, DrChatMessageFileComponent, DrChatMessageTextComponent, DrChatModule, DrChatSuggestionsComponent, DrChipComponent, DrCodeEditorComponent, DrCodeEditorModule, DrCodemirrorComponent, DrDatePickerComponent, DrDatePickerCustomHeaderComponent, DrDatePickerFormatDirective, DrDatePickerRangeComponent, DrDatePickerWithTimeframeComponent, DrDetailsListComponent, DrDetailsListModule, DrDialogModule, DrDotFlashingComponent, DrDropdownChildDirective, DrDropdownComponent, DrDropdownDirective, DrDropdownItemComponent, DrDropdownItemShowPipe, DrDropdownModule, DrDropdownService, DrErrorComponent, DrErrorModule, DrFiscalMonthCalendarHeaderComponent, DrFiscalMonthCalendarPickerComponent, DrGalleryComponent, DrImageCropperComponent, DrInputComponent, DrInputsModule, DrLayoutBodyComponent, DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutModule, DrLinkComponent, DrListOverflowComponent, DrModelDebounceChangeDirective, DrPopoverAlignmentDimension, DrPopoverComponent, DrPopoverDirective, DrPopoverModule, DrPopoverRef, DrPopoverService, DrProgressBarComponent, DrScenarioConfigurationComponent, DrScenarioModule, DrScenarioTagConfigurationComponent, DrSelectAddItemComponent, DrSelectComponent, DrSharedUtils, DrShineAnimationDirective, DrShowTimeframePipe, DrSliderComponent, DrSpinnerComponent, DrSpinnerDirective, DrSpinnerModule, DrStepperModule, DrTabComponent, DrTabsComponent, DrTabsModule, DrTagComponent, DrTagModule, DrTagsConstructorComponent, DrTagsConstructorModule, DrToastrModule, DrToastrService, DrToggleButtonComponent, DrToggleComponent, DrTooltipDirective, DrTooltipModule, Drawer, DrawerConfig, DrawerContainer, DrawerModule, DrawerRef, DropdownInstanceService, ElementOverflowDirective, EmojiDataService, EmojiPickerComponent, EmojiPickerMode, FeedbackSentiment, FilterDropdownComponent, FilterPipe, FiscalMonthAdapter, ForecastTagComponent, ForecastTagService, GMT_OFFSETS, ICodeEditorHintIcon, IMAGE_TYPES, ImgPipe, LOCAL_TIME_ZONE_OFFSET, LetContext, LetDirective, LinkTheme, ListTagComponent, ListTagModule, MonthTagComponent, OrderDownlineTreeviewEventParser, QuarterTagComponent, RadioButtonComponent, RadioGroupComponent, Scenario, ScenarioService, SearchPipe, SeparateTableColumnDirective, SeparateTableComponent, StepWizardDirective, StepperComponent, StepperWizardComponent, TagTypes, TagsConfigSubType, TagsConstructorService, TextOverflowComponent, TimePickerComponent, TimeframeOption, ToastrStatus, ToastrStatusIcon, ToggleButtonMode, TooltipComponent, TooltipDefaultComponent, TooltipInfoComponent, TooltipInfoIconTheme, TooltipInfoWidth, TooltipTheme, TrackByPropertyDirective, TreeviewComponent, TreeviewConfig, TreeviewEventParser, TreeviewHelper, TreeviewI18n, TreeviewItem, TreeviewModule, TreeviewPipe, TruncateTextDirective, WeekTagComponent, YearTagComponent, getGMTLabel };
+export { AnyTagComponent, AutofocusDirective, BadgeStatus, CHAT_MESSAGE_TYPE, CROP_IMAGE_MODES, CalendarView, ChatMessage, ChatRole, CheckboxComponent, ClickOutsideDirective, ClickOutsideModule, CodeEditorHintWrapperComponent, CustomDateAdapter, CustomDateFormat, DEFAULT_LINK_FONT_SIZE, DEFAULT_LINK_FONT_WEIGHT, DIALOG_BUTTON_LABEL, DIALOG_FIELD_TYPE, DIALOG_SIZE, DR_DRAWER_DATA, DR_DRAWER_DEFAULT_OPTIONS, DR_SHINE_ANIMATION_CLASS, DataAnalyticsService, DateFromats, DatePickerPeriodPosition, DateTagComponent, DateTagModule, DateTags, DateTimePickerComponent, DayTagComponent, DefaultToastrComponent, DefaultTreeviewEventParser, DefaultTreeviewI18n, DialogModalWrapperComponent, DialogService, DialogWrapperComponent, DownlineTreeviewEventParser, DrAccordionComponent, DrAccordionItemBodyComponent, DrAccordionItemComponent, DrAccordionItemHeaderComponent, DrAccordionModule, DrAlertComponent, DrAlertModule, DrAlertTheme, DrAvatarComponent, DrAvatarModule, DrAvatarPipe, DrAvatarService, DrBadgeComponent, DrBadgeStatusComponent, DrBadgeStatusModule, DrButtonComponent, DrChatAlertComponent, DrChatComponent, DrChatCustomMessageDirective, DrChatDroppedFilesComponent, DrChatFormComponent, DrChatFormDropdownComponent, DrChatMessageComponent, DrChatMessageFileComponent, DrChatMessageTextComponent, DrChatModule, DrChatSuggestionsComponent, DrChipComponent, DrCodeEditorComponent, DrCodeEditorModule, DrCodemirrorComponent, DrDatePickerComponent, DrDatePickerCustomHeaderComponent, DrDatePickerFormatDirective, DrDatePickerRangeComponent, DrDatePickerWithTimeframeComponent, DrDetailsListComponent, DrDetailsListModule, DrDialogModule, DrDotFlashingComponent, DrDropdownChildDirective, DrDropdownComponent, DrDropdownDirective, DrDropdownItemComponent, DrDropdownItemShowPipe, DrDropdownModule, DrDropdownService, DrErrorComponent, DrErrorModule, DrFiscalMonthCalendarHeaderComponent, DrFiscalMonthCalendarPickerComponent, DrGalleryComponent, DrImageCropperComponent, DrInputComponent, DrInputsModule, DrLayoutBodyComponent, DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutModule, DrLinkComponent, DrListOverflowComponent, DrModelDebounceChangeDirective, DrPopoverAlignmentDimension, DrPopoverComponent, DrPopoverDirective, DrPopoverModule, DrPopoverRef, DrPopoverService, DrProgressBarComponent, DrScenarioConfigurationComponent, DrScenarioModule, DrScenarioTagConfigurationComponent, DrSelectAddItemComponent, DrSelectComponent, DrSharedUtils, DrShineAnimationDirective, DrShowTimeframePipe, DrSliderComponent, DrSpinnerComponent, DrSpinnerDirective, DrSpinnerModule, DrStepperModule, DrTabComponent, DrTabsComponent, DrTabsModule, DrTagComponent, DrTagModule, DrTagsConstructorComponent, DrTagsConstructorModule, DrToastrModule, DrToastrService, DrToggleButtonComponent, DrToggleComponent, DrTooltipDirective, DrTooltipModule, Drawer, DrawerConfig, DrawerContainer, DrawerModule, DrawerRef, DropdownInstanceService, ElementOverflowDirective, EmojiPickerComponent, FeedbackSentiment, FilterDropdownComponent, FilterPipe, FiscalMonthAdapter, ForecastTagComponent, ForecastTagService, GMT_OFFSETS, ICodeEditorHintIcon, IMAGE_TYPES, ImgPipe, LOCAL_TIME_ZONE_OFFSET, LetContext, LetDirective, LinkTheme, ListTagComponent, ListTagModule, MonthTagComponent, OrderDownlineTreeviewEventParser, QuarterTagComponent, RadioButtonComponent, RadioGroupComponent, Scenario, ScenarioService, SearchPipe, SeparateTableColumnDirective, SeparateTableComponent, StepWizardDirective, StepperComponent, StepperWizardComponent, TagTypes, TagsConfigSubType, TagsConstructorService, TextOverflowComponent, TimePickerComponent, TimeframeOption, ToastrStatus, ToastrStatusIcon, ToggleButtonMode, TooltipComponent, TooltipCustomComponent, TooltipDefaultComponent, TooltipInfoComponent, TooltipInfoIconTheme, TooltipInfoWidth, TooltipTheme, TrackByPropertyDirective, TreeviewComponent, TreeviewConfig, TreeviewEventParser, TreeviewHelper, TreeviewI18n, TreeviewItem, TreeviewModule, TreeviewPipe, TruncateTextDirective, WeekTagComponent, YearTagComponent, getGMTLabel };
 //# sourceMappingURL=datarailsshared-datarailsshared.mjs.map