@memberjunction/ng-skip-chat 2.19.0 → 2.19.2

package/dist/lib/skip-chat/skip-chat.component.js

@@ -21,13 +21,12 @@ import * as i0 from "@angular/core";
 import * as i1 from "@angular/router";
 import * as i2 from "@angular/common";
 import * as i3 from "@memberjunction/ng-notifications";
-import * as i4 from "@progress/kendo-angular-layout";
-import * as i5 from "@angular/forms";
-import * as i6 from "@progress/kendo-angular-dialog";
-import * as i7 from "@memberjunction/ng-container-directives";
-import * as i8 from "@progress/kendo-angular-listview";
-import * as i9 from "@progress/kendo-angular-buttons";
-import * as i10 from "@memberjunction/ng-data-context";
+import * as i4 from "@angular/forms";
+import * as i5 from "@progress/kendo-angular-dialog";
+import * as i6 from "@memberjunction/ng-container-directives";
+import * as i7 from "@progress/kendo-angular-listview";
+import * as i8 from "@progress/kendo-angular-buttons";
+import * as i9 from "@memberjunction/ng-data-context";
 const _c0 = ["AskSkipPanel"];
 const _c1 = ["mjContainer"];
 const _c2 = ["conversationList"];
@@ -35,17 +34,22 @@ const _c3 = ["AskSkipInput"];
 const _c4 = ["scrollContainer"];
 const _c5 = ["topLevelDiv"];
 const _c6 = () => ({ "item-border": true });
-function SkipChatComponent_kendo_splitter_pane_3_div_1_button_3_Template(rf, ctx) { if (rf & 1) {
+function SkipChatComponent_Conditional_3_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "img", 26);
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("src", ctx_r2.SkipLogoURL, i0.ɵɵsanitizeUrl);
+} }
+function SkipChatComponent_Conditional_3_Conditional_5_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 29);
-    i0.ɵɵlistener("click", function SkipChatComponent_kendo_splitter_pane_3_div_1_button_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.CreateNewConversation()); });
-    i0.ɵɵtext(1, "+");
+    i0.ɵɵelementStart(0, "span", 30);
+    i0.ɵɵlistener("click", function SkipChatComponent_Conditional_3_Conditional_5_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.CreateNewConversation()); });
     i0.ɵɵelementEnd();
 } }
-function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_span_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span", 35);
+function SkipChatComponent_Conditional_3_ng_template_8_span_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "span", 36);
 } }
-function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_span_3_Template(rf, ctx) { if (rf & 1) {
+function SkipChatComponent_Conditional_3_ng_template_8_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
@@ -54,45 +58,45 @@ function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_span_3_Temp
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(dataItem_r6.Name);
 } }
-function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_textarea_4_Template(rf, ctx) { if (rf & 1) {
+function SkipChatComponent_Conditional_3_ng_template_8_textarea_4_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "textarea", 36);
-    i0.ɵɵtwoWayListener("ngModelChange", function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_textarea_4_Template_textarea_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r7); const dataItem_r6 = i0.ɵɵnextContext().dataItem; i0.ɵɵtwoWayBindingSet(dataItem_r6.Name, $event) || (dataItem_r6.Name = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(0, "textarea", 37);
+    i0.ɵɵtwoWayListener("ngModelChange", function SkipChatComponent_Conditional_3_ng_template_8_textarea_4_Template_textarea_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r7); const dataItem_r6 = i0.ɵɵnextContext().dataItem; i0.ɵɵtwoWayBindingSet(dataItem_r6.Name, $event) || (dataItem_r6.Name = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const dataItem_r6 = i0.ɵɵnextContext().dataItem;
     i0.ɵɵtwoWayProperty("ngModel", dataItem_r6.Name);
 } }
-function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_1_Template(rf, ctx) { if (rf & 1) {
+function SkipChatComponent_Conditional_3_ng_template_8_div_5_span_1_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 42);
-    i0.ɵɵlistener("click", function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_1_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r8); const dataItem_r6 = i0.ɵɵnextContext(2).dataItem; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.editConvo(dataItem_r6)); });
+    i0.ɵɵelementStart(0, "span", 43);
+    i0.ɵɵlistener("click", function SkipChatComponent_Conditional_3_ng_template_8_div_5_span_1_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r8); const dataItem_r6 = i0.ɵɵnextContext(2).dataItem; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.editConvo(dataItem_r6)); });
     i0.ɵɵelementEnd();
 } }
-function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_2_Template(rf, ctx) { if (rf & 1) {
+function SkipChatComponent_Conditional_3_ng_template_8_div_5_span_2_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 43);
-    i0.ɵɵlistener("click", function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_2_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r9); const dataItem_r6 = i0.ɵɵnextContext(2).dataItem; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.showDeleteConvoDialog(dataItem_r6)); });
+    i0.ɵɵelementStart(0, "span", 44);
+    i0.ɵɵlistener("click", function SkipChatComponent_Conditional_3_ng_template_8_div_5_span_2_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r9); const dataItem_r6 = i0.ɵɵnextContext(2).dataItem; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.showDeleteConvoDialog(dataItem_r6)); });
     i0.ɵɵelementEnd();
 } }
-function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_3_Template(rf, ctx) { if (rf & 1) {
+function SkipChatComponent_Conditional_3_ng_template_8_div_5_span_3_Template(rf, ctx) { if (rf & 1) {
     const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 44);
-    i0.ɵɵlistener("click", function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_3_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r10); const dataItem_r6 = i0.ɵɵnextContext(2).dataItem; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.saveConvoName(dataItem_r6)); });
+    i0.ɵɵelementStart(0, "span", 45);
+    i0.ɵɵlistener("click", function SkipChatComponent_Conditional_3_ng_template_8_div_5_span_3_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r10); const dataItem_r6 = i0.ɵɵnextContext(2).dataItem; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.saveConvoName(dataItem_r6)); });
     i0.ɵɵelementEnd();
 } }
-function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_4_Template(rf, ctx) { if (rf & 1) {
+function SkipChatComponent_Conditional_3_ng_template_8_div_5_span_4_Template(rf, ctx) { if (rf & 1) {
     const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 45);
-    i0.ɵɵlistener("click", function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_4_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r11); const dataItem_r6 = i0.ɵɵnextContext(2).dataItem; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.cancelConvoEdit(dataItem_r6)); });
+    i0.ɵɵelementStart(0, "span", 46);
+    i0.ɵɵlistener("click", function SkipChatComponent_Conditional_3_ng_template_8_div_5_span_4_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r11); const dataItem_r6 = i0.ɵɵnextContext(2).dataItem; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.cancelConvoEdit(dataItem_r6)); });
     i0.ɵɵelementEnd();
 } }
-function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 37);
-    i0.ɵɵtemplate(1, SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_1_Template, 1, 0, "span", 38)(2, SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_2_Template, 1, 0, "span", 39)(3, SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_3_Template, 1, 0, "span", 40)(4, SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_span_4_Template, 1, 0, "span", 41);
+function SkipChatComponent_Conditional_3_ng_template_8_div_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 38);
+    i0.ɵɵtemplate(1, SkipChatComponent_Conditional_3_ng_template_8_div_5_span_1_Template, 1, 0, "span", 39)(2, SkipChatComponent_Conditional_3_ng_template_8_div_5_span_2_Template, 1, 0, "span", 40)(3, SkipChatComponent_Conditional_3_ng_template_8_div_5_span_3_Template, 1, 0, "span", 41)(4, SkipChatComponent_Conditional_3_ng_template_8_div_5_span_4_Template, 1, 0, "span", 42);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext(4);
+    const ctx_r2 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", !ctx_r2.ConversationEditMode);
     i0.ɵɵadvance();
@@ -102,19 +106,19 @@ function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_Templ
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", ctx_r2.ConversationEditMode);
 } }
-function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_Template(rf, ctx) { if (rf & 1) {
+function SkipChatComponent_Conditional_3_ng_template_8_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 30);
-    i0.ɵɵlistener("click", function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_Template_div_click_0_listener() { const dataItem_r6 = i0.ɵɵrestoreView(_r5).dataItem; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.SelectConversation(dataItem_r6)); });
-    i0.ɵɵtemplate(1, SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_span_1_Template, 1, 0, "span", 31);
-    i0.ɵɵelementStart(2, "div", 32);
-    i0.ɵɵtemplate(3, SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_span_3_Template, 2, 1, "span", 19)(4, SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_textarea_4_Template, 1, 1, "textarea", 33);
+    i0.ɵɵelementStart(0, "div", 31);
+    i0.ɵɵlistener("click", function SkipChatComponent_Conditional_3_ng_template_8_Template_div_click_0_listener() { const dataItem_r6 = i0.ɵɵrestoreView(_r5).dataItem; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.SelectConversation(dataItem_r6)); });
+    i0.ɵɵtemplate(1, SkipChatComponent_Conditional_3_ng_template_8_span_1_Template, 1, 0, "span", 32);
+    i0.ɵɵelementStart(2, "div", 33);
+    i0.ɵɵtemplate(3, SkipChatComponent_Conditional_3_ng_template_8_span_3_Template, 2, 1, "span", 21)(4, SkipChatComponent_Conditional_3_ng_template_8_textarea_4_Template, 1, 1, "textarea", 34);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(5, SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_div_5_Template, 5, 4, "div", 34);
+    i0.ɵɵtemplate(5, SkipChatComponent_Conditional_3_ng_template_8_div_5_Template, 5, 4, "div", 35);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const dataItem_r6 = ctx.dataItem;
-    const ctx_r2 = i0.ɵɵnextContext(3);
+    const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngClass", ctx_r2.GetConversationItemClass(dataItem_r6))("title", dataItem_r6.Name);
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", ctx_r2.SelectedConversation && ctx_r2.IsSkipProcessing(dataItem_r6));
@@ -125,73 +129,69 @@ function SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_Template(rf
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", (ctx_r2.SelectedConversation == null ? null : ctx_r2.SelectedConversation.ID) === dataItem_r6.ID);
 } }
-function SkipChatComponent_kendo_splitter_pane_3_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 23)(1, "div", 24);
-    i0.ɵɵelement(2, "img", 25);
-    i0.ɵɵtemplate(3, SkipChatComponent_kendo_splitter_pane_3_div_1_button_3_Template, 2, 0, "button", 26);
+function SkipChatComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 6)(1, "div", 23)(2, "div", 24)(3, "span", 25);
+    i0.ɵɵlistener("click", function SkipChatComponent_Conditional_3_Template_span_click_3_listener() { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.DisplayConversationList(false)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "kendo-listview", 27, 3);
-    i0.ɵɵtemplate(6, SkipChatComponent_kendo_splitter_pane_3_div_1_ng_template_6_Template, 6, 6, "ng-template", 28);
-    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(4, SkipChatComponent_Conditional_3_Conditional_4_Template, 1, 1, "img", 26)(5, SkipChatComponent_Conditional_3_Conditional_5_Template, 1, 0, "span", 27);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "kendo-listview", 28, 3);
+    i0.ɵɵtemplate(8, SkipChatComponent_Conditional_3_ng_template_8_Template, 6, 6, "ng-template", 29);
+    i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("src", ctx_r2.SkipLogoURL, i0.ɵɵsanitizeUrl);
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(4);
+    i0.ɵɵconditional(ctx_r2.ShowSkipLogoInConversationList ? 4 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r2.AllowNewConversations);
+    i0.ɵɵconditional(ctx_r2.AllowNewConversations ? 5 : -1);
     i0.ɵɵadvance();
     i0.ɵɵstyleProp("height", 280, "px");
-    i0.ɵɵproperty("data", ctx_r2.Conversations)("itemClass", i0.ɵɵpureFunction0(8, _c6))("fillWidth", false)("bottomMargin", 20);
+    i0.ɵɵproperty("data", ctx_r2.Conversations)("itemClass", i0.ɵɵpureFunction0(8, _c6))("fillWidth", false)("bottomMargin", 50);
 } }
-function SkipChatComponent_kendo_splitter_pane_3_Template(rf, ctx) { if (rf & 1) {
-    const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-splitter-pane", 21);
-    i0.ɵɵlistener("collapsedChange", function SkipChatComponent_kendo_splitter_pane_3_Template_kendo_splitter_pane_collapsedChange_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.splitterCollapseStateChanged($event)); });
-    i0.ɵɵtemplate(1, SkipChatComponent_kendo_splitter_pane_3_div_1_Template, 7, 9, "div", 22);
+function SkipChatComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    const _r12 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "span", 25);
+    i0.ɵɵlistener("click", function SkipChatComponent_Conditional_4_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.DisplayConversationList(true)); });
     i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("collapsible", true)("scrollable", false)("resizable", false);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r2.ShowConversationList);
-} }
-function SkipChatComponent_div_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "div", 46);
 } }
 function SkipChatComponent_div_10_Template(rf, ctx) { if (rf & 1) {
-    const _r12 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 47)(1, "div", 48);
-    i0.ɵɵelement(2, "img", 49);
-    i0.ɵɵelementStart(3, "div", 50);
+    i0.ɵɵelement(0, "div", 47);
+} }
+function SkipChatComponent_div_11_Template(rf, ctx) { if (rf & 1) {
+    const _r13 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 48)(1, "div", 49);
+    i0.ɵɵelement(2, "img", 50);
+    i0.ɵɵelementStart(3, "div", 51);
     i0.ɵɵtext(4, "What can I help with today?");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 51)(6, "div", 52)(7, "div", 53);
-    i0.ɵɵlistener("click", function SkipChatComponent_div_10_Template_div_click_7_listener() { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.sendPrompt(ctx_r2.WelcomeQuestions[0].prompt)); });
-    i0.ɵɵelementStart(8, "span", 54);
+    i0.ɵɵelementStart(5, "div", 52)(6, "div", 53)(7, "div", 54);
+    i0.ɵɵlistener("click", function SkipChatComponent_div_11_Template_div_click_7_listener() { i0.ɵɵrestoreView(_r13); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.sendPrompt(ctx_r2.WelcomeQuestions[0].prompt)); });
+    i0.ɵɵelementStart(8, "span", 55);
     i0.ɵɵtext(9);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(10, "span");
     i0.ɵɵtext(11);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(12, "div", 53);
-    i0.ɵɵlistener("click", function SkipChatComponent_div_10_Template_div_click_12_listener() { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.sendPrompt(ctx_r2.WelcomeQuestions[1].prompt)); });
-    i0.ɵɵelementStart(13, "span", 54);
+    i0.ɵɵelementStart(12, "div", 54);
+    i0.ɵɵlistener("click", function SkipChatComponent_div_11_Template_div_click_12_listener() { i0.ɵɵrestoreView(_r13); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.sendPrompt(ctx_r2.WelcomeQuestions[1].prompt)); });
+    i0.ɵɵelementStart(13, "span", 55);
     i0.ɵɵtext(14);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(15, "span");
     i0.ɵɵtext(16);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(17, "div", 52)(18, "div", 53);
-    i0.ɵɵlistener("click", function SkipChatComponent_div_10_Template_div_click_18_listener() { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.sendPrompt(ctx_r2.WelcomeQuestions[2].prompt)); });
-    i0.ɵɵelementStart(19, "span", 54);
+    i0.ɵɵelementStart(17, "div", 53)(18, "div", 54);
+    i0.ɵɵlistener("click", function SkipChatComponent_div_11_Template_div_click_18_listener() { i0.ɵɵrestoreView(_r13); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.sendPrompt(ctx_r2.WelcomeQuestions[2].prompt)); });
+    i0.ɵɵelementStart(19, "span", 55);
     i0.ɵɵtext(20);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(21, "span");
     i0.ɵɵtext(22);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(23, "div", 53);
-    i0.ɵɵlistener("click", function SkipChatComponent_div_10_Template_div_click_23_listener() { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.sendPrompt(ctx_r2.WelcomeQuestions[3].prompt)); });
-    i0.ɵɵelementStart(24, "span", 54);
+    i0.ɵɵelementStart(23, "div", 54);
+    i0.ɵɵlistener("click", function SkipChatComponent_div_11_Template_div_click_23_listener() { i0.ɵɵrestoreView(_r13); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.sendPrompt(ctx_r2.WelcomeQuestions[3].prompt)); });
+    i0.ɵɵelementStart(24, "span", 55);
     i0.ɵɵtext(25);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(26, "span");
@@ -218,42 +218,42 @@ function SkipChatComponent_div_10_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(ctx_r2.WelcomeQuestions[3].bottomLine);
 } }
-function SkipChatComponent_span_12_Template(rf, ctx) { if (rf & 1) {
-    const _r13 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 55);
-    i0.ɵɵlistener("click", function SkipChatComponent_span_12_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r13); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.scrollToBottomAnimate()); });
-    i0.ɵɵelement(1, "i", 56);
+function SkipChatComponent_span_13_Template(rf, ctx) { if (rf & 1) {
+    const _r14 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "span", 56);
+    i0.ɵɵlistener("click", function SkipChatComponent_span_13_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.scrollToBottomAnimate()); });
+    i0.ɵɵelement(1, "i", 57);
     i0.ɵɵelementEnd();
 } }
-function SkipChatComponent_Conditional_17_Template(rf, ctx) { if (rf & 1) {
-    const _r14 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 16)(1, "span", 57);
-    i0.ɵɵlistener("click", function SkipChatComponent_Conditional_17_Template_span_click_1_listener() { i0.ɵɵrestoreView(_r14); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.showDataContext()); });
+function SkipChatComponent_Conditional_18_Template(rf, ctx) { if (rf & 1) {
+    const _r15 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 18)(1, "span", 58);
+    i0.ɵɵlistener("click", function SkipChatComponent_Conditional_18_Template_span_click_1_listener() { i0.ɵɵrestoreView(_r15); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.showDataContext()); });
     i0.ɵɵelementEnd()();
 } }
-function SkipChatComponent_div_20_Template(rf, ctx) { if (rf & 1) {
-    const _r15 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div")(1, "mj-data-context-dialog", 58);
-    i0.ɵɵlistener("dialogClosed", function SkipChatComponent_div_20_Template_mj_data_context_dialog_dialogClosed_1_listener() { i0.ɵɵrestoreView(_r15); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeDataContextDialog()); });
+function SkipChatComponent_div_21_Template(rf, ctx) { if (rf & 1) {
+    const _r16 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div")(1, "mj-data-context-dialog", 59);
+    i0.ɵɵlistener("dialogClosed", function SkipChatComponent_div_21_Template_mj_data_context_dialog_dialogClosed_1_listener() { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeDataContextDialog()); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
     i0.ɵɵproperty("dataContextId", ctx_r2.DataContextID)("Provider", ctx_r2.ProviderToUse);
 } }
-function SkipChatComponent_kendo_dialog_21_Template(rf, ctx) { if (rf & 1) {
-    const _r16 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-dialog", 59);
-    i0.ɵɵlistener("close", function SkipChatComponent_kendo_dialog_21_Template_kendo_dialog_close_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeDeleteConversation("no")); });
-    i0.ɵɵelementStart(1, "p", 60);
+function SkipChatComponent_kendo_dialog_22_Template(rf, ctx) { if (rf & 1) {
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-dialog", 60);
+    i0.ɵɵlistener("close", function SkipChatComponent_kendo_dialog_22_Template_kendo_dialog_close_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeDeleteConversation("no")); });
+    i0.ɵɵelementStart(1, "p", 61);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "kendo-dialog-actions")(4, "button", 61);
-    i0.ɵɵlistener("click", function SkipChatComponent_kendo_dialog_21_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeDeleteConversation("yes")); });
+    i0.ɵɵelementStart(3, "kendo-dialog-actions")(4, "button", 62);
+    i0.ɵɵlistener("click", function SkipChatComponent_kendo_dialog_22_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r17); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeDeleteConversation("yes")); });
     i0.ɵɵtext(5, " Yes ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "button", 29);
-    i0.ɵɵlistener("click", function SkipChatComponent_kendo_dialog_21_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeDeleteConversation("no")); });
+    i0.ɵɵelementStart(6, "button", 63);
+    i0.ɵɵlistener("click", function SkipChatComponent_kendo_dialog_22_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r17); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeDeleteConversation("no")); });
     i0.ɵɵtext(7, " No ");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
@@ -262,6 +262,27 @@ function SkipChatComponent_kendo_dialog_21_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" Would you like to delete ", ctx_r2.SelectedConversation == null ? null : ctx_r2.SelectedConversation.Name, "? ");
 } }
+function SkipChatComponent_kendo_dialog_23_Template(rf, ctx) { if (rf & 1) {
+    const _r18 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-dialog", 60);
+    i0.ɵɵlistener("close", function SkipChatComponent_kendo_dialog_23_Template_kendo_dialog_close_0_listener() { i0.ɵɵrestoreView(_r18); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeMessageEditOrDeleteDialog("no")); });
+    i0.ɵɵelementStart(1, "p", 61);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "kendo-dialog-actions")(4, "button", 62);
+    i0.ɵɵlistener("click", function SkipChatComponent_kendo_dialog_23_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r18); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeMessageEditOrDeleteDialog("yes")); });
+    i0.ɵɵtext(5, " Yes ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "button", 63);
+    i0.ɵɵlistener("click", function SkipChatComponent_kendo_dialog_23_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r18); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeMessageEditOrDeleteDialog("no")); });
+    i0.ɵɵtext(7, " No ");
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("minWidth", 250)("width", 450);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" Would you like to ", ctx_r2.messageEditOrDeleteType, " this message? Doing so will result in any subsequent messages in the conversation being deleted. ");
+} }
 export class SkipChatComponent extends BaseAngularComponent {
     constructor(el, renderer, route, router, location, cdRef, notificationService) {
         super();
@@ -276,6 +297,9 @@ export class SkipChatComponent extends BaseAngularComponent {
         this.Messages = [];
         this.Conversations = [];
         this.ConversationEditMode = false;
+        /**
+         * If true, the component will show the conversation list. Default is true.
+         */
         this.ShowConversationList = true;
         this.AllowNewConversations = true;
         this.Title = 'Ask Skip';
@@ -294,6 +318,18 @@ export class SkipChatComponent extends BaseAngularComponent {
          * If true, the component will update the browser URL when the conversation changes. If false, it will not update the URL. Default is true.
          */
         this.UpdateAppRoute = true;
+        /**
+         * When set to true, the small Skip logo is shown in the conversation list on the top left of the component
+         */
+        this.ShowSkipLogoInConversationList = false;
+        /**
+         * This property is used to set the placeholder text for the textbox where the user types their message to Skip.
+         */
+        this.DefaultTextboxPlaceholder = 'Type your message to Skip here...';
+        /**
+         * This property is used to set the placeholder text for the textbox where the user types their message to Skip when Skip is processing a request and the text area is disabled.
+         */
+        this.ProcessingTextBoxPlaceholder = 'Please wait...';
         /**
          * Event emitted when the user clicks on a matching report and the application needs to handle the navigation
          */
@@ -302,7 +338,16 @@ export class SkipChatComponent extends BaseAngularComponent {
          * Event emitted whenever a conversation is selected
          */
         this.ConversationSelected = new EventEmitter();
+        /**
+         * This event fires whenever a new report is created.
+         */
+        this.NewReportCreated = new EventEmitter();
+        /**
+         * Internal state variable to track if the conversation list is visible or not. Defaults to true. Conversation List only is shown if this is true and ShowConversationList is true.
+         */
+        this.IsConversationListVisible = true;
         this._showScrollToBottomIcon = false;
+        this._AskSkipTextboxPlaceholder = 'Type your message here...';
         this._messageInProgress = false;
         this._conversationsInProgress = {};
         this._conversationsToReload = {};
@@ -345,6 +390,8 @@ export class SkipChatComponent extends BaseAngularComponent {
         this._usedStartMessages = [];
         this._processingStatus = {};
         this.isDataContextDialogVisible = false;
+        this.confirmMessageEditOrDeleteDialogOpen = false;
+        this.messageEditOrDeleteType = 'edit';
     }
     ngOnInit() {
         this.SubscribeToNotifications();
@@ -381,6 +428,16 @@ export class SkipChatComponent extends BaseAngularComponent {
     splitterCollapseStateChanged(e) {
         InvokeManualResize();
     }
+    get ConversationListCurrentlyVisible() {
+        return this.IsConversationListVisible && this.ShowConversationList;
+    }
+    DisplayConversationList(show = true) {
+        if (show !== this.IsConversationListVisible) {
+            this.IsConversationListVisible = show;
+            this.cdRef.detectChanges();
+            InvokeManualResize();
+        }
+    }
     GetConversationItemClass(item) {
         var _a;
         let classInfo = '';
@@ -417,6 +474,7 @@ export class SkipChatComponent extends BaseAngularComponent {
                         obj.RefreshMessage();
                 }
             }
+            this._AskSkipTextboxPlaceholder = this.ProcessingTextBoxPlaceholder;
         }
         else {
             if (this._temporaryMessage) {
@@ -424,6 +482,7 @@ export class SkipChatComponent extends BaseAngularComponent {
                 this.RemoveMessageFromCurrentConversation(this._temporaryMessage);
                 this._temporaryMessage = undefined;
             }
+            this._AskSkipTextboxPlaceholder = this.DefaultTextboxPlaceholder;
         }
     }
     SetSelectedConversationUser() {
@@ -685,8 +744,9 @@ export class SkipChatComponent extends BaseAngularComponent {
                     const newIdx = idx > 0 ? idx - 1 : 0;
                     this.SelectConversation(this.Conversations[newIdx]);
                 }
-                else
+                else {
                     this.Messages = [];
+                }
             }
             else {
                 this.notificationService.CreateSimpleNotification('Error deleting conversation', 'error', 5000);
@@ -770,12 +830,15 @@ export class SkipChatComponent extends BaseAngularComponent {
     SelectConversation(conversation) {
         return __awaiter(this, void 0, void 0, function* () {
             var _a;
+            if (this.IsSkipProcessing(conversation)) {
+                return; // already processing this conversation so don't go back and forth
+            }
             if (conversation && conversation.ID !== ((_a = this.SelectedConversation) === null || _a === void 0 ? void 0 : _a.ID)) {
                 // load up the conversation if not already the one that's loaded
                 this._conversationLoadComplete = false;
                 this.ClearMessages();
-                const oldStatus = this._processingStatus[conversation.ID];
-                this._processingStatus[conversation.ID] = true;
+                const oldStatus = this.IsSkipProcessing(conversation);
+                this.setProcessingStatus(conversation.ID, true);
                 this.SelectedConversation = conversation;
                 this.SetSelectedConversationUser();
                 this.DataContextID = conversation.DataContextID ? conversation.DataContextID : '';
@@ -800,11 +863,11 @@ export class SkipChatComponent extends BaseAngularComponent {
                     const result = yield this.RunViewToUse.RunView({
                         EntityName: 'Conversation Details',
                         ExtraFilter: `ConversationID='${conversation.ID}'`,
-                        OrderBy: '__mj_CreatedAt ASC', // show messages in order of creation
+                        OrderBy: '__mj_CreatedAt ASC' // show messages in order of creation,
                     });
                     if (result && result.Success) {
                         // copy the results into NEW objects into the array, we don't want to modify the original objects
-                        this.Messages = [...result.Results];
+                        this.Messages = result.Results;
                         // also, cache the messages within the conversation, but create new array with the same objects
                         convoAny._Messages = [...this.Messages];
                     }
@@ -818,7 +881,7 @@ export class SkipChatComponent extends BaseAngularComponent {
                     this._scrollToBottom = true; // this results in the angular after Viewchecked scrolling to bottom when it's done
                     this.cdRef.reattach(); // resume change detection
                 }
-                this._processingStatus[conversation.ID] = oldStatus; // set back to old status as it might have been processing
+                this.setProcessingStatus(conversation.ID, oldStatus); // set back to old status as it might have been processing
                 InvokeManualResize(500);
                 // ensure the list box has the conversation in view
                 this.scrollToConversation(conversation.ID);
@@ -872,16 +935,25 @@ export class SkipChatComponent extends BaseAngularComponent {
         this._usedStartMessages.push(SkipChatComponent._startMessages[idx]);
         return SkipChatComponent._startMessages[idx];
     }
+    setProcessingStatus(conversationId, status) {
+        if (conversationId) {
+            this._processingStatus[conversationId] = status;
+            // if the current conversation, update the panel messages so they know we've changed our processing state
+            if (this.SelectedConversation && this.SelectedConversation.ID === conversationId) {
+                this.UpdateAllPanelMessages();
+            }
+        }
+    }
     sendPrompt(val) {
         return __awaiter(this, void 0, void 0, function* () {
-            var _a, _b, _c, _d;
+            var _a, _b, _c;
             const convoID = this.SelectedConversation ? this.SelectedConversation.ID : '';
             if (this._conversationsInProgress[convoID]) {
                 // don't allow sending another message if we're in the midst of sending one
                 return;
             }
             if (this.SelectedConversation) {
-                this._processingStatus[(_a = this.SelectedConversation) === null || _a === void 0 ? void 0 : _a.ID] = true;
+                this.setProcessingStatus((_a = this.SelectedConversation) === null || _a === void 0 ? void 0 : _a.ID, true);
             }
             if (val && val.length > 0) {
                 this._conversationsInProgress[convoID] = true;
@@ -906,18 +978,18 @@ export class SkipChatComponent extends BaseAngularComponent {
                     if (convoID !== ((_b = this.SelectedConversation) === null || _b === void 0 ? void 0 : _b.ID)) {
                         // this scenario arises when we have a selected convo change after we submitted our request to skip
                         // so we do nothing here other than update the status.
-                        this._processingStatus[convoID] = false;
+                        this.setProcessingStatus(convoID, false);
                         //the next time the user selects this convo, we will fetch messages
                         //from the server rather than using the ones in cache
                         this._conversationsToReload[convoID] = true;
                     }
                     else {
-                        this._processingStatus[convoID] = false;
+                        this.setProcessingStatus(convoID, false);
                         const innerResult = JSON.parse(skipResult.Result);
                         if (!this.SelectedConversation) {
                             const convo = yield p.GetEntityObject('Conversations', p.CurrentUser);
                             yield convo.Load(skipResult.ConversationId);
-                            this._processingStatus[skipResult.ConversationId] = true;
+                            this.setProcessingStatus(skipResult.ConversationId, true);
                             this.Conversations.push(convo);
                             this.SelectedConversation = convo;
                             this.SetSelectedConversationUser();
@@ -945,8 +1017,9 @@ export class SkipChatComponent extends BaseAngularComponent {
                     }
                 }
                 this._scrollToBottom = true; // this results in the angular after Viewchecked scrolling to bottom when it's done
-                if (this.SelectedConversation)
-                    this._processingStatus[(_d = this.SelectedConversation) === null || _d === void 0 ? void 0 : _d.ID] = false;
+                if (this.SelectedConversation) {
+                    this.setProcessingStatus(this.SelectedConversation.ID, false);
+                }
                 this.AllowSend = true;
                 this._conversationsInProgress[convoID] = false;
                 this._messageInProgress = false;
@@ -977,6 +1050,10 @@ export class SkipChatComponent extends BaseAngularComponent {
     }
     AddMessageToCurrentConversation(detail, stopChangeDetection, cacheMessage) {
         // update the local binding for the UI
+        if (this.Messages.find((m) => m.ID === detail.ID) || this.Messages.find(m => m === detail)) {
+            // we already have this message, so don't add it again
+            return;
+        }
         this.Messages.push(detail);
         if (cacheMessage) {
             // update the cache of messages for the selected conversation
@@ -1022,6 +1099,25 @@ export class SkipChatComponent extends BaseAngularComponent {
             this.cdRef.reattach();
         }
     }
+    UpdatePanelMessage(messageDetail, invokeChangeDetection = true) {
+        const ref = messageDetail._componentRef;
+        if (ref) {
+            const obj = ref.instance;
+            obj.ConversationMessages = this.Messages; // update this so it can handle its rendering appropriately
+            obj.ConversationProcessing = this.IsSkipProcessing(this.SelectedConversation); // update this so it can handle its rendering appropriately
+            if (invokeChangeDetection) {
+                this.cdRef.markForCheck();
+            }
+        }
+    }
+    UpdateAllPanelMessages() {
+        if (this.Messages && this.Messages.length > 0) {
+            this.Messages.forEach((m) => {
+                this.UpdatePanelMessage(m, false);
+            });
+            this.cdRef.markForCheck();
+        }
+    }
     // Method to dynamically add a message
     AddMessageToPanel(messageDetail, stopChangeDetection) {
         // Temporarily stop change detection for performance
@@ -1030,9 +1126,19 @@ export class SkipChatComponent extends BaseAngularComponent {
         const componentRef = this.askSkip.viewContainerRef.createComponent(SkipSingleMessageComponent);
         // Pass the message details to the component instance
         const obj = componentRef.instance;
+        // bubble up events from the single message component to the parent component
         obj.NavigateToMatchingReport.subscribe((reportId) => {
             this.NavigateToMatchingReport.emit(reportId);
         });
+        obj.NewReportCreated.subscribe((reportId) => {
+            this.NewReportCreated.emit(reportId);
+        });
+        obj.DeleteMessageRequested.subscribe((message) => {
+            this.HandleMessageDeleteRequest(message);
+        });
+        obj.EditMessageRequested.subscribe((message) => {
+            this.HandleMessageEditRequest(message);
+        });
         obj.Provider = this.ProviderToUse;
         obj.SkipMarkOnlyLogoURL = this.SkipMarkOnlyLogoURL;
         obj.UserImage = this.UserImage;
@@ -1041,6 +1147,8 @@ export class SkipChatComponent extends BaseAngularComponent {
         obj.DataContext = this.DataContext;
         obj.ConversationUser = this.SelectedConversationUser;
         obj.ConversationMessages = this.Messages; // pass this on so that the single message has access to the full conversation, for example to know if it is the first/last/only message in the conversation/etc
+        // bind the processing status to the component
+        obj.ConversationProcessing = this.IsSkipProcessing(this.SelectedConversation);
         // Whenever the suggested question is clicked on by the user in the single message component, we want to bubble that up here and send the prompt
         obj.SuggestedQuestionSelected.subscribe((question) => {
             this.sendPrompt(question);
@@ -1194,11 +1302,15 @@ export class SkipChatComponent extends BaseAngularComponent {
         });
     }
     IsSkipProcessing(Conversation) {
-        if (this._processingStatus[Conversation.ID]) {
+        if (!Conversation) {
+            return false;
+        }
+        else if (this._processingStatus[Conversation.ID]) {
             return this._processingStatus[Conversation.ID];
         }
-        else
+        else {
             return false;
+        }
     }
     IsTextAreaEmpty() {
         if (this.askSkipInput && this.askSkipInput.nativeElement) {
@@ -1246,6 +1358,103 @@ export class SkipChatComponent extends BaseAngularComponent {
             this.loadConversations(convoIDParam);
         });
     }
+    HandleMessageEditOrDeleteRequest(message, type) {
+        if (this.SelectedConversation && !this.IsSkipProcessing(this.SelectedConversation)) {
+            this.messageToEditOrDelete = message;
+            this.messageEditOrDeleteType = type;
+            this.confirmMessageEditOrDeleteDialogOpen = true;
+        }
+    }
+    HandleMessageEditRequest(message) {
+        this.HandleMessageEditOrDeleteRequest(message, 'edit');
+    }
+    HandleMessageDeleteRequest(message) {
+        this.HandleMessageEditOrDeleteRequest(message, 'delete');
+    }
+    closeMessageEditOrDeleteDialog(yesno) {
+        this.confirmMessageEditOrDeleteDialogOpen = false;
+        if (this.messageToEditOrDelete && yesno === 'yes') {
+            // the user has requested to either edit or delete the message. This situation calls
+            // for (a) removing all subsequent messages in the conversation in both cases
+            // in the case where they are editing an existing message, we edit the current message
+            // and then resubmit it. In both cases in the UI we have to update by removing all
+            // subsequent messages. 
+            if (this.messageEditOrDeleteType === 'edit') {
+                this.editMessage(this.messageToEditOrDelete);
+            }
+            else {
+                this.deleteMessage(this.messageToEditOrDelete);
+            }
+        }
+    }
+    editMessage(message) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const oldMessageText = message.Message;
+            yield this.deleteMessage(message);
+            // now add the text from the message to the input box
+            this.askSkipInput.nativeElement.value = oldMessageText;
+            // this will let the user edit the message and submit it
+        });
+    }
+    deleteMessage(message) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!this.SelectedConversation || this.IsSkipProcessing(this.SelectedConversation)) {
+                return; // don't allow deleting messages while we're processing or don't have a selected convo
+            }
+            this.setProcessingStatus(this.SelectedConversation.ID, true);
+            // first find all the subsequent messages in the conversation
+            const idx = this.Messages.findIndex((m) => m.ID === message.ID);
+            if (idx >= 0) {
+                const currentAndSubsequentMessages = this.Messages.slice(idx);
+                const tg = yield this.ProviderToUse.CreateTransactionGroup();
+                for (const m of currentAndSubsequentMessages) {
+                    // need to create the BaseEntity subclass for the conversation detail entity
+                    // as our initial load of the conversation detail entity is not a full object it is 
+                    // a simple javascript object.
+                    const actualEntityObject = yield this.ProviderToUse.GetEntityObject('Conversation Details', this.ProviderToUse.CurrentUser);
+                    if (yield actualEntityObject.Load(m.ID)) {
+                        // check to see if it loaded succesfully or not, sometimes it is already deleted
+                        if (actualEntityObject.ConversationID === this.SelectedConversation.ID) {
+                            actualEntityObject.TransactionGroup = tg;
+                            actualEntityObject.Delete(); // no await as we'll await the transaciton group below    
+                        }
+                        else {
+                            // didn't load successfully, drop to console, possibly the record was already deleted, non-fatal
+                            console.log('Error loading conversation detail entity for deletion', m);
+                        }
+                    }
+                    else {
+                        // problem loading the entity, drop to console, possibly the record was already deleted, non-fatal
+                        console.log('Error loading conversation detail entity for deletion', m);
+                    }
+                }
+                // now submit the transaction group
+                if (yield tg.Submit()) {
+                    // now clean up the arrays within this.Messages and also the current conversation's Messages array
+                    // remove all messages inluding and after the idx
+                    // this.Messages = this.Messages.slice(0, idx);
+                    // const convoAny = <any>this.SelectedConversation;
+                    // if (convoAny) {
+                    //   convoAny._Messages = this.Messages;
+                    // }
+                    // for (const m of currentAndSubsequentMessages) {
+                    //   // now remove the message from the UI
+                    //   this.RemoveMessageFromCurrentConversation(m);
+                    // }
+                    // this.UpdateAllPanelMessages(); // update remaining messages in the panel so they have the correct messages array and processing status
+                    this.setProcessingStatus(this.SelectedConversation.ID, false); // done
+                    const convo = this.SelectedConversation;
+                    this.SelectedConversation = undefined; // wipe out so the below does something
+                    this.SelectConversation(convo); // reload the conversation to get the latest messages
+                }
+                else {
+                    // alert the user to the error
+                    this.setProcessingStatus(this.SelectedConversation.ID, false); // done
+                    this.notificationService.CreateSimpleNotification('Error deleting messages', 'error', 3000);
+                }
+            }
+        });
+    }
 }
 SkipChatComponent.__skipChatWindowsCurrentlyVisible = 0;
 SkipChatComponent._startMessages = [
@@ -1276,29 +1485,31 @@ SkipChatComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SkipChatC
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.askSkipInput = _t.first);
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.scrollContainer = _t.first);
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.topLevelDiv = _t.first);
-    } }, inputs: { AllowSend: "AllowSend", Messages: "Messages", Conversations: "Conversations", SelectedConversation: "SelectedConversation", ConversationEditMode: "ConversationEditMode", ShowConversationList: "ShowConversationList", AllowNewConversations: "AllowNewConversations", Title: "Title", DataContextID: "DataContextID", LinkedEntity: "LinkedEntity", LinkedEntityCompositeKey: "LinkedEntityCompositeKey", ShowDataContextButton: "ShowDataContextButton", IncludeLinkedConversationsInList: "IncludeLinkedConversationsInList", SkipLogoURL: "SkipLogoURL", SkipMarkOnlyLogoURL: "SkipMarkOnlyLogoURL", UserImage: "UserImage", UpdateAppRoute: "UpdateAppRoute", WelcomeQuestions: "WelcomeQuestions", AutoLoad: "AutoLoad" }, outputs: { NavigateToMatchingReport: "NavigateToMatchingReport", ConversationSelected: "ConversationSelected" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 22, vars: 11, consts: [["topLevelDiv", ""], ["AskSkipPanel", "", "scrollContainer", ""], ["AskSkipInput", ""], ["conversationList", ""], ["mjFillContainer", "", 1, "chat-container", 3, "bottomMargin", "rightMargin"], ["orientation", "horizontal"], ["size", "272px", 3, "collapsible", "scrollable", "resizable", "collapsedChange", 4, "ngIf"], ["mjFillContainer", "", 1, "conversation-wrapper"], [1, "messages", 3, "scroll"], ["class", "waiting-for-ai", 4, "ngIf"], ["class", "welcome-wrapper", 4, "ngIf"], ["mjContainer", "", "mjSkipResize", "true"], ["class", "scroll-to-bottom-icon", 3, "click", 4, "ngIf"], [1, "input-area"], [1, "text-area-wrapper"], ["type", "text", "placeholder", "Ask Skip a question", 3, "keyup.enter", "input", "disabled"], ["kendoButton", ""], ["kendoButton", "", 3, "click", "disabled"], [1, "fas", "fa-solid", "fa-arrow-up"], [4, "ngIf"], ["title", "Please confirm", 3, "minWidth", "width", "close", 4, "ngIf"], ["size", "272px", 3, "collapsedChange", "collapsible", "scrollable", "resizable"], ["class", "conversation-history", 4, "ngIf"], [1, "conversation-history"], [1, "new-chat-area"], [1, "avatar", 3, "src"], ["kendoButton", "", 3, "click", 4, "ngIf"], ["mjFillContainer", "", 1, "conversation-list", 3, "data", "itemClass", "fillWidth", "bottomMargin"], ["kendoListViewItemTemplate", ""], ["kendoButton", "", 3, "click"], [1, "conversation-item", 3, "click", "ngClass", "title"], ["class", "fa-regular fa-clock", 4, "ngIf"], [1, "text-container"], ["maxlength", "100", 3, "ngModel", "ngModelChange", 4, "ngIf"], ["class", "edit-conversation-panel", 4, "ngIf"], [1, "fa-regular", "fa-clock"], ["maxlength", "100", 3, "ngModelChange", "ngModel"], [1, "edit-conversation-panel"], ["class", "fa-solid fa-pen-to-square", 3, "click", 4, "ngIf"], ["class", "fa-regular fa-trash-can", 3, "click", 4, "ngIf"], ["class", "fa-solid fa-check", 3, "click", 4, "ngIf"], ["class", "fa-solid fa-xmark", 3, "click", 4, "ngIf"], [1, "fa-solid", "fa-pen-to-square", 3, "click"], [1, "fa-regular", "fa-trash-can", 3, "click"], [1, "fa-solid", "fa-check", 3, "click"], [1, "fa-solid", "fa-xmark", 3, "click"], [1, "waiting-for-ai"], [1, "welcome-wrapper"], [1, "welcome-message"], [3, "src"], [1, "welcome-header-text"], [1, "welcome-suggested-questions"], [1, "welcome-suggested-questions-col"], [1, "welcome-question", 3, "click"], [1, "welcome-question-header"], [1, "scroll-to-bottom-icon", 3, "click"], [1, "fas", "fa-arrow-down"], [1, "fa-solid", "fa-gear", 3, "click"], [3, "dialogClosed", "dataContextId", "Provider"], ["title", "Please confirm", 3, "close", "minWidth", "width"], [2, "margin", "30px", "text-align", "center"], ["kendoButton", "", "themeColor", "primary", 3, "click"]], template: function SkipChatComponent_Template(rf, ctx) { if (rf & 1) {
+    } }, inputs: { AllowSend: "AllowSend", Messages: "Messages", Conversations: "Conversations", SelectedConversation: "SelectedConversation", ConversationEditMode: "ConversationEditMode", ShowConversationList: "ShowConversationList", AllowNewConversations: "AllowNewConversations", Title: "Title", DataContextID: "DataContextID", LinkedEntity: "LinkedEntity", LinkedEntityCompositeKey: "LinkedEntityCompositeKey", ShowDataContextButton: "ShowDataContextButton", IncludeLinkedConversationsInList: "IncludeLinkedConversationsInList", SkipLogoURL: "SkipLogoURL", SkipMarkOnlyLogoURL: "SkipMarkOnlyLogoURL", UserImage: "UserImage", UpdateAppRoute: "UpdateAppRoute", ShowSkipLogoInConversationList: "ShowSkipLogoInConversationList", DefaultTextboxPlaceholder: "DefaultTextboxPlaceholder", ProcessingTextBoxPlaceholder: "ProcessingTextBoxPlaceholder", WelcomeQuestions: "WelcomeQuestions", AutoLoad: "AutoLoad" }, outputs: { NavigateToMatchingReport: "NavigateToMatchingReport", ConversationSelected: "ConversationSelected", NewReportCreated: "NewReportCreated" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 24, vars: 14, consts: [["topLevelDiv", ""], ["AskSkipPanel", "", "scrollContainer", ""], ["AskSkipInput", ""], ["conversationList", ""], ["mjFillContainer", "", 1, "chat-container", 3, "bottomMargin", "rightMargin"], [1, "layout"], [1, "left-panel"], [1, "fa-solid", "fa-table-columns", "toggle-icon"], [1, "right-panel"], ["mjFillContainer", "", 1, "conversation-wrapper"], [1, "messages", 3, "scroll"], ["class", "waiting-for-ai", 4, "ngIf"], ["class", "welcome-wrapper", 4, "ngIf"], ["mjContainer", "", "mjSkipResize", "true"], ["class", "scroll-to-bottom-icon", 3, "click", 4, "ngIf"], [1, "input-area"], [1, "text-area-wrapper"], ["type", "text", 3, "keyup.enter", "input", "disabled", "placeholder"], ["kendoButton", ""], ["kendoButton", "", 3, "click", "disabled"], [1, "fas", "fa-solid", "fa-arrow-up"], [4, "ngIf"], ["title", "Please confirm", 3, "minWidth", "width", "close", 4, "ngIf"], [1, "conversation-history"], [1, "new-chat-area"], [1, "fa-solid", "fa-table-columns", "toggle-icon", 3, "click"], [1, "avatar", 3, "src"], [1, "fa-solid", "fa-pen-to-square", "new-convo-icon"], ["mjFillContainer", "", 1, "conversation-list", 3, "data", "itemClass", "fillWidth", "bottomMargin"], ["kendoListViewItemTemplate", ""], [1, "fa-solid", "fa-pen-to-square", "new-convo-icon", 3, "click"], [1, "conversation-item", 3, "click", "ngClass", "title"], ["class", "fa-regular fa-clock", 4, "ngIf"], [1, "text-container"], ["maxlength", "100", 3, "ngModel", "ngModelChange", 4, "ngIf"], ["class", "edit-conversation-panel", 4, "ngIf"], [1, "fa-regular", "fa-clock"], ["maxlength", "100", 3, "ngModelChange", "ngModel"], [1, "edit-conversation-panel"], ["class", "fa-solid fa-pen-to-square", 3, "click", 4, "ngIf"], ["class", "fa-regular fa-trash-can", 3, "click", 4, "ngIf"], ["class", "fa-solid fa-check", 3, "click", 4, "ngIf"], ["class", "fa-solid fa-xmark", 3, "click", 4, "ngIf"], [1, "fa-solid", "fa-pen-to-square", 3, "click"], [1, "fa-regular", "fa-trash-can", 3, "click"], [1, "fa-solid", "fa-check", 3, "click"], [1, "fa-solid", "fa-xmark", 3, "click"], [1, "waiting-for-ai"], [1, "welcome-wrapper"], [1, "welcome-message"], [3, "src"], [1, "welcome-header-text"], [1, "welcome-suggested-questions"], [1, "welcome-suggested-questions-col"], [1, "welcome-question", 3, "click"], [1, "welcome-question-header"], [1, "scroll-to-bottom-icon", 3, "click"], [1, "fas", "fa-arrow-down"], [1, "fa-solid", "fa-gear", 3, "click"], [3, "dialogClosed", "dataContextId", "Provider"], ["title", "Please confirm", 3, "close", "minWidth", "width"], [2, "margin", "30px", "text-align", "center"], ["kendoButton", "", "themeColor", "primary", 3, "click"], ["kendoButton", "", 3, "click"]], template: function SkipChatComponent_Template(rf, ctx) { if (rf & 1) {
         const _r1 = i0.ɵɵgetCurrentView();
-        i0.ɵɵelementStart(0, "div", 4, 0)(2, "kendo-splitter", 5);
-        i0.ɵɵtemplate(3, SkipChatComponent_kendo_splitter_pane_3_Template, 2, 4, "kendo-splitter-pane", 6);
-        i0.ɵɵelementStart(4, "kendo-splitter-pane")(5, "div", 7)(6, "div", 8, 1);
-        i0.ɵɵlistener("scroll", function SkipChatComponent_Template_div_scroll_6_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.checkScroll()); });
-        i0.ɵɵtemplate(9, SkipChatComponent_div_9_Template, 1, 0, "div", 9)(10, SkipChatComponent_div_10_Template, 28, 9, "div", 10);
-        i0.ɵɵelement(11, "div", 11);
-        i0.ɵɵtemplate(12, SkipChatComponent_span_12_Template, 2, 0, "span", 12);
+        i0.ɵɵelementStart(0, "div", 4, 0)(2, "div", 5);
+        i0.ɵɵtemplate(3, SkipChatComponent_Conditional_3_Template, 9, 9, "div", 6)(4, SkipChatComponent_Conditional_4_Template, 1, 0, "span", 7);
+        i0.ɵɵelementStart(5, "div", 8)(6, "div", 9)(7, "div", 10, 1);
+        i0.ɵɵlistener("scroll", function SkipChatComponent_Template_div_scroll_7_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.checkScroll()); });
+        i0.ɵɵtemplate(10, SkipChatComponent_div_10_Template, 1, 0, "div", 11)(11, SkipChatComponent_div_11_Template, 28, 9, "div", 12);
+        i0.ɵɵelement(12, "div", 13);
+        i0.ɵɵtemplate(13, SkipChatComponent_span_13_Template, 2, 0, "span", 14);
         i0.ɵɵelementEnd();
-        i0.ɵɵelementStart(13, "div", 13)(14, "div", 14)(15, "textarea", 15, 2);
-        i0.ɵɵlistener("keyup.enter", function SkipChatComponent_Template_textarea_keyup_enter_15_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onEnter($event)); })("input", function SkipChatComponent_Template_textarea_input_15_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onInputChange($event)); });
+        i0.ɵɵelementStart(14, "div", 15)(15, "div", 16)(16, "textarea", 17, 2);
+        i0.ɵɵlistener("keyup.enter", function SkipChatComponent_Template_textarea_keyup_enter_16_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onEnter($event)); })("input", function SkipChatComponent_Template_textarea_input_16_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onInputChange($event)); });
         i0.ɵɵelementEnd()();
-        i0.ɵɵtemplate(17, SkipChatComponent_Conditional_17_Template, 2, 0, "button", 16);
-        i0.ɵɵelementStart(18, "button", 17);
-        i0.ɵɵlistener("click", function SkipChatComponent_Template_button_click_18_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.sendSkipMessage()); });
-        i0.ɵɵelement(19, "span", 18);
+        i0.ɵɵtemplate(18, SkipChatComponent_Conditional_18_Template, 2, 0, "button", 18);
+        i0.ɵɵelementStart(19, "button", 19);
+        i0.ɵɵlistener("click", function SkipChatComponent_Template_button_click_19_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.sendSkipMessage()); });
+        i0.ɵɵelement(20, "span", 20);
         i0.ɵɵelementEnd()()()()()();
-        i0.ɵɵtemplate(20, SkipChatComponent_div_20_Template, 2, 2, "div", 19)(21, SkipChatComponent_kendo_dialog_21_Template, 8, 3, "kendo-dialog", 20);
+        i0.ɵɵtemplate(21, SkipChatComponent_div_21_Template, 2, 2, "div", 21)(22, SkipChatComponent_kendo_dialog_22_Template, 8, 3, "kendo-dialog", 22)(23, SkipChatComponent_kendo_dialog_23_Template, 8, 3, "kendo-dialog", 22);
     } if (rf & 2) {
         i0.ɵɵproperty("bottomMargin", 10)("rightMargin", 10);
         i0.ɵɵadvance(3);
-        i0.ɵɵproperty("ngIf", ctx.ShowConversationList);
+        i0.ɵɵconditional(ctx.IsConversationListVisible ? 3 : -1);
+        i0.ɵɵadvance();
+        i0.ɵɵconditional(!ctx.IsConversationListVisible ? 4 : -1);
         i0.ɵɵadvance(6);
         i0.ɵɵproperty("ngIf", ctx.Messages && ctx.Messages.length > 0 && ctx.SelectedConversation && ctx.IsSkipProcessing(ctx.SelectedConversation));
         i0.ɵɵadvance();
@@ -1306,19 +1517,21 @@ SkipChatComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SkipChatC
         i0.ɵɵadvance(2);
         i0.ɵɵproperty("ngIf", ctx._showScrollToBottomIcon && ctx.Messages && ctx.Messages.length > 0);
         i0.ɵɵadvance(3);
-        i0.ɵɵproperty("disabled", ctx.SelectedConversation && ctx.IsSkipProcessing(ctx.SelectedConversation));
+        i0.ɵɵproperty("disabled", ctx.SelectedConversation && ctx.IsSkipProcessing(ctx.SelectedConversation))("placeholder", ctx._AskSkipTextboxPlaceholder);
         i0.ɵɵadvance(2);
-        i0.ɵɵconditional(ctx.ShowDataContextButton ? 17 : -1);
+        i0.ɵɵconditional(ctx.ShowDataContextButton ? 18 : -1);
         i0.ɵɵadvance();
         i0.ɵɵproperty("disabled", ctx.IsTextAreaEmpty() || ctx.SelectedConversation !== undefined && ctx.IsSkipProcessing(ctx.SelectedConversation));
         i0.ɵɵadvance(2);
         i0.ɵɵproperty("ngIf", ctx.isDataContextDialogVisible);
         i0.ɵɵadvance();
         i0.ɵɵproperty("ngIf", ctx.confirmDeleteConversationDialogOpen);
-    } }, dependencies: [i2.NgClass, i2.NgIf, i4.SplitterComponent, i4.SplitterPaneComponent, i5.DefaultValueAccessor, i5.NgControlStatus, i5.MaxLengthValidator, i5.NgModel, i6.DialogComponent, i6.DialogActionsComponent, i7.FillContainer, i7.Container, i8.ItemTemplateDirective, i8.ListViewComponent, i9.ButtonComponent, i10.DataContextDialogComponent], styles: [".chat-container[_ngcontent-%COMP%] {\n    padding: 5px;\n    display: flex;\n    flex-direction: row;\n    height: 100%;\n    font-family: S\u00F6hne, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Ubuntu, Cantarell, \"Noto Sans\", sans-serif, \"Helvetica Neue\", Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    font-size: 1rem;\n\n    \n\n    width: 100%;\n    height: 100%;\n\n    background-color: #f9f9f9;\n}\n\n.conversation-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    position: relative; \n\n    background-color: #f9f9f9;\n}\n\n.new-conversation[_ngcontent-%COMP%] {\n    height: 30px;\n    font-size: large;\n}\n\n.conversation-history[_ngcontent-%COMP%] {\n    width: 260px;\n    min-width: 260px;\n    height: 100%;\n    overflow-y: auto; \n\n    margin-right: 10px;\n    padding-top: 5px;\n    background-color: #f9f9f9;\n    margin-top: 0px;  \n    padding: 12px;  \n}\n\n.k-tabstrip-content-for-skip[_ngcontent-%COMP%] {\n    padding: 0;\n    padding-block: 0;\n}\n\n\n.conversation-history[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%] {\n    height: 25px;\n}\n\n.skip-title[_ngcontent-%COMP%] {\n    font-size: larger;\n    margin-bottom: 5px;\n    height: 20px;\n    margin-top: 5px;\n}\n\n.conversation-list[_ngcontent-%COMP%] {\n    margin-top: 5px;\n    padding-top: 5px;\n    \n    border: 0;\n    background-color: #f9f9f9;\n}\n\n\n\n\n\n.welcome-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n}\n\n.welcome-message[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    overflow: hidden;\n    height: 100%;\n}\n\n.embedded-conversations[_ngcontent-%COMP%] {\n    margin-left: 3px;\n    margin-top: 5px;\n    font-size: 10pt;\n    color: rgb(48, 48, 235);\n}\n.embedded-conversations[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] {\n    margin-top: 4px;\n    margin-left: 5px;\n    cursor: pointer;\n}\n.conversation-item-linked[_ngcontent-%COMP%] {\n    color: rgb(48, 48, 235);\n}\n\n.welcome-message[_ngcontent-%COMP%]   img[_ngcontent-%COMP%] {\n    width: 120px;\n    height: 50px;\n    margin-bottom: 20px; \n\n}\n\n.welcome-header-text[_ngcontent-%COMP%] {\n    font-size: larger;\n    font-weight: bold;\n}\n\n\n\n.welcome-suggested-questions[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-content: center;\n}\n.welcome-suggested-questions-col[_ngcontent-%COMP%] {\n    display: flex;\n}\n\n\n\n.welcome-question[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column; \n\n    align-items: left;;\n    width: 300px;  \n    justify-content: space-between;\n    margin: 5px; \n\n    border: solid 1px rgba(41, 28, 28, 0.08);\n    border-radius: 15px;\n    padding: 10px;\n    cursor: pointer;\n}\n\n.welcome-question[_ngcontent-%COMP%]:hover {\n    background-color: rgba(0, 0, 0, 0.05);\n}\n\n\n.welcome-question-header[_ngcontent-%COMP%] {\n    font-size: 12pt;\n    font-weight: bold;\n    display: block; \n\n}\n\n\n\n.welcome-question[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]:not(.welcome-question-header) {\n    font-weight: normal;\n    font-size: 10pt;\n}\n\n\n.messages[_ngcontent-%COMP%] {\n    overflow-y: auto; \n\n    overflow-x: hidden; \n\n    \n\n    margin-bottom: 5px;\n\n    margin-top: 2px; \n\n\n    background-color: #f9f9f9;\n    flex: 1;\n}\n\n\n\n.new-chat-area[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between; \n\n    align-items: center; \n\n}\n.avatar[_ngcontent-%COMP%] {\n    max-height: 24px;\n    margin-right: 10px;\n    margin-left: 5px;\n    margin-bottom: 3px;\n    \n\n    margin-right: auto; \n\n}\n\n.conversation-item[_ngcontent-%COMP%] {\n    margin-left: 5px;\n    margin-right: 5px;\n    padding-top: 10px;\n    padding-bottom: 10px;\n    padding-left: 5px;\n    padding-right: 5px;\n    border-radius: 5px;\n    cursor: pointer;\n    overflow: hidden;\n    max-height: 150px;\n    font-size: 14px;\n\n    display: flex;\n    align-items: flex-start; \n\n\n    flex-wrap: wrap; \n\n}\n\n.text-container[_ngcontent-%COMP%] {\n    flex: 1; \n\n    display: flex;\n    flex-direction: column; \n\n}\n\n.text-container[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%] {\n    resize: none; \n\n    \n\n}\n\n.conversation-item[_ngcontent-%COMP%]    > .conversation-icon[_ngcontent-%COMP%] {\n    margin-top: 3px;\n}\n\n.conversation-item[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    display: inline-block;\n    white-space: pre-wrap;  \n\n    overflow: auto;\n    word-wrap: break-word;\n    margin-left: 3px;     \n\n}\n\n.conversation-item[_ngcontent-%COMP%]:hover {\n    background-color: rgba(0, 0, 0, 0.05);\n}\n.conversation-item-selected[_ngcontent-%COMP%] {\n    background-color: rgba(0, 0, 0, 0.15);\n}\n\n\n.conversation-item[_ngcontent-%COMP%]    > .conversation-icon[_ngcontent-%COMP%] {\n    margin-right: 11px;\n}\n.edit-conversation-panel[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: flex-end; \n\n    margin-top: 2px; \n\n    margin-right: 2px; \n\n}\n.edit-conversation-panel[_ngcontent-%COMP%]    > .k-icon[_ngcontent-%COMP%] {\n    margin-left: 5px;\n    cursor: pointer;\n}\n.edit-conversation-panel[_ngcontent-%COMP%]    > .k-icon[_ngcontent-%COMP%]:hover {\n    color: #ff0000;\n}\n\n\n\n.input-area[_ngcontent-%COMP%] {\n    min-height: 35px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-bottom: 15px;\n}\n\n.input-area[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%] {\n    vertical-align: top;\n    width: 30px;\n    height: 30px;\n    margin-top: 3px;\n    border-radius: 12px;\n}\n.input-area[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%]:first-of-type {\n    margin-left: -40px;\n}\n.input-area[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%]:last-child {\n    margin-left: -65px;\n}\n\n.text-area-wrapper[_ngcontent-%COMP%] {\n    padding: 3px;\n    border: solid 1px rgba(0, 0, 0, 0.08) ;\n    border-radius: 15px;\n\n    margin-top: 4px;\n    margin-right: -1px;\n    min-height: 42px;\n    max-height: 100%; \n\n\n    overflow: hidden;    \n    align-items: center;\n\n    \n\n    width: 710px;    \n    padding-right: 90px\n} \n.text-area-wrapper[_ngcontent-%COMP%]    > textarea[_ngcontent-%COMP%] {\n    border: 0;\n    outline: 0;\n    resize: none;\n\n    min-height: 20px; \n\n\n    width: 100%;\n    overflow-y: hidden; \n\n\n    font-family: S\u00F6hne, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Ubuntu, Cantarell, \"Noto Sans\", sans-serif, \"Helvetica Neue\", Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    font-size: 1rem;\n\n    margin-left: 7px;\n    margin-top: 7px;\n    margin-bottom: 5px;\n\n    background-color: #f9f9f9;\n}\n\n.text-area-wrapper[_ngcontent-%COMP%]    > textarea[_ngcontent-%COMP%]:disabled {\n    background-color: white;\n}\n\n.input-wrapper[_ngcontent-%COMP%] {\n    flex-grow: 1; \n\n    height: 100%;\n}\n\n.waiting-for-ai[_ngcontent-%COMP%] {\n    position: absolute;\n    display: flex; \n\n    bottom: 100px;\n    z-index: 999;\n    left: 10px; \n}\n  \n.scroll-to-bottom-icon[_ngcontent-%COMP%] {\n    position: absolute;\n    bottom: 100px; \n\n    left: 50%; \n\n    transform: translateX(-50%); \n\n    z-index: 1000; \n\n    background-color: white; \n\n    color: black; \n\n    border-radius: 50%; \n\n    width: 40px; \n\n    height: 40px; \n\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    box-shadow: 0px 0px 5px rgba(0,0,0,0.3); \n\n    cursor: pointer;\n}\n\n@media (min-width: 600px) {\n    .welcome-suggested-questions[_ngcontent-%COMP%] {\n        display: flex;\n        flex-wrap: wrap; \n\n        align-content: flex-end; \n\n    }\n}"] });
+        i0.ɵɵadvance();
+        i0.ɵɵproperty("ngIf", ctx.confirmMessageEditOrDeleteDialogOpen);
+    } }, dependencies: [i2.NgClass, i2.NgIf, i4.DefaultValueAccessor, i4.NgControlStatus, i4.MaxLengthValidator, i4.NgModel, i5.DialogComponent, i5.DialogActionsComponent, i6.FillContainer, i6.Container, i7.ItemTemplateDirective, i7.ListViewComponent, i8.ButtonComponent, i9.DataContextDialogComponent], styles: [".layout[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: row; \n\n    height: 100%; \n\n    width: 100%; \n\n    position: relative;\n}\n\n.left-panel[_ngcontent-%COMP%] {\n    width: 272px; \n\n    background-color: #f8f9fa; \n\n    border-right: 1px solid #ddd; \n\n    overflow-y: auto; \n\n    overflow-x: hidden; \n\n    position: relative;\n\n    scrollbar-width: thin; \n\n    scrollbar-color: #d3d3d3 #f8f9fa; \n\n}\n\n\n\n.left-panel[_ngcontent-%COMP%]::-webkit-scrollbar {\n    width: 8px; \n\n    background-color: #f8f9fa; \n\n}\n\n.left-panel[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n    background-color: #d3d3d3; \n\n    border-radius: 4px; \n\n}\n\n.left-panel[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\n    background-color: #c0c0c0; \n\n}\n\n.left-panel[_ngcontent-%COMP%]::-webkit-scrollbar-track {\n    background-color: #f8f9fa; \n\n}\n\n.right-panel[_ngcontent-%COMP%] {\n    flex: 1; \n\n    overflow-y: auto; \n\n}\n\n\n.new-convo-icon[_ngcontent-%COMP%] {\n    color: #808080; \n\n    font-size: 18px; \n\n    cursor: pointer; \n\n    z-index: 10; \n\n    padding: 5px;\n    border-radius: 4px;\n}\n\n.toggle-icon[_ngcontent-%COMP%] {\n    color: #808080; \n\n    font-size: 18px; \n\n    cursor: pointer; \n\n    z-index: 10; \n\n    margin-left: 6px;\n    padding: 3px;\n    border-radius: 3px;\n}\n \n\n.right-panel[_ngcontent-%COMP%]   .toggle-icon[_ngcontent-%COMP%] {\n    margin-left: 3px;\n    margin-top: 2px;\n    position: absolute;\n    top: 10px;\n    left: auto;\n    right: 10px; \n\n}\n\n\n.chat-container[_ngcontent-%COMP%] {\n    padding: 5px;\n    display: flex;\n    flex-direction: row;\n    height: 100%;\n    font-family: S\u00F6hne, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Ubuntu, Cantarell, \"Noto Sans\", sans-serif, \"Helvetica Neue\", Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    font-size: 1rem;\n\n    \n\n    width: 100%;\n    height: 100%;\n\n    background-color: #f9f9f9;\n}\n\n.conversation-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    position: relative; \n\n    background-color: #f9f9f9;\n}\n\n.new-conversation[_ngcontent-%COMP%] {\n    height: 30px;\n    font-size: large;\n}\n\n.conversation-history[_ngcontent-%COMP%] {\n    width: 240px;\n    min-width: 240px;\n    height: 95%;\n    overflow-y: auto; \n\n    overflow-x: hidden; \n\n    margin-right: 10px;\n    padding-top: 5px;\n    background-color: #f9f9f9;\n    margin-top: 0px;  \n    padding: 12px;  \n}\n\n.k-tabstrip-content-for-skip[_ngcontent-%COMP%] {\n    padding: 0;\n    padding-block: 0;\n}\n\n\n.conversation-history[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%] {\n    height: 25px;\n}\n\n.skip-title[_ngcontent-%COMP%] {\n    font-size: larger;\n    margin-bottom: 5px;\n    height: 20px;\n    margin-top: 5px;\n}\n\n.conversation-list[_ngcontent-%COMP%] {\n    margin-top: 5px;\n    padding-top: 5px;\n    \n    border: 0;\n    background-color: #f9f9f9;\n}\n\n\n\n\n\n.welcome-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n}\n\n.welcome-message[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    overflow: hidden;\n    height: 100%;\n}\n\n.embedded-conversations[_ngcontent-%COMP%] {\n    margin-left: 3px;\n    margin-top: 5px;\n    font-size: 10pt;\n    color: rgb(48, 48, 235);\n}\n.embedded-conversations[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] {\n    margin-top: 4px;\n    margin-left: 5px;\n    cursor: pointer;\n}\n.conversation-item-linked[_ngcontent-%COMP%] {\n    color: rgb(48, 48, 235);\n}\n\n.welcome-message[_ngcontent-%COMP%]   img[_ngcontent-%COMP%] {\n    width: 120px;\n    height: 50px;\n    margin-bottom: 20px; \n\n}\n\n.welcome-header-text[_ngcontent-%COMP%] {\n    font-size: larger;\n    font-weight: bold;\n}\n\n\n\n.welcome-suggested-questions[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-content: center;\n}\n.welcome-suggested-questions-col[_ngcontent-%COMP%] {\n    display: flex;\n}\n\n\n\n.welcome-question[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column; \n\n    align-items: left;;\n    width: 300px;  \n    justify-content: space-between;\n    margin: 5px; \n\n    border: solid 1px rgba(41, 28, 28, 0.08);\n    border-radius: 15px;\n    padding: 10px;\n    cursor: pointer;\n}\n\n.welcome-question[_ngcontent-%COMP%]:hover {\n    background-color: rgba(0, 0, 0, 0.05);\n}\n\n\n.welcome-question-header[_ngcontent-%COMP%] {\n    font-size: 12pt;\n    font-weight: bold;\n    display: block; \n\n}\n\n\n\n.welcome-question[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]:not(.welcome-question-header) {\n    font-weight: normal;\n    font-size: 10pt;\n}\n\n\n.messages[_ngcontent-%COMP%] {\n    overflow-y: auto; \n\n    overflow-x: hidden; \n\n    \n\n    margin-bottom: 5px;\n\n    margin-top: 2px; \n\n\n    background-color: #f9f9f9;\n    flex: 1;\n    scrollbar-width: thin; \n\n    scrollbar-color: #d3d3d3 #f8f9fa; \n\n}\n\n\n\n.messages[_ngcontent-%COMP%]::-webkit-scrollbar {\nwidth: 8px; \n\nbackground-color: #f8f9fa; \n\n}\n\n.messages[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\nbackground-color: #d3d3d3; \n\nborder-radius: 4px; \n\n}\n\n.messages[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\nbackground-color: #c0c0c0; \n\n}\n\n.messages[_ngcontent-%COMP%]::-webkit-scrollbar-track {\nbackground-color: #f8f9fa; \n\n}\n\n\n\n.new-chat-area[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between; \n\n    align-items: center; \n\n}\n.avatar[_ngcontent-%COMP%] {\n    max-height: 24px;\n    margin-right: 10px;\n    margin-left: 5px;\n    margin-bottom: 3px;\n    \n\n    margin-right: auto; \n\n}\n\n.conversation-item[_ngcontent-%COMP%] {\n    margin-left: 5px;\n    margin-right: 5px;\n    padding-top: 10px;\n    padding-bottom: 10px;\n    padding-left: 5px;\n    padding-right: 5px;\n    border-radius: 5px;\n    cursor: pointer;\n    overflow: hidden;\n    max-height: 150px;\n    font-size: 14px;\n\n    display: flex;\n    align-items: flex-start; \n\n\n    flex-wrap: wrap; \n\n}\n\n.text-container[_ngcontent-%COMP%] {\n    flex: 1; \n\n    display: flex;\n    flex-direction: column; \n\n}\n\n.text-container[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%] {\n    resize: none; \n\n    \n\n}\n\n.conversation-item[_ngcontent-%COMP%]    > .conversation-icon[_ngcontent-%COMP%] {\n    margin-top: 3px;\n}\n\n.conversation-item[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    display: inline-block;\n    white-space: pre-wrap;  \n\n    overflow: auto;\n    word-wrap: break-word;\n    margin-left: 3px;     \n\n}\n\n.conversation-item[_ngcontent-%COMP%]:hover {\n    background-color: rgba(0, 0, 0, 0.05);\n}\n.conversation-item-selected[_ngcontent-%COMP%] {\n    background-color: rgba(0, 0, 0, 0.15);\n}\n\n\n.conversation-item[_ngcontent-%COMP%]    > .conversation-icon[_ngcontent-%COMP%] {\n    margin-right: 11px;\n}\n.edit-conversation-panel[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: flex-end; \n\n    margin-top: 2px; \n\n    margin-right: 2px; \n\n}\n.edit-conversation-panel[_ngcontent-%COMP%]    > .k-icon[_ngcontent-%COMP%] {\n    margin-left: 5px;\n    cursor: pointer;\n}\n.edit-conversation-panel[_ngcontent-%COMP%]    > .k-icon[_ngcontent-%COMP%]:hover {\n    color: #ff0000;\n}\n\n\n\n.input-area[_ngcontent-%COMP%] {\n    min-height: 35px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-bottom: 15px;\n}\n\n.input-area[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%] {\n    vertical-align: top;\n    width: 30px;\n    height: 30px;\n    margin-top: 3px;\n    border-radius: 12px;\n}\n.input-area[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%]:first-of-type {\n    margin-left: -40px;\n}\n.input-area[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%]:last-child {\n    margin-left: -65px;\n}\n\n.text-area-wrapper[_ngcontent-%COMP%] {\n    padding: 3px;\n    border: solid 1px rgba(0, 0, 0, 0.08) ;\n    border-radius: 15px;\n\n    margin-top: 4px;\n    margin-right: -1px;\n    min-height: 42px;\n    max-height: 100%; \n\n\n    overflow: hidden;    \n    align-items: center;\n\n    \n\n    width: 710px;    \n    padding-right: 90px\n} \n.text-area-wrapper[_ngcontent-%COMP%]    > textarea[_ngcontent-%COMP%] {\n    border: 0;\n    outline: 0;\n    resize: none;\n\n    min-height: 20px; \n\n\n    width: 100%;\n    overflow-y: hidden; \n\n\n    font-family: S\u00F6hne, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Ubuntu, Cantarell, \"Noto Sans\", sans-serif, \"Helvetica Neue\", Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    font-size: 1rem;\n\n    margin-left: 7px;\n    margin-top: 7px;\n    margin-bottom: 5px;\n\n    background-color: #f9f9f9;\n}\n\n\n\n\n\n\n.input-wrapper[_ngcontent-%COMP%] {\n    flex-grow: 1; \n\n    height: 100%;\n}\n\n.waiting-for-ai[_ngcontent-%COMP%] {\n    position: absolute;\n    display: flex; \n\n    bottom: 100px;\n    z-index: 999;\n    left: 10px; \n}\n  \n.scroll-to-bottom-icon[_ngcontent-%COMP%] {\n    position: absolute;\n    bottom: 100px; \n\n    left: 50%; \n\n    transform: translateX(-50%); \n\n    z-index: 1000; \n\n    background-color: white; \n\n    color: black; \n\n    border-radius: 50%; \n\n    width: 40px; \n\n    height: 40px; \n\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    box-shadow: 0px 0px 5px rgba(0,0,0,0.3); \n\n    cursor: pointer;\n}\n\n@media (min-width: 600px) {\n    .welcome-suggested-questions[_ngcontent-%COMP%] {\n        display: flex;\n        flex-wrap: wrap; \n\n        align-content: flex-end; \n\n    }\n}"] });
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SkipChatComponent, [{
         type: Component,
-        args: [{ selector: 'skip-chat', template: "<div class = \"chat-container\" mjFillContainer #topLevelDiv [bottomMargin]=\"10\" [rightMargin]=\"10\">\n    <kendo-splitter orientation=\"horizontal\">\n        <kendo-splitter-pane *ngIf=\"ShowConversationList\" [collapsible]=\"true\" [scrollable]=\"false\" [resizable]=\"false\" size=\"272px\" (collapsedChange)=\"splitterCollapseStateChanged($event)\">\n            <div class=\"conversation-history\" *ngIf=\"ShowConversationList\">\n                <div class=\"new-chat-area\">\n                    <img [src]=\"SkipLogoURL\" class=\"avatar\" />\n                    <button kendoButton *ngIf=\"AllowNewConversations\" (click)=\"CreateNewConversation()\">+</button>\n                </div>\n                <kendo-listview\n                    class=\"conversation-list\"\n                    [data]=\"Conversations\"\n                    [style.height.px]=\"280\"\n                    [itemClass]=\"{ 'item-border': true }\" \n                    mjFillContainer \n                    [fillWidth]=\"false\"\n                    [bottomMargin]=\"20\"\n                    #conversationList\n                    >\n                    <ng-template kendoListViewItemTemplate let-dataItem=\"dataItem\">\n                        <div class=\"conversation-item\" \n                                [ngClass]=\"GetConversationItemClass(dataItem)\"\n                                [title]=\"dataItem.Name\" \n                                (click)=\"SelectConversation(dataItem)\"> \n                            <span *ngIf=\"SelectedConversation && IsSkipProcessing(dataItem)\" class=\"fa-regular fa-clock\"></span>\n                            <div class=\"text-container\">\n                                <span *ngIf=\"dataItem.ID !== SelectedConversation?.ID || !ConversationEditMode\">{{ dataItem.Name }}</span>\n                                <textarea *ngIf=\"dataItem.ID === SelectedConversation?.ID && ConversationEditMode\" [(ngModel)]=\"dataItem.Name\" maxlength=\"100\"></textarea>\n                            </div>\n                            <div *ngIf=\"SelectedConversation?.ID === dataItem.ID\" class=\"edit-conversation-panel\">\n                                <span *ngIf=\"!ConversationEditMode\" class=\"fa-solid fa-pen-to-square\" (click)=\"editConvo(dataItem)\"></span>\n                                <span *ngIf=\"!ConversationEditMode\" class=\"fa-regular fa-trash-can\" (click)=\"showDeleteConvoDialog(dataItem)\"></span>\n                                <span *ngIf=\"ConversationEditMode\" class=\"fa-solid fa-check\" (click)=\"saveConvoName(dataItem)\"></span>\n                                <span *ngIf=\"ConversationEditMode\" class=\"fa-solid fa-xmark\" (click)=\"cancelConvoEdit(dataItem)\"></span>\n                            </div>\n                        </div>\n                    </ng-template>\n                </kendo-listview>\n                <!-- COMMENTED OUT as we don't want to support embedded conversations in the UI for now\n                        <div class=\"embedded-conversations\"><input kendoCheckBox type=\"checkbox\" [(ngModel)]=\"IncludeLinkedConversationsInList\" (ngModelChange)=\"loadConversations()\"/> <span (click)=\"FlipEmbeddedConversationState()\">Show Linked Conversations</span></div> -->\n            </div>\n        </kendo-splitter-pane>\n        <kendo-splitter-pane>\n            <div class=\"conversation-wrapper\" mjFillContainer>\n                <div #AskSkipPanel class=\"messages\" #scrollContainer (scroll)=\"checkScroll()\">\n                    <div class=\"waiting-for-ai\" *ngIf=\"Messages && Messages.length > 0 && SelectedConversation && IsSkipProcessing(SelectedConversation)\">\n                        <!-- MOVED THIS TO INSIDE MESSAGE - REMOVE THIS ENTIRE DIV ---- <kendo-loader></kendo-loader> -->\n                    </div>\n                    <div class=\"welcome-wrapper\" *ngIf=\"(!Messages || Messages.length ===0) && _conversationLoadComplete\">\n                        <div class='welcome-message'>\n                            <img [src]=\"SkipLogoURL\" />\n                            <div class=\"welcome-header-text\">What can I help with today?</div>\n                        </div>\n                        <div class='welcome-suggested-questions'>\n                            <div class=\"welcome-suggested-questions-col\">\n                                <div class=\"welcome-question\" (click)=\"sendPrompt(WelcomeQuestions[0].prompt)\">\n                                    <span class=\"welcome-question-header\">{{WelcomeQuestions[0].topLine}}</span>\n                                    <span>{{WelcomeQuestions[0].bottomLine}}</span>\n                                </div>\n                                <div class=\"welcome-question\" (click)=\"sendPrompt(WelcomeQuestions[1].prompt)\">\n                                    <span class=\"welcome-question-header\">{{WelcomeQuestions[1].topLine}}</span>\n                                    <span>{{WelcomeQuestions[1].bottomLine}}</span>\n                                </div>    \n                            </div>\n                            <div class=\"welcome-suggested-questions-col\">\n                                <div class=\"welcome-question\" (click)=\"sendPrompt(WelcomeQuestions[2].prompt)\">\n                                    <span class=\"welcome-question-header\">{{WelcomeQuestions[2].topLine}}</span>\n                                    <span>{{WelcomeQuestions[2].bottomLine}}</span>\n                                </div>\n                                <div class=\"welcome-question\" (click)=\"sendPrompt(WelcomeQuestions[3].prompt)\">\n                                    <span class=\"welcome-question-header\">{{WelcomeQuestions[3].topLine}}</span>\n                                    <span>{{WelcomeQuestions[3].bottomLine}}</span>\n                                </div>    \n                            </div>\n                        </div>    \n                    </div>\n                    <div mjContainer mjSkipResize=\"true\"><!--mjSkipResize results in everything below this level NOT being resized, performance optimization-->\n                        <!-- Dynamic messages will be injected here -->\n                    </div>\n                    <span class=\"scroll-to-bottom-icon\" *ngIf=\"_showScrollToBottomIcon && Messages && Messages.length > 0\" (click)=\"scrollToBottomAnimate()\"><i class=\"fas fa-arrow-down\"></i></span>\n                </div>\n                <div class=\"input-area\">\n                    <div class=\"text-area-wrapper\">\n                        <textarea\n                            #AskSkipInput \n                            [disabled]=\"SelectedConversation && IsSkipProcessing(SelectedConversation)\" \n                            (keyup.enter)=\"onEnter($event)\" \n                            (input)=\"onInputChange($event)\"\n                            type=\"text\" \n                            placeholder=\"Ask Skip a question\"></textarea>\n                    </div>\n                    @if (ShowDataContextButton) {\n                        <button kendoButton >\n                            <span class=\"fa-solid fa-gear\" \n                                    (click)=\"showDataContext()\"></span>\n                        </button>    \n                    }\n                    <button kendoButton \n                            [disabled]=\"IsTextAreaEmpty() || (SelectedConversation !== undefined && IsSkipProcessing(SelectedConversation))\" \n                            (click)=\"sendSkipMessage()\">\n                            <span class=\"fas fa-solid fa-arrow-up\"></span>\n                    </button>\n                </div>\n            </div>\n        </kendo-splitter-pane>\n    </kendo-splitter>\n</div>     \n\n<div *ngIf=\"isDataContextDialogVisible\">\n    <mj-data-context-dialog [dataContextId]=\"DataContextID\" (dialogClosed)=\"closeDataContextDialog()\" [Provider]=\"ProviderToUse\"></mj-data-context-dialog>\n</div>\n\n\n<kendo-dialog\n    title=\"Please confirm\"\n    *ngIf=\"confirmDeleteConversationDialogOpen\"\n    (close)=\"closeDeleteConversation('no')\"\n    [minWidth]=\"250\"\n    [width]=\"450\"\n>\n    <p style=\"margin: 30px; text-align: center;\">\n        Would you like to delete {{SelectedConversation?.Name}}?\n    </p>\n    <kendo-dialog-actions>\n        <button kendoButton (click)=\"closeDeleteConversation('yes')\" themeColor=\"primary\">\n            Yes\n        </button>\n    <button kendoButton (click)=\"closeDeleteConversation('no')\">\n        No\n    </button>\n    </kendo-dialog-actions>\n</kendo-dialog>    ", styles: [".chat-container {\n    padding: 5px;\n    display: flex;\n    flex-direction: row;\n    height: 100%;\n    font-family: S\u00F6hne, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Ubuntu, Cantarell, \"Noto Sans\", sans-serif, \"Helvetica Neue\", Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    font-size: 1rem;\n\n    /*initial sizes*/\n    width: 100%;\n    height: 100%;\n\n    background-color: #f9f9f9;\n}\n\n.conversation-wrapper {\n    display: flex;\n    flex-direction: column;\n    position: relative; /* Add this line if the wrapper needs to be a reference point */\n    background-color: #f9f9f9;\n}\n\n.new-conversation {\n    height: 30px;\n    font-size: large;\n}\n\n.conversation-history {\n    width: 260px;\n    min-width: 260px;\n    height: 100%;\n    overflow-y: auto; /* Add scroll if the content exceeds the height */\n    margin-right: 10px;\n    padding-top: 5px;\n    background-color: #f9f9f9;\n    margin-top: 0px;  \n    padding: 12px;  \n}\n\n.k-tabstrip-content-for-skip {\n    padding: 0;\n    padding-block: 0;\n}\n\n\n.conversation-history > button {\n    height: 25px;\n}\n\n.skip-title {\n    font-size: larger;\n    margin-bottom: 5px;\n    height: 20px;\n    margin-top: 5px;\n}\n\n.conversation-list {\n    margin-top: 5px;\n    padding-top: 5px;\n    \n    border: 0;\n    background-color: #f9f9f9;\n}\n\n\n\n/* Center the welcome message vertically and horizontally */\n.welcome-wrapper {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n}\n\n.welcome-message {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    overflow: hidden;\n    height: 100%;\n}\n\n.embedded-conversations {\n    margin-left: 3px;\n    margin-top: 5px;\n    font-size: 10pt;\n    color: rgb(48, 48, 235);\n}\n.embedded-conversations > span {\n    margin-top: 4px;\n    margin-left: 5px;\n    cursor: pointer;\n}\n.conversation-item-linked {\n    color: rgb(48, 48, 235);\n}\n\n.welcome-message img {\n    width: 120px;\n    height: 50px;\n    margin-bottom: 20px; /* Adds some space between the image and the text below */\n}\n\n.welcome-header-text {\n    font-size: larger;\n    font-weight: bold;\n}\n\n/* Position the welcome-suggested-questions at the bottom of its container */\n.welcome-suggested-questions {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-content: center;\n}\n.welcome-suggested-questions-col {\n    display: flex;\n}\n\n/* Flex layout for questions, two per row */\n.welcome-question {\n    display: flex;\n    flex-direction: column; /* Stack the header and text vertically */\n    align-items: left;;\n    width: 300px;  \n    justify-content: space-between;\n    margin: 5px; /* Adds some space around each question */\n    border: solid 1px rgba(41, 28, 28, 0.08);\n    border-radius: 15px;\n    padding: 10px;\n    cursor: pointer;\n}\n\n.welcome-question:hover {\n    background-color: rgba(0, 0, 0, 0.05);\n}\n\n\n.welcome-question-header {\n    font-size: 12pt;\n    font-weight: bold;\n    display: block; /* Ensures the header is on its own line */\n}\n\n/* Non-bold text for the content below the header */\n.welcome-question span:not(.welcome-question-header) {\n    font-weight: normal;\n    font-size: 10pt;\n}\n\n\n.messages {\n    overflow-y: auto; /* enable scrolling if the content overflows */\n    overflow-x: hidden; /* hide horizontal scrollbar */\n    /* border: solid 1px rgba(0, 0, 0, 0.08); */\n    margin-bottom: 5px;\n\n    margin-top: 2px; /* align it with the top of converation history exactly*/\n\n    background-color: #f9f9f9;\n    flex: 1;\n}\n\n\n\n.new-chat-area {\n    display: flex;\n    justify-content: space-between; /* Aligns children (img and button) to each end */\n    align-items: center; /* Centers children vertically */\n}\n.avatar {\n    max-height: 24px;\n    margin-right: 10px;\n    margin-left: 5px;\n    margin-bottom: 3px;\n    /* Ensure the image aligns to the left */\n    margin-right: auto; /* Pushes everything else to the right */\n}\n\n.conversation-item {\n    margin-left: 5px;\n    margin-right: 5px;\n    padding-top: 10px;\n    padding-bottom: 10px;\n    padding-left: 5px;\n    padding-right: 5px;\n    border-radius: 5px;\n    cursor: pointer;\n    overflow: hidden;\n    max-height: 150px;\n    font-size: 14px;\n\n    display: flex;\n    align-items: flex-start; /* Align items to the top */\n\n    flex-wrap: wrap; /* Allow items to wrap to the next line */\n}\n\n.text-container {\n    flex: 1; /* Take up remaining space */\n    display: flex;\n    flex-direction: column; /* Stack children vertically */\n}\n\n.text-container textarea {\n    resize: none; /* Disable resizing */\n    /* Add more styles for the textarea if needed */\n}\n\n.conversation-item > .conversation-icon {\n    margin-top: 3px;\n}\n\n.conversation-item span {\n    display: inline-block;\n    white-space: pre-wrap;  /* Allow text to wrap */\n    overflow: auto;\n    word-wrap: break-word;\n    margin-left: 3px;     /* Move the text to the right */\n}\n\n.conversation-item:hover {\n    background-color: rgba(0, 0, 0, 0.05);\n}\n.conversation-item-selected {\n    background-color: rgba(0, 0, 0, 0.15);\n}\n\n\n.conversation-item > .conversation-icon {\n    margin-right: 11px;\n}\n.edit-conversation-panel {\n    display: flex;\n    justify-content: flex-end; /* Align icons to the right */\n    margin-top: 2px; /* litle buffer on top */\n    margin-right: 2px; /* litle buffer to the right */\n}\n.edit-conversation-panel > .k-icon {\n    margin-left: 5px;\n    cursor: pointer;\n}\n.edit-conversation-panel > .k-icon:hover {\n    color: #ff0000;\n}\n\n\n\n.input-area {\n    min-height: 35px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-bottom: 15px;\n}\n\n.input-area > button {\n    vertical-align: top;\n    width: 30px;\n    height: 30px;\n    margin-top: 3px;\n    border-radius: 12px;\n}\n.input-area > button:first-of-type {\n    margin-left: -40px;\n}\n.input-area > button:last-child {\n    margin-left: -65px;\n}\n\n.text-area-wrapper {\n    padding: 3px;\n    border: solid 1px rgba(0, 0, 0, 0.08) ;\n    border-radius: 15px;\n\n    margin-top: 4px;\n    margin-right: -1px;\n    min-height: 42px;\n    max-height: 100%; /* Prevent it from growing beyond the container */\n\n    overflow: hidden;    \n    align-items: center;\n\n    /*combined width and padding is 800*/\n    width: 710px;    \n    padding-right: 90px\n} \n.text-area-wrapper > textarea {\n    border: 0;\n    outline: 0;\n    resize: none;\n\n    min-height: 20px; /* Initial height */\n\n    width: 100%;\n    overflow-y: hidden; /* Hide scrollbar */\n\n    font-family: S\u00F6hne, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Ubuntu, Cantarell, \"Noto Sans\", sans-serif, \"Helvetica Neue\", Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    font-size: 1rem;\n\n    margin-left: 7px;\n    margin-top: 7px;\n    margin-bottom: 5px;\n\n    background-color: #f9f9f9;\n}\n\n.text-area-wrapper > textarea:disabled {\n    background-color: white;\n}\n\n.input-wrapper {\n    flex-grow: 1; /* This will make the input-wrapper take the remaining space */\n    height: 100%;\n}\n\n.waiting-for-ai {\n    position: absolute;\n    display: flex; /* Use flexbox layout */\n    bottom: 100px;\n    z-index: 999;\n    left: 10px; \n}\n  \n.scroll-to-bottom-icon {\n    position: absolute;\n    bottom: 100px; /* Adjust as needed to position away from the bottom edge */\n    left: 50%; /* Start at the exact horizontal center */\n    transform: translateX(-50%); /* Shift it back by half its width to center it */\n    z-index: 1000; /* Ensure it stays on top */\n    background-color: white; /* Circle background color - adjust as needed */\n    color: black; /* Icon color - adjust as needed */\n    border-radius: 50%; /* Makes the background a circle */\n    width: 40px; /* Circle size - adjust as needed */\n    height: 40px; /* Circle size - adjust as needed */\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    box-shadow: 0px 0px 5px rgba(0,0,0,0.3); /* Optional: Adds a subtle shadow for better visibility */\n    cursor: pointer;\n}\n\n@media (min-width: 600px) {\n    .welcome-suggested-questions {\n        display: flex;\n        flex-wrap: wrap; /* Allows questions to wrap to the next line */\n        align-content: flex-end; /* Aligns the content to the bottom */\n    }\n}\n  "] }]
+        args: [{ selector: 'skip-chat', template: "<div class = \"chat-container\" mjFillContainer #topLevelDiv [bottomMargin]=\"10\" [rightMargin]=\"10\">\n    <div class=\"layout\">\n        @if (IsConversationListVisible) {\n            <div class=\"left-panel\">\n                <div class=\"conversation-history\">\n                    <div class=\"new-chat-area\">\n                        <span class=\"fa-solid fa-table-columns toggle-icon\" (click)=\"DisplayConversationList(false)\"></span>\n                        @if (ShowSkipLogoInConversationList) {\n                            <img [src]=\"SkipLogoURL\" class=\"avatar\" />\n                        }\n                        @if (AllowNewConversations) {\n                            <span class=\"fa-solid fa-pen-to-square new-convo-icon\" (click)=\"CreateNewConversation()\"></span>                            \n                        }\n                    </div>\n                    <kendo-listview\n                        class=\"conversation-list\"\n                        [data]=\"Conversations\"\n                        [style.height.px]=\"280\"\n                        [itemClass]=\"{ 'item-border': true }\" \n                        mjFillContainer \n                        [fillWidth]=\"false\"\n                        [bottomMargin]=\"50\"\n                        #conversationList\n                        >\n                        <ng-template kendoListViewItemTemplate let-dataItem=\"dataItem\">\n                            <div class=\"conversation-item\" \n                                    [ngClass]=\"GetConversationItemClass(dataItem)\"\n                                    [title]=\"dataItem.Name\" \n                                    (click)=\"SelectConversation(dataItem)\"> \n                                <span *ngIf=\"SelectedConversation && IsSkipProcessing(dataItem)\" class=\"fa-regular fa-clock\"></span>\n                                <div class=\"text-container\">\n                                    <span *ngIf=\"dataItem.ID !== SelectedConversation?.ID || !ConversationEditMode\">{{ dataItem.Name }}</span>\n                                    <textarea *ngIf=\"dataItem.ID === SelectedConversation?.ID && ConversationEditMode\" [(ngModel)]=\"dataItem.Name\" maxlength=\"100\"></textarea>\n                                </div>\n                                <div *ngIf=\"SelectedConversation?.ID === dataItem.ID\" class=\"edit-conversation-panel\">\n                                    <span *ngIf=\"!ConversationEditMode\" class=\"fa-solid fa-pen-to-square\" (click)=\"editConvo(dataItem)\"></span>\n                                    <span *ngIf=\"!ConversationEditMode\" class=\"fa-regular fa-trash-can\" (click)=\"showDeleteConvoDialog(dataItem)\"></span>\n                                    <span *ngIf=\"ConversationEditMode\" class=\"fa-solid fa-check\" (click)=\"saveConvoName(dataItem)\"></span>\n                                    <span *ngIf=\"ConversationEditMode\" class=\"fa-solid fa-xmark\" (click)=\"cancelConvoEdit(dataItem)\"></span>\n                                </div>\n                            </div>\n                        </ng-template>\n                    </kendo-listview>\n                    <!-- COMMENTED OUT as we don't want to support embedded conversations in the UI for now\n                            <div class=\"embedded-conversations\"><input kendoCheckBox type=\"checkbox\" [(ngModel)]=\"IncludeLinkedConversationsInList\" (ngModelChange)=\"loadConversations()\"/> <span (click)=\"FlipEmbeddedConversationState()\">Show Linked Conversations</span></div> -->\n                </div>    \n            </div>\n        }\n        @if (!IsConversationListVisible) {\n            <span class=\"fa-solid fa-table-columns toggle-icon\" (click)=\"DisplayConversationList(true)\"></span>\n        }\n\n        <div class=\"right-panel\">\n            <div class=\"conversation-wrapper\" mjFillContainer>\n                <div #AskSkipPanel class=\"messages\" #scrollContainer (scroll)=\"checkScroll()\">\n                    <div class=\"waiting-for-ai\" *ngIf=\"Messages && Messages.length > 0 && SelectedConversation && IsSkipProcessing(SelectedConversation)\">\n                        <!-- MOVED THIS TO INSIDE MESSAGE - REMOVE THIS ENTIRE DIV ---- <kendo-loader></kendo-loader> -->\n                    </div>\n                    <div class=\"welcome-wrapper\" *ngIf=\"(!Messages || Messages.length ===0) && _conversationLoadComplete\">\n                        <div class='welcome-message'>\n                            <img [src]=\"SkipLogoURL\" />\n                            <div class=\"welcome-header-text\">What can I help with today?</div>\n                        </div>\n                        <div class='welcome-suggested-questions'>\n                            <div class=\"welcome-suggested-questions-col\">\n                                <div class=\"welcome-question\" (click)=\"sendPrompt(WelcomeQuestions[0].prompt)\">\n                                    <span class=\"welcome-question-header\">{{WelcomeQuestions[0].topLine}}</span>\n                                    <span>{{WelcomeQuestions[0].bottomLine}}</span>\n                                </div>\n                                <div class=\"welcome-question\" (click)=\"sendPrompt(WelcomeQuestions[1].prompt)\">\n                                    <span class=\"welcome-question-header\">{{WelcomeQuestions[1].topLine}}</span>\n                                    <span>{{WelcomeQuestions[1].bottomLine}}</span>\n                                </div>    \n                            </div>\n                            <div class=\"welcome-suggested-questions-col\">\n                                <div class=\"welcome-question\" (click)=\"sendPrompt(WelcomeQuestions[2].prompt)\">\n                                    <span class=\"welcome-question-header\">{{WelcomeQuestions[2].topLine}}</span>\n                                    <span>{{WelcomeQuestions[2].bottomLine}}</span>\n                                </div>\n                                <div class=\"welcome-question\" (click)=\"sendPrompt(WelcomeQuestions[3].prompt)\">\n                                    <span class=\"welcome-question-header\">{{WelcomeQuestions[3].topLine}}</span>\n                                    <span>{{WelcomeQuestions[3].bottomLine}}</span>\n                                </div>    \n                            </div>\n                        </div>    \n                    </div>\n                    <div mjContainer mjSkipResize=\"true\"><!--mjSkipResize results in everything below this level NOT being resized, performance optimization-->\n                        <!-- Dynamic messages will be injected here -->\n                    </div>\n                    <span class=\"scroll-to-bottom-icon\" *ngIf=\"_showScrollToBottomIcon && Messages && Messages.length > 0\" (click)=\"scrollToBottomAnimate()\"><i class=\"fas fa-arrow-down\"></i></span>\n                </div>\n                <div class=\"input-area\">\n                    <div class=\"text-area-wrapper\">\n                        <textarea\n                            #AskSkipInput \n                            [disabled]=\"SelectedConversation && IsSkipProcessing(SelectedConversation)\" \n                            (keyup.enter)=\"onEnter($event)\" \n                            (input)=\"onInputChange($event)\"\n                            type=\"text\" \n                            [placeholder]=\"_AskSkipTextboxPlaceholder\"></textarea>\n                    </div>\n                    @if (ShowDataContextButton) {\n                        <button kendoButton >\n                            <span class=\"fa-solid fa-gear\" \n                                    (click)=\"showDataContext()\"></span>\n                        </button>    \n                    }\n                    <button kendoButton \n                            [disabled]=\"IsTextAreaEmpty() || (SelectedConversation !== undefined && IsSkipProcessing(SelectedConversation))\" \n                            (click)=\"sendSkipMessage()\">\n                            <span class=\"fas fa-solid fa-arrow-up\"></span>\n                    </button>\n                </div>\n            </div>    \n        </div>\n    </div> \n</div>     \n\n<div *ngIf=\"isDataContextDialogVisible\">\n    <mj-data-context-dialog [dataContextId]=\"DataContextID\" (dialogClosed)=\"closeDataContextDialog()\" [Provider]=\"ProviderToUse\"></mj-data-context-dialog>\n</div>\n\n\n<kendo-dialog\n    title=\"Please confirm\"\n    *ngIf=\"confirmDeleteConversationDialogOpen\"\n    (close)=\"closeDeleteConversation('no')\"\n    [minWidth]=\"250\"\n    [width]=\"450\"\n>\n    <p style=\"margin: 30px; text-align: center;\">\n        Would you like to delete {{SelectedConversation?.Name}}?\n    </p>\n    <kendo-dialog-actions>\n        <button kendoButton (click)=\"closeDeleteConversation('yes')\" themeColor=\"primary\">\n            Yes\n        </button>\n    <button kendoButton (click)=\"closeDeleteConversation('no')\">\n        No\n    </button>\n    </kendo-dialog-actions>\n</kendo-dialog>    \n\n<kendo-dialog\n    title=\"Please confirm\"\n    *ngIf=\"confirmMessageEditOrDeleteDialogOpen\"\n    (close)=\"closeMessageEditOrDeleteDialog('no')\"\n    [minWidth]=\"250\"\n    [width]=\"450\"\n>\n    <p style=\"margin: 30px; text-align: center;\">\n        Would you like to {{messageEditOrDeleteType}} this message? Doing so will result in any subsequent messages in the conversation being deleted.\n    </p>\n    <kendo-dialog-actions>\n        <button kendoButton (click)=\"closeMessageEditOrDeleteDialog('yes')\" themeColor=\"primary\">\n            Yes\n        </button>\n    <button kendoButton (click)=\"closeMessageEditOrDeleteDialog('no')\">\n        No\n    </button>\n    </kendo-dialog-actions>\n</kendo-dialog>  ", styles: [".layout {\n    display: flex;\n    flex-direction: row; /* Ensures left and right panels are side by side */\n    height: 100%; /* Fill the available height */\n    width: 100%; /* Fill the available width */\n    position: relative;\n}\n\n.left-panel {\n    width: 272px; /* Fixed width for the conversation list */\n    background-color: #f8f9fa; /* Optional: Background color */\n    border-right: 1px solid #ddd; /* Optional: Add a divider */\n    overflow-y: auto; /* Enable scrolling if content overflows */\n    overflow-x: hidden; /* Hide horizontal scrollbar */\n    position: relative;\n\n    scrollbar-width: thin; /* For Firefox */\n    scrollbar-color: #d3d3d3 #f8f9fa; /* Thumb color and track color */\n}\n\n/* For WebKit-based browsers (Chrome, Edge, Safari) */\n.left-panel::-webkit-scrollbar {\n    width: 8px; /* Narrower scrollbar */\n    background-color: #f8f9fa; /* Scrollbar track color */\n}\n\n.left-panel::-webkit-scrollbar-thumb {\n    background-color: #d3d3d3; /* Lighter gray scrollbar thumb */\n    border-radius: 4px; /* Rounded corners for the thumb */\n}\n\n.left-panel::-webkit-scrollbar-thumb:hover {\n    background-color: #c0c0c0; /* Slightly darker gray on hover */\n}\n\n.left-panel::-webkit-scrollbar-track {\n    background-color: #f8f9fa; /* Background of the scrollbar track */\n}\n\n.right-panel {\n    flex: 1; /* Take up the remaining space */\n    overflow-y: auto; /* Enable scrolling for the conversation content */\n}\n\n\n.new-convo-icon {\n    color: #808080; /* Mid-gray */\n    font-size: 18px; /* Adjust icon size */\n    cursor: pointer; /* Make it clear the icon is clickable */\n    z-index: 10; /* Ensure the icon is above other content */\n    padding: 5px;\n    border-radius: 4px;\n}\n\n.toggle-icon {\n    color: #808080; /* Mid-gray */\n    font-size: 18px; /* Adjust icon size */\n    cursor: pointer; /* Make it clear the icon is clickable */\n    z-index: 10; /* Ensure the icon is above other content */\n    margin-left: 6px;\n    padding: 3px;\n    border-radius: 3px;\n}\n \n\n.right-panel .toggle-icon {\n    margin-left: 3px;\n    margin-top: 2px;\n    position: absolute;\n    top: 10px;\n    left: auto;\n    right: 10px; /* For the right panel toggle */\n}\n\n\n.chat-container {\n    padding: 5px;\n    display: flex;\n    flex-direction: row;\n    height: 100%;\n    font-family: S\u00F6hne, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Ubuntu, Cantarell, \"Noto Sans\", sans-serif, \"Helvetica Neue\", Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    font-size: 1rem;\n\n    /*initial sizes*/\n    width: 100%;\n    height: 100%;\n\n    background-color: #f9f9f9;\n}\n\n.conversation-wrapper {\n    display: flex;\n    flex-direction: column;\n    position: relative; /* Add this line if the wrapper needs to be a reference point */\n    background-color: #f9f9f9;\n}\n\n.new-conversation {\n    height: 30px;\n    font-size: large;\n}\n\n.conversation-history {\n    width: 240px;\n    min-width: 240px;\n    height: 95%;\n    overflow-y: auto; /* Add scroll if the content exceeds the height */\n    overflow-x: hidden; /* Hide horizontal scrollbar */\n    margin-right: 10px;\n    padding-top: 5px;\n    background-color: #f9f9f9;\n    margin-top: 0px;  \n    padding: 12px;  \n}\n\n.k-tabstrip-content-for-skip {\n    padding: 0;\n    padding-block: 0;\n}\n\n\n.conversation-history > button {\n    height: 25px;\n}\n\n.skip-title {\n    font-size: larger;\n    margin-bottom: 5px;\n    height: 20px;\n    margin-top: 5px;\n}\n\n.conversation-list {\n    margin-top: 5px;\n    padding-top: 5px;\n    \n    border: 0;\n    background-color: #f9f9f9;\n}\n\n\n\n/* Center the welcome message vertically and horizontally */\n.welcome-wrapper {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n}\n\n.welcome-message {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    overflow: hidden;\n    height: 100%;\n}\n\n.embedded-conversations {\n    margin-left: 3px;\n    margin-top: 5px;\n    font-size: 10pt;\n    color: rgb(48, 48, 235);\n}\n.embedded-conversations > span {\n    margin-top: 4px;\n    margin-left: 5px;\n    cursor: pointer;\n}\n.conversation-item-linked {\n    color: rgb(48, 48, 235);\n}\n\n.welcome-message img {\n    width: 120px;\n    height: 50px;\n    margin-bottom: 20px; /* Adds some space between the image and the text below */\n}\n\n.welcome-header-text {\n    font-size: larger;\n    font-weight: bold;\n}\n\n/* Position the welcome-suggested-questions at the bottom of its container */\n.welcome-suggested-questions {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-content: center;\n}\n.welcome-suggested-questions-col {\n    display: flex;\n}\n\n/* Flex layout for questions, two per row */\n.welcome-question {\n    display: flex;\n    flex-direction: column; /* Stack the header and text vertically */\n    align-items: left;;\n    width: 300px;  \n    justify-content: space-between;\n    margin: 5px; /* Adds some space around each question */\n    border: solid 1px rgba(41, 28, 28, 0.08);\n    border-radius: 15px;\n    padding: 10px;\n    cursor: pointer;\n}\n\n.welcome-question:hover {\n    background-color: rgba(0, 0, 0, 0.05);\n}\n\n\n.welcome-question-header {\n    font-size: 12pt;\n    font-weight: bold;\n    display: block; /* Ensures the header is on its own line */\n}\n\n/* Non-bold text for the content below the header */\n.welcome-question span:not(.welcome-question-header) {\n    font-weight: normal;\n    font-size: 10pt;\n}\n\n\n.messages {\n    overflow-y: auto; /* enable scrolling if the content overflows */\n    overflow-x: hidden; /* hide horizontal scrollbar */\n    /* border: solid 1px rgba(0, 0, 0, 0.08); */\n    margin-bottom: 5px;\n\n    margin-top: 2px; /* align it with the top of converation history exactly*/\n\n    background-color: #f9f9f9;\n    flex: 1;\n    scrollbar-width: thin; /* For Firefox */\n    scrollbar-color: #d3d3d3 #f8f9fa; /* Thumb color and track color */\n}\n\n/* For WebKit-based browsers (Chrome, Edge, Safari) */\n.messages::-webkit-scrollbar {\nwidth: 8px; /* Narrower scrollbar */\nbackground-color: #f8f9fa; /* Scrollbar track color */\n}\n\n.messages::-webkit-scrollbar-thumb {\nbackground-color: #d3d3d3; /* Lighter gray scrollbar thumb */\nborder-radius: 4px; /* Rounded corners for the thumb */\n}\n\n.messages::-webkit-scrollbar-thumb:hover {\nbackground-color: #c0c0c0; /* Slightly darker gray on hover */\n}\n\n.messages::-webkit-scrollbar-track {\nbackground-color: #f8f9fa; /* Background of the scrollbar track */\n}\n\n\n\n.new-chat-area {\n    display: flex;\n    justify-content: space-between; /* Aligns children (img and button) to each end */\n    align-items: center; /* Centers children vertically */\n}\n.avatar {\n    max-height: 24px;\n    margin-right: 10px;\n    margin-left: 5px;\n    margin-bottom: 3px;\n    /* Ensure the image aligns to the left */\n    margin-right: auto; /* Pushes everything else to the right */\n}\n\n.conversation-item {\n    margin-left: 5px;\n    margin-right: 5px;\n    padding-top: 10px;\n    padding-bottom: 10px;\n    padding-left: 5px;\n    padding-right: 5px;\n    border-radius: 5px;\n    cursor: pointer;\n    overflow: hidden;\n    max-height: 150px;\n    font-size: 14px;\n\n    display: flex;\n    align-items: flex-start; /* Align items to the top */\n\n    flex-wrap: wrap; /* Allow items to wrap to the next line */\n}\n\n.text-container {\n    flex: 1; /* Take up remaining space */\n    display: flex;\n    flex-direction: column; /* Stack children vertically */\n}\n\n.text-container textarea {\n    resize: none; /* Disable resizing */\n    /* Add more styles for the textarea if needed */\n}\n\n.conversation-item > .conversation-icon {\n    margin-top: 3px;\n}\n\n.conversation-item span {\n    display: inline-block;\n    white-space: pre-wrap;  /* Allow text to wrap */\n    overflow: auto;\n    word-wrap: break-word;\n    margin-left: 3px;     /* Move the text to the right */\n}\n\n.conversation-item:hover {\n    background-color: rgba(0, 0, 0, 0.05);\n}\n.conversation-item-selected {\n    background-color: rgba(0, 0, 0, 0.15);\n}\n\n\n.conversation-item > .conversation-icon {\n    margin-right: 11px;\n}\n.edit-conversation-panel {\n    display: flex;\n    justify-content: flex-end; /* Align icons to the right */\n    margin-top: 2px; /* litle buffer on top */\n    margin-right: 2px; /* litle buffer to the right */\n}\n.edit-conversation-panel > .k-icon {\n    margin-left: 5px;\n    cursor: pointer;\n}\n.edit-conversation-panel > .k-icon:hover {\n    color: #ff0000;\n}\n\n\n\n.input-area {\n    min-height: 35px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-bottom: 15px;\n}\n\n.input-area > button {\n    vertical-align: top;\n    width: 30px;\n    height: 30px;\n    margin-top: 3px;\n    border-radius: 12px;\n}\n.input-area > button:first-of-type {\n    margin-left: -40px;\n}\n.input-area > button:last-child {\n    margin-left: -65px;\n}\n\n.text-area-wrapper {\n    padding: 3px;\n    border: solid 1px rgba(0, 0, 0, 0.08) ;\n    border-radius: 15px;\n\n    margin-top: 4px;\n    margin-right: -1px;\n    min-height: 42px;\n    max-height: 100%; /* Prevent it from growing beyond the container */\n\n    overflow: hidden;    \n    align-items: center;\n\n    /*combined width and padding is 800*/\n    width: 710px;    \n    padding-right: 90px\n} \n.text-area-wrapper > textarea {\n    border: 0;\n    outline: 0;\n    resize: none;\n\n    min-height: 20px; /* Initial height */\n\n    width: 100%;\n    overflow-y: hidden; /* Hide scrollbar */\n\n    font-family: S\u00F6hne, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Ubuntu, Cantarell, \"Noto Sans\", sans-serif, \"Helvetica Neue\", Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    font-size: 1rem;\n\n    margin-left: 7px;\n    margin-top: 7px;\n    margin-bottom: 5px;\n\n    background-color: #f9f9f9;\n}\n\n/* .text-area-wrapper > textarea:disabled {\n    background-color: white;\n} */\n\n.input-wrapper {\n    flex-grow: 1; /* This will make the input-wrapper take the remaining space */\n    height: 100%;\n}\n\n.waiting-for-ai {\n    position: absolute;\n    display: flex; /* Use flexbox layout */\n    bottom: 100px;\n    z-index: 999;\n    left: 10px; \n}\n  \n.scroll-to-bottom-icon {\n    position: absolute;\n    bottom: 100px; /* Adjust as needed to position away from the bottom edge */\n    left: 50%; /* Start at the exact horizontal center */\n    transform: translateX(-50%); /* Shift it back by half its width to center it */\n    z-index: 1000; /* Ensure it stays on top */\n    background-color: white; /* Circle background color - adjust as needed */\n    color: black; /* Icon color - adjust as needed */\n    border-radius: 50%; /* Makes the background a circle */\n    width: 40px; /* Circle size - adjust as needed */\n    height: 40px; /* Circle size - adjust as needed */\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    box-shadow: 0px 0px 5px rgba(0,0,0,0.3); /* Optional: Adds a subtle shadow for better visibility */\n    cursor: pointer;\n}\n\n@media (min-width: 600px) {\n    .welcome-suggested-questions {\n        display: flex;\n        flex-wrap: wrap; /* Allows questions to wrap to the next line */\n        align-content: flex-end; /* Aligns the content to the bottom */\n    }\n}\n  "] }]
     }], () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.ActivatedRoute }, { type: i1.Router }, { type: i2.Location }, { type: i0.ChangeDetectorRef }, { type: i3.MJNotificationService }], { AllowSend: [{
             type: Input
         }], Messages: [{
@@ -1353,10 +1566,18 @@ SkipChatComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SkipChatC
             type: Input
         }], UpdateAppRoute: [{
             type: Input
+        }], ShowSkipLogoInConversationList: [{
+            type: Input
+        }], DefaultTextboxPlaceholder: [{
+            type: Input
+        }], ProcessingTextBoxPlaceholder: [{
+            type: Input
         }], NavigateToMatchingReport: [{
             type: Output
         }], ConversationSelected: [{
             type: Output
+        }], NewReportCreated: [{
+            type: Output
         }], askSkip: [{
             type: ViewChild,
             args: [Container, { static: true }]