@memberjunction/ng-conversations 2.113.2 → 2.114.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/dist/lib/components/conversation/conversation-chat-area.component.d.ts +7 -1
  2. package/dist/lib/components/conversation/conversation-chat-area.component.d.ts.map +1 -1
  3. package/dist/lib/components/conversation/conversation-chat-area.component.js +82 -29
  4. package/dist/lib/components/conversation/conversation-chat-area.component.js.map +1 -1
  5. package/dist/lib/components/conversation/conversation-empty-state.component.js +2 -2
  6. package/dist/lib/components/conversation/conversation-list.component.js +1 -1
  7. package/dist/lib/components/conversation/conversation-list.component.js.map +1 -1
  8. package/dist/lib/components/message/message-input-box.component.js +2 -2
  9. package/dist/lib/components/message/message-input.component.d.ts +7 -1
  10. package/dist/lib/components/message/message-input.component.d.ts.map +1 -1
  11. package/dist/lib/components/message/message-input.component.js +124 -36
  12. package/dist/lib/components/message/message-input.component.js.map +1 -1
  13. package/dist/lib/components/message/message-item.component.js +2 -2
  14. package/dist/lib/components/navigation/conversation-navigation.component.d.ts.map +1 -1
  15. package/dist/lib/components/navigation/conversation-navigation.component.js +3 -3
  16. package/dist/lib/components/navigation/conversation-navigation.component.js.map +1 -1
  17. package/dist/lib/components/tasks/tasks-dropdown.component.d.ts.map +1 -1
  18. package/dist/lib/components/tasks/tasks-dropdown.component.js +3 -3
  19. package/dist/lib/components/tasks/tasks-dropdown.component.js.map +1 -1
  20. package/dist/lib/components/workspace/conversation-workspace.component.d.ts +11 -0
  21. package/dist/lib/components/workspace/conversation-workspace.component.d.ts.map +1 -1
  22. package/dist/lib/components/workspace/conversation-workspace.component.js +134 -46
  23. package/dist/lib/components/workspace/conversation-workspace.component.js.map +1 -1
  24. package/package.json +14 -14
package/dist/lib/components/conversation/conversation-chat-area.component.d.ts CHANGED
@@ -74,7 +74,7 @@ export declare class ConversationChatAreaComponent implements OnInit, OnDestroy,
74
74
  artifactToShare: ArtifactEntity | null;
75
75
  private conversationDataCache;
76
76
  artifactsByDetailId: Map<string, LazyArtifactInfo[]>;
77
- private systemArtifactsByDetailId;
77
+ systemArtifactsByDetailId: Map<string, LazyArtifactInfo[]>;
78
78
  private _combinedArtifactsMap;
79
79
  agentRunsByDetailId: Map<string, AIAgentRunEntityExtended>;
80
80
  /**
@@ -316,6 +316,12 @@ export declare class ConversationChatAreaComponent implements OnInit, OnDestroy,
316
316
  onResizeStart(event: MouseEvent): void;
317
317
  private onResizeMove;
318
318
  private onResizeEnd;
319
+ /**
320
+ * Touch event handlers for mobile resize support
321
+ */
322
+ onResizeTouchStart(event: TouchEvent): void;
323
+ private onResizeTouchMove;
324
+ private onResizeTouchEnd;
319
325
  /**
320
326
  * LocalStorage persistence methods for artifact pane
321
327
  */
package/dist/lib/components/conversation/conversation-chat-area.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"conversation-chat-area.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/conversation/conversation-chat-area.component.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"conversation-chat-area.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/conversation/conversation-chat-area.component.ts"],"names":[],"mappings":"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"}
package/dist/lib/components/conversation/conversation-chat-area.component.js CHANGED
@@ -42,10 +42,10 @@ function ConversationChatAreaComponent_div_1_button_4_Template(rf, ctx) { if (rf
42
42
  i0.ɵɵadvance(3);
43
43
  i0.ɵɵtextInterpolate(conversation_r4.Project || "Project");
44
44
  } }
45
- function ConversationChatAreaComponent_div_1_button_9_Template(rf, ctx) { if (rf & 1) {
45
+ function ConversationChatAreaComponent_div_1_button_11_Template(rf, ctx) { if (rf & 1) {
46
46
  const _r5 = i0.ɵɵgetCurrentView();
47
47
  i0.ɵɵelementStart(0, "button", 30);
48
- i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_button_9_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.viewArtifacts()); });
48
+ i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_button_11_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.viewArtifacts()); });
49
49
  i0.ɵɵelement(1, "i", 31);
50
50
  i0.ɵɵelementStart(2, "span");
51
51
  i0.ɵɵtext(3);
@@ -61,25 +61,28 @@ function ConversationChatAreaComponent_div_1_Template(rf, ctx) { if (rf & 1) {
61
61
  i0.ɵɵtext(3);
62
62
  i0.ɵɵelementEnd();
63
63
  i0.ɵɵtemplate(4, ConversationChatAreaComponent_div_1_button_4_Template, 4, 1, "button", 18);
64
- i0.ɵɵelementStart(5, "button", 19);
65
- i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.toggleMembersModal()); });
66
- i0.ɵɵelement(6, "i", 20);
67
- i0.ɵɵelementStart(7, "span");
68
- i0.ɵɵtext(8);
64
+ i0.ɵɵelementStart(5, "mj-active-agent-indicator", 19);
65
+ i0.ɵɵlistener("togglePanel", function ConversationChatAreaComponent_div_1_Template_mj_active_agent_indicator_togglePanel_5_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onToggleAgentPanel()); })("agentSelected", function ConversationChatAreaComponent_div_1_Template_mj_active_agent_indicator_agentSelected_5_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onAgentSelected($event)); });
69
66
  i0.ɵɵelementEnd()();
70
- i0.ɵɵtemplate(9, ConversationChatAreaComponent_div_1_button_9_Template, 4, 2, "button", 21);
71
- i0.ɵɵelementStart(10, "mj-active-agent-indicator", 22);
72
- i0.ɵɵlistener("togglePanel", function ConversationChatAreaComponent_div_1_Template_mj_active_agent_indicator_togglePanel_10_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onToggleAgentPanel()); })("agentSelected", function ConversationChatAreaComponent_div_1_Template_mj_active_agent_indicator_agentSelected_10_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onAgentSelected($event)); });
67
+ i0.ɵɵelementStart(6, "div", 20)(7, "button", 21);
68
+ i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.toggleMembersModal()); });
69
+ i0.ɵɵelement(8, "i", 22);
70
+ i0.ɵɵelementStart(9, "span");
71
+ i0.ɵɵtext(10);
73
72
  i0.ɵɵelementEnd()();
74
- i0.ɵɵelementStart(11, "div", 23)(12, "button", 24);
75
- i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.exportConversation()); });
76
- i0.ɵɵelement(13, "i", 25);
77
- i0.ɵɵtext(14, " Export ");
73
+ i0.ɵɵtemplate(11, ConversationChatAreaComponent_div_1_button_11_Template, 4, 2, "button", 23);
74
+ i0.ɵɵelementStart(12, "mj-active-agent-indicator", 19);
75
+ i0.ɵɵlistener("togglePanel", function ConversationChatAreaComponent_div_1_Template_mj_active_agent_indicator_togglePanel_12_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onToggleAgentPanel()); })("agentSelected", function ConversationChatAreaComponent_div_1_Template_mj_active_agent_indicator_agentSelected_12_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onAgentSelected($event)); });
76
+ i0.ɵɵelementEnd()();
77
+ i0.ɵɵelementStart(13, "div", 20)(14, "button", 24);
78
+ i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.exportConversation()); });
79
+ i0.ɵɵelement(15, "i", 25);
80
+ i0.ɵɵtext(16, " Export ");
78
81
  i0.ɵɵelementEnd();
79
- i0.ɵɵelementStart(15, "button", 26);
80
- i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_Template_button_click_15_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.shareConversation()); });
81
- i0.ɵɵelement(16, "i", 27);
82
- i0.ɵɵtext(17, " Share ");
82
+ i0.ɵɵelementStart(17, "button", 26);
83
+ i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.shareConversation()); });
84
+ i0.ɵɵelement(18, "i", 27);
85
+ i0.ɵɵtext(19, " Share ");
83
86
  i0.ɵɵelementEnd()()();
84
87
  } if (rf & 2) {
85
88
  const conversation_r4 = ctx.ngIf;
@@ -88,7 +91,9 @@ function ConversationChatAreaComponent_div_1_Template(rf, ctx) { if (rf & 1) {
88
91
  i0.ɵɵtextInterpolate(conversation_r4.Name);
89
92
  i0.ɵɵadvance();
90
93
  i0.ɵɵproperty("ngIf", conversation_r4.ProjectID);
91
- i0.ɵɵadvance(4);
94
+ i0.ɵɵadvance();
95
+ i0.ɵɵproperty("conversationId", ctx_r2.conversationState.activeConversation.ID)("currentUser", ctx_r2.currentUser);
96
+ i0.ɵɵadvance(5);
92
97
  i0.ɵɵtextInterpolate2("", ctx_r2.memberCount, " member", ctx_r2.memberCount !== 1 ? "s" : "", "");
93
98
  i0.ɵɵadvance();
94
99
  i0.ɵɵproperty("ngIf", ctx_r2.artifactCountDisplay > 0);
@@ -136,11 +141,11 @@ function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Templat
136
141
  } if (rf & 2) {
137
142
  const inputRef_r10 = ctx.$implicit;
138
143
  const ctx_r2 = i0.ɵɵnextContext(3);
139
- i0.ɵɵproperty("hidden", inputRef_r10.conversationId !== ctx_r2.conversationState.activeConversation.ID)("conversationId", inputRef_r10.conversationId)("conversationName", inputRef_r10.conversationName)("currentUser", ctx_r2.currentUser)("conversationHistory", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.messages : i0.ɵɵpureFunction0(10, _c2))("artifactsByDetailId", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.artifactsByDetailId : ctx_r2.emptyArtifactsMap)("agentRunsByDetailId", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.agentRunsByDetailId : ctx_r2.emptyAgentRunsMap)("inProgressMessageIds", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.inProgressMessageIds : ctx_r2.emptyInProgressIds)("disabled", ctx_r2.isProcessing)("initialMessage", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.conversationState.pendingMessageToSend : null);
144
+ i0.ɵɵproperty("hidden", inputRef_r10.conversationId !== ctx_r2.conversationState.activeConversation.ID)("conversationId", inputRef_r10.conversationId)("conversationName", inputRef_r10.conversationName)("currentUser", ctx_r2.currentUser)("conversationHistory", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.messages : i0.ɵɵpureFunction0(11, _c2))("artifactsByDetailId", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.artifactsByDetailId : ctx_r2.emptyArtifactsMap)("systemArtifactsByDetailId", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.systemArtifactsByDetailId : ctx_r2.emptyArtifactsMap)("agentRunsByDetailId", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.agentRunsByDetailId : ctx_r2.emptyAgentRunsMap)("inProgressMessageIds", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.inProgressMessageIds : ctx_r2.emptyInProgressIds)("disabled", ctx_r2.isProcessing)("initialMessage", inputRef_r10.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.conversationState.pendingMessageToSend : null);
140
145
  } }
141
146
  function ConversationChatAreaComponent_Conditional_6_Conditional_7_Template(rf, ctx) { if (rf & 1) {
142
147
  i0.ɵɵelementStart(0, "div", 40);
143
- i0.ɵɵrepeaterCreate(1, ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template, 2, 11, "mj-message-input", 44, _forTrack0);
148
+ i0.ɵɵrepeaterCreate(1, ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template, 2, 12, "mj-message-input", 44, _forTrack0);
144
149
  i0.ɵɵelementEnd();
145
150
  } if (rf & 2) {
146
151
  const ctx_r2 = i0.ɵɵnextContext(2);
@@ -171,7 +176,7 @@ function ConversationChatAreaComponent_Conditional_6_Template(rf, ctx) { if (rf
171
176
  function ConversationChatAreaComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
172
177
  const _r11 = i0.ɵɵgetCurrentView();
173
178
  i0.ɵɵelementStart(0, "div", 46);
174
- i0.ɵɵlistener("mousedown", function ConversationChatAreaComponent_Conditional_7_Template_div_mousedown_0_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onResizeStart($event)); });
179
+ i0.ɵɵlistener("mousedown", function ConversationChatAreaComponent_Conditional_7_Template_div_mousedown_0_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onResizeStart($event)); })("touchstart", function ConversationChatAreaComponent_Conditional_7_Template_div_touchstart_0_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onResizeTouchStart($event)); });
175
180
  i0.ɵɵelementEnd();
176
181
  i0.ɵɵelementStart(1, "div", 47)(2, "mj-artifact-viewer-panel", 48);
177
182
  i0.ɵɵlistener("closed", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_closed_2_listener() { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onCloseArtifactPanel()); })("saveToCollectionRequested", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_saveToCollectionRequested_2_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onSaveToCollectionRequested($event)); })("navigateToLink", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_navigateToLink_2_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onArtifactLinkNavigation($event)); })("shareRequested", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_shareRequested_2_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onArtifactShareRequested($event)); });
@@ -410,6 +415,7 @@ export class ConversationChatAreaComponent {
410
415
  artifactsByDetailId = new Map();
411
416
  // System artifacts mapping: ConversationDetailID -> Array of LazyArtifactInfo (Visibility='System Only')
412
417
  // Kept separate so we can toggle their display without reloading
418
+ // Made public so it can be passed to MessageInputComponent for payload loading
413
419
  systemArtifactsByDetailId = new Map();
414
420
  // Cached combined artifacts map - updated when toggle changes
415
421
  _combinedArtifactsMap = null;
@@ -471,6 +477,8 @@ export class ConversationChatAreaComponent {
471
477
  // Setup resize listeners
472
478
  window.addEventListener('mousemove', this.onResizeMove.bind(this));
473
479
  window.addEventListener('mouseup', this.onResizeEnd.bind(this));
480
+ window.addEventListener('touchmove', this.onResizeTouchMove.bind(this));
481
+ window.addEventListener('touchend', this.onResizeTouchEnd.bind(this));
474
482
  }
475
483
  ngDoCheck() {
476
484
  // Don't process conversation changes until initialization is complete
@@ -507,9 +515,13 @@ export class ConversationChatAreaComponent {
507
515
  // Remove resize listeners
508
516
  window.removeEventListener('mousemove', this.onResizeMove.bind(this));
509
517
  window.removeEventListener('mouseup', this.onResizeEnd.bind(this));
518
+ window.removeEventListener('touchmove', this.onResizeTouchMove.bind(this));
519
+ window.removeEventListener('touchend', this.onResizeTouchEnd.bind(this));
510
520
  }
511
521
  async onConversationChanged(conversationId) {
512
- this.activeTasks.clear();
522
+ // Do NOT clear activeTasks here - they are workspace-level and should persist across conversation switches
523
+ // Tasks will be automatically removed when agents complete (via markMessageComplete in MessageInputComponent)
524
+ // Clearing here causes bugs: global tasks panel blanks out, no notifications when switching, spinners disappear
513
525
  // Hide artifact panel when conversation changes
514
526
  this.showArtifactPanel = false;
515
527
  this.selectedArtifactId = null;
@@ -1017,14 +1029,28 @@ export class ConversationChatAreaComponent {
1017
1029
  const parsed = parseConversationDetailComplete(row);
1018
1030
  // Clear existing artifacts for this detail and rebuild
1019
1031
  this.artifactsByDetailId.delete(conversationDetailId);
1032
+ this.systemArtifactsByDetailId.delete(conversationDetailId);
1020
1033
  if (parsed.artifacts.length > 0) {
1021
1034
  const artifactList = [];
1035
+ const systemArtifactList = [];
1022
1036
  for (const artifactData of parsed.artifacts) {
1023
1037
  const lazyInfo = new LazyArtifactInfo(artifactData, this.currentUser);
1024
- artifactList.push(lazyInfo);
1038
+ // Separate system-only artifacts from user-visible artifacts
1039
+ if (artifactData.Visibility === 'System Only') {
1040
+ systemArtifactList.push(lazyInfo);
1041
+ }
1042
+ else {
1043
+ artifactList.push(lazyInfo);
1044
+ }
1025
1045
  LogStatusEx({ message: `✅ Loaded artifact ${artifactData.ArtifactID} v${artifactData.VersionNumber} for message ${conversationDetailId}`, verboseOnly: true });
1026
1046
  }
1027
- this.artifactsByDetailId.set(conversationDetailId, artifactList);
1047
+ // Add to appropriate maps
1048
+ if (artifactList.length > 0) {
1049
+ this.artifactsByDetailId.set(conversationDetailId, artifactList);
1050
+ }
1051
+ if (systemArtifactList.length > 0) {
1052
+ this.systemArtifactsByDetailId.set(conversationDetailId, systemArtifactList);
1053
+ }
1028
1054
  }
1029
1055
  // Create new Map reference to trigger Angular change detection
1030
1056
  this.artifactsByDetailId = new Map(this.artifactsByDetailId);
@@ -1419,6 +1445,33 @@ export class ConversationChatAreaComponent {
1419
1445
  this.saveArtifactPaneWidth();
1420
1446
  }
1421
1447
  }
1448
+ /**
1449
+ * Touch event handlers for mobile resize support
1450
+ */
1451
+ onResizeTouchStart(event) {
1452
+ this.isResizing = true;
1453
+ const touch = event.touches[0];
1454
+ this.startX = touch.clientX;
1455
+ this.startWidth = this.artifactPaneWidth;
1456
+ event.preventDefault();
1457
+ }
1458
+ onResizeTouchMove(event) {
1459
+ if (!this.isResizing)
1460
+ return;
1461
+ const touch = event.touches[0];
1462
+ const containerWidth = window.innerWidth;
1463
+ const deltaX = this.startX - touch.clientX;
1464
+ const deltaPercent = (deltaX / containerWidth) * 100;
1465
+ let newWidth = this.startWidth + deltaPercent;
1466
+ newWidth = Math.max(20, Math.min(70, newWidth));
1467
+ this.artifactPaneWidth = newWidth;
1468
+ }
1469
+ onResizeTouchEnd(event) {
1470
+ if (this.isResizing) {
1471
+ this.isResizing = false;
1472
+ this.saveArtifactPaneWidth();
1473
+ }
1474
+ }
1422
1475
  /**
1423
1476
  * LocalStorage persistence methods for artifact pane
1424
1477
  */
@@ -1727,9 +1780,9 @@ export class ConversationChatAreaComponent {
1727
1780
  i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.scrollContainer = _t.first);
1728
1781
  i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.messageInputComponent = _t.first);
1729
1782
  i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.artifactViewerComponent = _t.first);
1730
- } }, inputs: { environmentId: "environmentId", currentUser: "currentUser" }, outputs: { conversationRenamed: "conversationRenamed", openEntityRecord: "openEntityRecord", taskClicked: "taskClicked", artifactLinkClicked: "artifactLinkClicked" }, decls: 15, vars: 18, consts: [["scrollContainer", ""], ["messageInput", ""], [1, "chat-area"], ["class", "chat-header", 4, "ngIf"], [1, "chat-content-area"], [1, "chat-messages-pane"], [3, "currentUser", "disabled"], [1, "conversation-loading-state"], [1, "chat-messages-wrapper"], [3, "saved", "cancelled", "isOpen", "artifact", "currentUser"], [3, "parentMessageId", "conversationId", "currentUser"], [3, "cancelled", "exported", "isVisible", "conversation", "currentUser"], [3, "cancelled", "membersChanged", "isVisible", "conversation", "currentUser"], [1, "modal-overlay"], [3, "isOpen", "environmentId", "currentUser", "excludeCollectionIds"], [1, "chat-header"], [1, "chat-info"], [1, "chat-title"], ["class", "project-tag", "title", "Assign to project", 3, "click", 4, "ngIf"], ["title", "View members", 1, "chat-members", 3, "click"], [1, "fas", "fa-users"], ["class", "artifact-indicator", "title", "View artifacts", 3, "click", 4, "ngIf"], [3, "togglePanel", "agentSelected", "conversationId", "currentUser"], [1, "chat-actions"], ["title", "Export conversation", 1, "action-btn", 3, "click"], [1, "fas", "fa-download"], [1, "action-btn", "share-btn", 3, "click", "title"], [1, "fas", "fa-share-nodes"], ["title", "Assign to project", 1, "project-tag", 3, "click"], [1, "fas", "fa-folder"], ["title", "View artifacts", 1, "artifact-indicator", 3, "click"], [1, "fas", "fa-cube"], [3, "messageSent", "currentUser", "disabled"], [1, "loading-content"], [1, "fas", "fa-spinner", "fa-spin"], [1, "chat-messages-container", 3, "scroll"], [3, "replyInThread", "viewThread", "retryMessage", "artifactClicked", "messageEdited", "openEntityRecord", "suggestedResponseSelected", "messages", "conversation", "currentUser", "isProcessing", "artifactMap", "agentRunMap", "ratingsMap", "userAvatarMap"], ["class", "scroll-to-bottom-icon", "style", "left: 50%;", 3, "click", 4, "ngIf"], [1, "chat-input-container"], [1, "loading-peripheral-placeholder"], [1, "message-input-container-wrapper"], [1, "scroll-to-bottom-icon", 2, "left", "50%", 3, "click"], [1, "fas", "fa-arrow-down"], [1, "loading-peripheral-content"], [3, "hidden", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "agentRunsByDetailId", "inProgressMessageIds", "disabled", "initialMessage"], [3, "messageSent", "agentResponse", "agentRunDetected", "agentRunUpdate", "messageComplete", "artifactCreated", "conversationRenamed", "intentCheckStarted", "intentCheckCompleted", "hidden", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "agentRunsByDetailId", "inProgressMessageIds", "disabled", "initialMessage"], [1, "resize-handle", 3, "mousedown"], [1, "chat-artifact-pane"], [3, "closed", "saveToCollectionRequested", "navigateToLink", "shareRequested", "artifactId", "currentUser", "environmentId", "versionNumber", "viewContext", "canShare", "canEdit", "refreshTrigger"], [3, "closed", "replyAdded", "parentMessageId", "conversationId", "currentUser"], [1, "modal-overlay", 3, "click"], [1, "modal-content", "project-selector-modal", 3, "click"], [1, "modal-header"], [1, "modal-close-btn", 3, "click"], [1, "fas", "fa-times"], [1, "modal-body"], [3, "projectSelected", "environmentId", "currentUser", "selectedProjectId"], [1, "modal-content", "artifacts-modal", 3, "click"], [1, "modal-header-actions"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "active"], [1, "modal-body", "artifacts-grid"], [1, "empty-state"], [1, "artifact-modal-card", 3, "expanded", "system-artifact"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "click"], [1, "fas", "fa-cog"], [1, "fas", "fa-cube", 2, "font-size", "48px", "color", "#D1D5DB", "margin-bottom", "16px"], [2, "color", "#6B7280", "font-size", "14px"], [1, "artifact-modal-card"], [1, "artifact-card-header", 3, "click"], [1, "artifact-modal-icon"], [1, "fas", "fa-file-code"], [1, "artifact-modal-info"], [1, "artifact-modal-title"], [1, "artifact-modal-meta"], [1, "expand-btn"], [1, "artifact-modal-action"], [1, "fas", "fa-external-link-alt"], [1, "artifact-versions-list"], [1, "expand-btn", 3, "click"], [1, "fas"], [1, "artifact-version-item"], [1, "artifact-version-item", 3, "click"], [1, "version-badge"], [1, "version-open-text"], [1, "fas", "fa-arrow-right"], [3, "saved", "cancelled", "isOpen", "environmentId", "currentUser", "excludeCollectionIds"]], template: function ConversationChatAreaComponent_Template(rf, ctx) { if (rf & 1) {
1783
+ } }, inputs: { environmentId: "environmentId", currentUser: "currentUser" }, outputs: { conversationRenamed: "conversationRenamed", openEntityRecord: "openEntityRecord", taskClicked: "taskClicked", artifactLinkClicked: "artifactLinkClicked" }, decls: 15, vars: 18, consts: [["scrollContainer", ""], ["messageInput", ""], [1, "chat-area"], ["class", "chat-header", 4, "ngIf"], [1, "chat-content-area"], [1, "chat-messages-pane"], [3, "currentUser", "disabled"], [1, "conversation-loading-state"], [1, "chat-messages-wrapper"], [3, "saved", "cancelled", "isOpen", "artifact", "currentUser"], [3, "parentMessageId", "conversationId", "currentUser"], [3, "cancelled", "exported", "isVisible", "conversation", "currentUser"], [3, "cancelled", "membersChanged", "isVisible", "conversation", "currentUser"], [1, "modal-overlay"], [3, "isOpen", "environmentId", "currentUser", "excludeCollectionIds"], [1, "chat-header"], [1, "chat-info"], [1, "chat-title"], ["class", "project-tag", "title", "Assign to project", 3, "click", 4, "ngIf"], [3, "togglePanel", "agentSelected", "conversationId", "currentUser"], [1, "chat-actions"], ["title", "View members", 1, "chat-members", 3, "click"], [1, "fas", "fa-users"], ["class", "artifact-indicator", "title", "View artifacts", 3, "click", 4, "ngIf"], ["title", "Export conversation", 1, "action-btn", 3, "click"], [1, "fas", "fa-download"], [1, "action-btn", "share-btn", 3, "click", "title"], [1, "fas", "fa-share-nodes"], ["title", "Assign to project", 1, "project-tag", 3, "click"], [1, "fas", "fa-folder"], ["title", "View artifacts", 1, "artifact-indicator", 3, "click"], [1, "fas", "fa-cube"], [3, "messageSent", "currentUser", "disabled"], [1, "loading-content"], [1, "fas", "fa-spinner", "fa-spin"], [1, "chat-messages-container", 3, "scroll"], [3, "replyInThread", "viewThread", "retryMessage", "artifactClicked", "messageEdited", "openEntityRecord", "suggestedResponseSelected", "messages", "conversation", "currentUser", "isProcessing", "artifactMap", "agentRunMap", "ratingsMap", "userAvatarMap"], ["class", "scroll-to-bottom-icon", "style", "left: 50%;", 3, "click", 4, "ngIf"], [1, "chat-input-container"], [1, "loading-peripheral-placeholder"], [1, "message-input-container-wrapper"], [1, "scroll-to-bottom-icon", 2, "left", "50%", 3, "click"], [1, "fas", "fa-arrow-down"], [1, "loading-peripheral-content"], [3, "hidden", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "systemArtifactsByDetailId", "agentRunsByDetailId", "inProgressMessageIds", "disabled", "initialMessage"], [3, "messageSent", "agentResponse", "agentRunDetected", "agentRunUpdate", "messageComplete", "artifactCreated", "conversationRenamed", "intentCheckStarted", "intentCheckCompleted", "hidden", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "systemArtifactsByDetailId", "agentRunsByDetailId", "inProgressMessageIds", "disabled", "initialMessage"], [1, "resize-handle", 3, "mousedown", "touchstart"], [1, "chat-artifact-pane"], [3, "closed", "saveToCollectionRequested", "navigateToLink", "shareRequested", "artifactId", "currentUser", "environmentId", "versionNumber", "viewContext", "canShare", "canEdit", "refreshTrigger"], [3, "closed", "replyAdded", "parentMessageId", "conversationId", "currentUser"], [1, "modal-overlay", 3, "click"], [1, "modal-content", "project-selector-modal", 3, "click"], [1, "modal-header"], [1, "modal-close-btn", 3, "click"], [1, "fas", "fa-times"], [1, "modal-body"], [3, "projectSelected", "environmentId", "currentUser", "selectedProjectId"], [1, "modal-content", "artifacts-modal", 3, "click"], [1, "modal-header-actions"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "active"], [1, "modal-body", "artifacts-grid"], [1, "empty-state"], [1, "artifact-modal-card", 3, "expanded", "system-artifact"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "click"], [1, "fas", "fa-cog"], [1, "fas", "fa-cube", 2, "font-size", "48px", "color", "#D1D5DB", "margin-bottom", "16px"], [2, "color", "#6B7280", "font-size", "14px"], [1, "artifact-modal-card"], [1, "artifact-card-header", 3, "click"], [1, "artifact-modal-icon"], [1, "fas", "fa-file-code"], [1, "artifact-modal-info"], [1, "artifact-modal-title"], [1, "artifact-modal-meta"], [1, "expand-btn"], [1, "artifact-modal-action"], [1, "fas", "fa-external-link-alt"], [1, "artifact-versions-list"], [1, "expand-btn", 3, "click"], [1, "fas"], [1, "artifact-version-item"], [1, "artifact-version-item", 3, "click"], [1, "version-badge"], [1, "version-open-text"], [1, "fas", "fa-arrow-right"], [3, "saved", "cancelled", "isOpen", "environmentId", "currentUser", "excludeCollectionIds"]], template: function ConversationChatAreaComponent_Template(rf, ctx) { if (rf & 1) {
1731
1784
  i0.ɵɵelementStart(0, "div", 2);
1732
- i0.ɵɵtemplate(1, ConversationChatAreaComponent_div_1_Template, 18, 10, "div", 3);
1785
+ i0.ɵɵtemplate(1, ConversationChatAreaComponent_div_1_Template, 20, 12, "div", 3);
1733
1786
  i0.ɵɵelementStart(2, "div", 4)(3, "div", 5);
1734
1787
  i0.ɵɵtemplate(4, ConversationChatAreaComponent_Conditional_4_Template, 1, 2, "mj-conversation-empty-state", 6)(5, ConversationChatAreaComponent_Conditional_5_Template, 5, 0, "div", 7)(6, ConversationChatAreaComponent_Conditional_6_Template, 8, 10, "div", 8);
1735
1788
  i0.ɵɵelementEnd();
@@ -1768,11 +1821,11 @@ export class ConversationChatAreaComponent {
1768
1821
  i0.ɵɵconditional(ctx.showArtifactsModal ? 13 : -1);
1769
1822
  i0.ɵɵadvance();
1770
1823
  i0.ɵɵconditional(ctx.showCollectionPicker ? 14 : -1);
1771
- } }, dependencies: [i7.NgIf, i8.ArtifactViewerPanelComponent, i9.ArtifactCollectionPickerModalComponent, i10.ArtifactShareModalComponent, i11.MessageListComponent, i12.MessageInputComponent, i13.ConversationEmptyStateComponent, i14.ThreadPanelComponent, i15.ProjectSelectorComponent, i16.ActiveAgentIndicatorComponent, i17.MembersModalComponent, i18.ExportModalComponent], styles: ["[_nghost-%COMP%] {\n display: flex;\n width: 100%;\n height: 100%;\n}\n.chat-area[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n.chat-header[_ngcontent-%COMP%] {\n flex-shrink: 0;\n padding: 12px 20px;\n border-bottom: 1px solid #D9D9D9;\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 16px;\n background: #FFF;\n z-index: 10;\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n}\n.chat-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n flex: 1;\n min-width: 0;\n}\n.chat-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #333;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.project-tag[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 4px 10px;\n background: #F4F4F4;\n border: 1px solid #D9D9D9;\n border-radius: 16px;\n font-size: 11px;\n font-weight: 600;\n color: #AAA;\n cursor: pointer;\n transition: all 0.2s;\n height: 28px;\n margin-left: 12px;\n}\n.project-tag[_ngcontent-%COMP%]:hover {\n background: #D9D9D9;\n border-color: #AAA;\n}\n.project-tag[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 10px;\n}\n.chat-members[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 6px 12px;\n background: #F4F4F4;\n border: none;\n border-radius: 20px;\n font-size: 12px;\n font-weight: 500;\n color: #AAA;\n cursor: pointer;\n transition: all 0.2s;\n height: 32px;\n}\n.chat-members[_ngcontent-%COMP%]:hover {\n background: #D9D9D9;\n color: #333;\n}\n.chat-members[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n.chat-members[_ngcontent-%COMP%] span[_ngcontent-%COMP%] {\n font-size: 12px;\n font-weight: 500;\n}\n.artifact-indicator[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n background: #3B82F6;\n border: none;\n border-radius: 6px;\n font-size: 13px;\n color: white;\n cursor: pointer;\n transition: all 150ms ease;\n}\n.artifact-indicator[_ngcontent-%COMP%]:hover {\n background: #2563EB;\n}\n.ambient-agent-indicator[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n background: #F3F4F6;\n border: 1px solid #D1D5DB;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n animation: _ngcontent-%COMP%_pulse 2s ease-in-out infinite;\n}\n.ambient-agent-indicator[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #0076B6;\n}\n@keyframes _ngcontent-%COMP%_pulse {\n 0%, 100% { opacity: 1; }\n 50% { opacity: 0.7; }\n}\n.chat-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n.action-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 12px;\n background: transparent;\n border: 1px solid #E5E7EB;\n cursor: pointer;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n transition: all 150ms ease;\n}\n.action-btn[_ngcontent-%COMP%]:hover {\n background: #F9FAFB;\n color: #111827;\n}\n.share-btn.shared[_ngcontent-%COMP%] {\n background: #EFF6FF;\n border-color: #1e40af;\n color: #1e40af;\n}\n.share-btn.shared[_ngcontent-%COMP%]:hover {\n background: #DBEAFE;\n color: #1e3a8a;\n}\n.chat-content-area[_ngcontent-%COMP%] {\n flex: 1;\n min-height: 0;\n overflow: hidden;\n display: flex;\n flex-direction: row;\n position: relative;\n}\n.chat-messages-pane[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n min-width: 300px;\n overflow: hidden;\n transition: width 0.3s ease;\n}\n.chat-messages-pane.full-width[_ngcontent-%COMP%] {\n width: 100%;\n}\n.chat-messages-pane[_ngcontent-%COMP%]:not(.full-width) {\n flex: 1;\n}\n.resize-handle[_ngcontent-%COMP%] {\n width: 4px;\n background: transparent;\n cursor: col-resize;\n flex-shrink: 0;\n position: relative;\n transition: background-color 0.2s;\n}\n.resize-handle[_ngcontent-%COMP%]:hover {\n background: #3B82F6;\n}\n.resize-handle[_ngcontent-%COMP%]::before {\n content: '';\n position: absolute;\n left: -4px;\n right: -4px;\n top: 0;\n bottom: 0;\n}\n.chat-artifact-pane[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n background: #FAFAFA;\n overflow: hidden;\n flex-shrink: 0;\n}\n.chat-artifact-pane[_ngcontent-%COMP%] > mj-artifact-viewer-panel[_ngcontent-%COMP%] {\n display: flex;\n flex: 1;\n min-height: 0;\n overflow: hidden;\n}\n.chat-messages-wrapper[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n flex-direction: column;\n min-height: 0;\n overflow: hidden;\n}\n.chat-messages-container[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n background: #FFF;\n min-height: 0;\n position: relative;\n}\n.scroll-to-bottom-icon[_ngcontent-%COMP%] {\n position: sticky;\n bottom: 21px; // 21px from bottom of visible scroll area (moved up 5px from original 16px)\n left: 50%;\n transform: translateX(-50%);\n width: 40px;\n height: 40px;\n margin-top: -40px; // Negative margin to not affect scroll height\n margin-left: auto;\n margin-right: auto;\n background: white;\n border: 1px solid #D1D5DB;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n transition: all 0.2s ease;\n z-index: 100;\n pointer-events: auto;\n}\n.scroll-to-bottom-icon[_ngcontent-%COMP%]:hover {\n background: #F3F4F6;\n border-color: #3B82F6;\n transform: translateX(-50%) translateY(-2px);\n box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);\n}\n.scroll-to-bottom-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #6B7280;\n font-size: 16px;\n transition: color 0.2s;\n}\n.scroll-to-bottom-icon[_ngcontent-%COMP%]:hover i[_ngcontent-%COMP%] {\n color: #3B82F6;\n}\n.chat-input-container[_ngcontent-%COMP%] {\n flex-shrink: 0;\n background: #FFF;\n padding: 0 1.25rem 1.25rem 1.25rem; // Increased padding to prevent clipping rounded corners\n overflow: visible; // Allow box shadow and rounded corners to show fully\n}\n\n//[_ngcontent-%COMP%] Loading[_ngcontent-%COMP%] placeholder[_ngcontent-%COMP%] -[_ngcontent-%COMP%] replaces[_ngcontent-%COMP%] input[_ngcontent-%COMP%] while[_ngcontent-%COMP%] loading\n.loading-peripheral-placeholder[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 140px; // Match typical input area height\n padding: 24px;\n background: rgba(255, 255, 255, 0.5);\n backdrop-filter: blur(2px);\n border-radius: 12px;\n margin: 12px;\n animation: _ngcontent-%COMP%_fadeIn 0.2s ease-in-out;\n}\n.modal-overlay[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n}\n.modal-content[_ngcontent-%COMP%] {\n background: white;\n border-radius: 8px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n max-width: 90vw;\n max-height: 90vh;\n display: flex;\n flex-direction: column;\n}\n.project-selector-modal[_ngcontent-%COMP%] {\n width: 600px;\n height: 500px;\n}\n.modal-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 16px 20px;\n border-bottom: 1px solid #E5E7EB;\n}\n.modal-header[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 18px;\n font-weight: 600;\n}\n.modal-header-actions[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.toggle-system-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #F3F4F6;\n border: 1px solid #E5E7EB;\n cursor: pointer;\n color: #6B7280;\n padding: 6px 12px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n transition: all 0.2s;\n}\n.toggle-system-btn[_ngcontent-%COMP%]:hover {\n background: #E5E7EB;\n border-color: #D1D5DB;\n color: #374151;\n}\n.toggle-system-btn.active[_ngcontent-%COMP%] {\n background: #3B82F6;\n border-color: #3B82F6;\n color: white;\n}\n.toggle-system-btn.active[_ngcontent-%COMP%]:hover {\n background: #2563EB;\n border-color: #2563EB;\n}\n.toggle-system-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n.modal-close-btn[_ngcontent-%COMP%] {\n background: none;\n border: none;\n cursor: pointer;\n color: #6B7280;\n padding: 4px 8px;\n border-radius: 4px;\n transition: all 0.2s;\n}\n.modal-close-btn[_ngcontent-%COMP%]:hover {\n background: #F3F4F6;\n color: #111827;\n}\n.modal-body[_ngcontent-%COMP%] {\n flex: 1;\n overflow: auto;\n padding: 20px;\n}\n.artifacts-modal[_ngcontent-%COMP%] {\n width: 700px;\n max-height: 600px;\n}\n.artifacts-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n.empty-state[_ngcontent-%COMP%] {\n grid-column: 1 / -1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 60px 20px;\n}\n.artifact-modal-card[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n background: white;\n border: 1.5px solid #E5E7EB;\n border-radius: 12px;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n overflow: hidden;\n}\n.artifact-modal-card.expanded[_ngcontent-%COMP%] {\n border-color: #3B82F6;\n}\n.artifact-modal-card.system-artifact[_ngcontent-%COMP%] {\n opacity: 0.85;\n border-color: #D1D5DB;\n border-style: dashed;\n position: relative;\n}\n.artifact-modal-card.system-artifact[_ngcontent-%COMP%]::before {\n content: 'SYSTEM';\n position: absolute;\n top: 8px;\n right: 8px;\n font-size: 9px;\n font-weight: 600;\n color: #9CA3AF;\n background: #F3F4F6;\n padding: 2px 6px;\n border-radius: 3px;\n letter-spacing: 0.5px;\n z-index: 10;\n}\n.artifact-modal-card.system-artifact[_ngcontent-%COMP%]:hover {\n border-color: #9CA3AF;\n box-shadow: 0 4px 12px rgba(156, 163, 175, 0.15);\n}\n.artifact-card-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px;\n cursor: pointer;\n}\n.artifact-card-header[_ngcontent-%COMP%]:hover {\n background: #F9FAFB;\n}\n.artifact-modal-card[_ngcontent-%COMP%]:hover {\n border-color: #3B82F6;\n box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15);\n transform: translateY(-2px);\n}\n.artifact-modal-icon[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);\n border-radius: 10px;\n color: #3B82F6;\n flex-shrink: 0;\n}\n.artifact-modal-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 18px;\n}\n.artifact-modal-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n.artifact-modal-title[_ngcontent-%COMP%] {\n font-size: 14px;\n font-weight: 600;\n color: #1F2937;\n margin-bottom: 4px;\n}\n.artifact-modal-meta[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #6B7280;\n}\n.artifact-modal-action[_ngcontent-%COMP%] {\n color: #9CA3AF;\n transition: color 0.2s;\n}\n.artifact-modal-card[_ngcontent-%COMP%]:hover .artifact-modal-action[_ngcontent-%COMP%] {\n color: #3B82F6;\n}\n.expand-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n border: none;\n background: transparent;\n color: #6B7280;\n cursor: pointer;\n border-radius: 6px;\n transition: all 0.2s;\n\n &:hover {\n background: #F3F4F6;\n color: #3B82F6;\n }\n}\n.artifact-versions-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n padding: 0 1rem 1rem 1rem;\n background: #F9FAFB;\n}\n.artifact-version-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px 16px 12px 68px; // Indent to align with title\n cursor: pointer;\n transition: background 0.15s;\n\n &:hover {\n background: #F3F4F6;\n }\n\n .version-badge {\n display: inline-block;\n padding: 4px 8px;\n background: #EEF2FF;\n color: #4F46E5;\n font-size: 12px;\n font-weight: 600;\n font-family: monospace;\n border-radius: 4px;\n }\n\n .version-open-text {\n flex: 1;\n font-size: 13px;\n color: #6B7280;\n }\n\n i {\n color: #9CA3AF;\n font-size: 12px;\n }\n\n &:hover {\n .version-badge {\n background: #4F46E5;\n color: white;\n }\n .version-open-text {\n color: #3B82F6;\n }\n i {\n color: #3B82F6;\n }\n }\n}\n\n//[_ngcontent-%COMP%] Loading[_ngcontent-%COMP%] content[_ngcontent-%COMP%] styling\n.loading-peripheral-content[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px 24px;\n background: white;\n border: 2px solid #E5E7EB;\n border-radius: 12px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n color: #4B5563;\n font-size: 14px;\n font-weight: 500;\n\n i {\n font-size: 20px;\n color: #9333EA;\n }\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n//[_ngcontent-%COMP%] Loading[_ngcontent-%COMP%] conversation[_ngcontent-%COMP%] state[_ngcontent-%COMP%] -[_ngcontent-%COMP%] centered[_ngcontent-%COMP%] spinner\n.conversation-loading-state[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n}\n\n.loading-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: 20px;\n gap: 16px;\n color: #6B7280;\n font-size: 15px;\n\n i {\n font-size: 32px;\n color: #3B82F6;\n }\n\n span {\n font-weight: 500;\n }\n}"] });
1824
+ } }, dependencies: [i7.NgIf, i8.ArtifactViewerPanelComponent, i9.ArtifactCollectionPickerModalComponent, i10.ArtifactShareModalComponent, i11.MessageListComponent, i12.MessageInputComponent, i13.ConversationEmptyStateComponent, i14.ThreadPanelComponent, i15.ProjectSelectorComponent, i16.ActiveAgentIndicatorComponent, i17.MembersModalComponent, i18.ExportModalComponent], styles: ["[_nghost-%COMP%] {\n display: flex;\n width: 100%;\n height: 100%;\n}\n.chat-area[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n.chat-header[_ngcontent-%COMP%] {\n flex-shrink: 0;\n padding: 12px 20px;\n border-bottom: 1px solid #D9D9D9;\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 16px;\n background: #FFF;\n z-index: 10;\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n}\n.chat-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n flex: 1;\n min-width: 0;\n}\n.chat-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #333;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.project-tag[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 4px 10px;\n background: #F4F4F4;\n border: 1px solid #D9D9D9;\n border-radius: 16px;\n font-size: 11px;\n font-weight: 600;\n color: #AAA;\n cursor: pointer;\n transition: all 0.2s;\n height: 28px;\n margin-left: 12px;\n}\n.project-tag[_ngcontent-%COMP%]:hover {\n background: #D9D9D9;\n border-color: #AAA;\n}\n.project-tag[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 10px;\n}\n.chat-members[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 12px;\n background: transparent;\n border: 1px solid #E5E7EB;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n cursor: pointer;\n transition: all 150ms ease;\n}\n.chat-members[_ngcontent-%COMP%]:hover {\n background: #F9FAFB;\n color: #111827;\n}\n.artifact-indicator[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 12px;\n background: transparent;\n border: 1px solid #E5E7EB;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n cursor: pointer;\n transition: all 150ms ease;\n}\n.artifact-indicator[_ngcontent-%COMP%]:hover {\n background: #F9FAFB;\n color: #111827;\n}\n.ambient-agent-indicator[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n background: #F3F4F6;\n border: 1px solid #D1D5DB;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n animation: _ngcontent-%COMP%_pulse 2s ease-in-out infinite;\n}\n.ambient-agent-indicator[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #0076B6;\n}\n@keyframes _ngcontent-%COMP%_pulse {\n 0%, 100% { opacity: 1; }\n 50% { opacity: 0.7; }\n}\n.chat-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n.action-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 12px;\n background: transparent;\n border: 1px solid #E5E7EB;\n cursor: pointer;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n transition: all 150ms ease;\n}\n.action-btn[_ngcontent-%COMP%]:hover {\n background: #F9FAFB;\n color: #111827;\n}\n.share-btn.shared[_ngcontent-%COMP%] {\n background: #EFF6FF;\n border-color: #1e40af;\n color: #1e40af;\n}\n.share-btn.shared[_ngcontent-%COMP%]:hover {\n background: #DBEAFE;\n color: #1e3a8a;\n}\n.chat-content-area[_ngcontent-%COMP%] {\n flex: 1;\n min-height: 0;\n overflow: hidden;\n display: flex;\n flex-direction: row;\n position: relative;\n}\n.chat-messages-pane[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n min-width: 300px;\n overflow: hidden;\n transition: width 0.3s ease;\n}\n.chat-messages-pane.full-width[_ngcontent-%COMP%] {\n width: 100%;\n}\n.chat-messages-pane[_ngcontent-%COMP%]:not(.full-width) {\n flex: 1;\n}\n.resize-handle[_ngcontent-%COMP%] {\n width: 4px;\n background: transparent;\n cursor: col-resize;\n flex-shrink: 0;\n position: relative;\n transition: background-color 0.2s;\n}\n.resize-handle[_ngcontent-%COMP%]:hover {\n background: #3B82F6;\n}\n.resize-handle[_ngcontent-%COMP%]::before {\n content: '';\n position: absolute;\n left: -4px;\n right: -4px;\n top: 0;\n bottom: 0;\n}\n.chat-artifact-pane[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n background: #FAFAFA;\n overflow: hidden;\n flex-shrink: 0;\n}\n.chat-artifact-pane[_ngcontent-%COMP%] > mj-artifact-viewer-panel[_ngcontent-%COMP%] {\n display: flex;\n flex: 1;\n min-height: 0;\n overflow: hidden;\n}\n.chat-messages-wrapper[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n flex-direction: column;\n min-height: 0;\n overflow: hidden;\n}\n.chat-messages-container[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n background: #FFF;\n min-height: 0;\n position: relative;\n}\n.scroll-to-bottom-icon[_ngcontent-%COMP%] {\n position: sticky;\n bottom: 21px; // 21px from bottom of visible scroll area (moved up 5px from original 16px)\n left: 50%;\n transform: translateX(-50%);\n width: 40px;\n height: 40px;\n margin-top: -40px; // Negative margin to not affect scroll height\n margin-left: auto;\n margin-right: auto;\n background: white;\n border: 1px solid #D1D5DB;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n transition: all 0.2s ease;\n z-index: 100;\n pointer-events: auto;\n}\n.scroll-to-bottom-icon[_ngcontent-%COMP%]:hover {\n background: #F3F4F6;\n border-color: #3B82F6;\n transform: translateX(-50%) translateY(-2px);\n box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);\n}\n.scroll-to-bottom-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #6B7280;\n font-size: 16px;\n transition: color 0.2s;\n}\n.scroll-to-bottom-icon[_ngcontent-%COMP%]:hover i[_ngcontent-%COMP%] {\n color: #3B82F6;\n}\n.chat-input-container[_ngcontent-%COMP%] {\n flex-shrink: 0;\n background: #FFF;\n padding: 0 1.25rem 1.25rem 1.25rem; // Increased padding to prevent clipping rounded corners\n overflow: visible; // Allow box shadow and rounded corners to show fully\n}\n\n//[_ngcontent-%COMP%] Loading[_ngcontent-%COMP%] placeholder[_ngcontent-%COMP%] -[_ngcontent-%COMP%] replaces[_ngcontent-%COMP%] input[_ngcontent-%COMP%] while[_ngcontent-%COMP%] loading\n.loading-peripheral-placeholder[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 140px; // Match typical input area height\n padding: 24px;\n background: rgba(255, 255, 255, 0.5);\n backdrop-filter: blur(2px);\n border-radius: 12px;\n margin: 12px;\n animation: _ngcontent-%COMP%_fadeIn 0.2s ease-in-out;\n}\n.modal-overlay[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n}\n.modal-content[_ngcontent-%COMP%] {\n background: white;\n border-radius: 8px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n max-width: 90vw;\n max-height: 90vh;\n display: flex;\n flex-direction: column;\n}\n.project-selector-modal[_ngcontent-%COMP%] {\n width: 600px;\n height: 500px;\n}\n.modal-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 16px 20px;\n border-bottom: 1px solid #E5E7EB;\n}\n.modal-header[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 18px;\n font-weight: 600;\n}\n.modal-header-actions[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.toggle-system-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #F3F4F6;\n border: 1px solid #E5E7EB;\n cursor: pointer;\n color: #6B7280;\n padding: 6px 12px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n transition: all 0.2s;\n}\n.toggle-system-btn[_ngcontent-%COMP%]:hover {\n background: #E5E7EB;\n border-color: #D1D5DB;\n color: #374151;\n}\n.toggle-system-btn.active[_ngcontent-%COMP%] {\n background: #3B82F6;\n border-color: #3B82F6;\n color: white;\n}\n.toggle-system-btn.active[_ngcontent-%COMP%]:hover {\n background: #2563EB;\n border-color: #2563EB;\n}\n.toggle-system-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n.modal-close-btn[_ngcontent-%COMP%] {\n background: none;\n border: none;\n cursor: pointer;\n color: #6B7280;\n padding: 4px 8px;\n border-radius: 4px;\n transition: all 0.2s;\n}\n.modal-close-btn[_ngcontent-%COMP%]:hover {\n background: #F3F4F6;\n color: #111827;\n}\n.modal-body[_ngcontent-%COMP%] {\n flex: 1;\n overflow: auto;\n padding: 20px;\n}\n.artifacts-modal[_ngcontent-%COMP%] {\n width: 700px;\n max-height: 600px;\n}\n.artifacts-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n.empty-state[_ngcontent-%COMP%] {\n grid-column: 1 / -1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 60px 20px;\n}\n.artifact-modal-card[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n background: white;\n border: 1.5px solid #E5E7EB;\n border-radius: 12px;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n overflow: hidden;\n}\n.artifact-modal-card.expanded[_ngcontent-%COMP%] {\n border-color: #3B82F6;\n}\n.artifact-modal-card.system-artifact[_ngcontent-%COMP%] {\n opacity: 0.85;\n border-color: #D1D5DB;\n border-style: dashed;\n position: relative;\n}\n.artifact-modal-card.system-artifact[_ngcontent-%COMP%]::before {\n content: 'SYSTEM';\n position: absolute;\n top: 8px;\n right: 8px;\n font-size: 9px;\n font-weight: 600;\n color: #9CA3AF;\n background: #F3F4F6;\n padding: 2px 6px;\n border-radius: 3px;\n letter-spacing: 0.5px;\n z-index: 10;\n}\n.artifact-modal-card.system-artifact[_ngcontent-%COMP%]:hover {\n border-color: #9CA3AF;\n box-shadow: 0 4px 12px rgba(156, 163, 175, 0.15);\n}\n.artifact-card-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px;\n cursor: pointer;\n}\n.artifact-card-header[_ngcontent-%COMP%]:hover {\n background: #F9FAFB;\n}\n.artifact-modal-card[_ngcontent-%COMP%]:hover {\n border-color: #3B82F6;\n box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15);\n transform: translateY(-2px);\n}\n.artifact-modal-icon[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);\n border-radius: 10px;\n color: #3B82F6;\n flex-shrink: 0;\n}\n.artifact-modal-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 18px;\n}\n.artifact-modal-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n.artifact-modal-title[_ngcontent-%COMP%] {\n font-size: 14px;\n font-weight: 600;\n color: #1F2937;\n margin-bottom: 4px;\n}\n.artifact-modal-meta[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #6B7280;\n}\n.artifact-modal-action[_ngcontent-%COMP%] {\n color: #9CA3AF;\n transition: color 0.2s;\n}\n.artifact-modal-card[_ngcontent-%COMP%]:hover .artifact-modal-action[_ngcontent-%COMP%] {\n color: #3B82F6;\n}\n.expand-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n border: none;\n background: transparent;\n color: #6B7280;\n cursor: pointer;\n border-radius: 6px;\n transition: all 0.2s;\n\n &:hover {\n background: #F3F4F6;\n color: #3B82F6;\n }\n}\n.artifact-versions-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n padding: 0 1rem 1rem 1rem;\n background: #F9FAFB;\n}\n.artifact-version-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px 16px 12px 68px; // Indent to align with title\n cursor: pointer;\n transition: background 0.15s;\n\n &:hover {\n background: #F3F4F6;\n }\n\n .version-badge {\n display: inline-block;\n padding: 4px 8px;\n background: #EEF2FF;\n color: #4F46E5;\n font-size: 12px;\n font-weight: 600;\n font-family: monospace;\n border-radius: 4px;\n }\n\n .version-open-text {\n flex: 1;\n font-size: 13px;\n color: #6B7280;\n }\n\n i {\n color: #9CA3AF;\n font-size: 12px;\n }\n\n &:hover {\n .version-badge {\n background: #4F46E5;\n color: white;\n }\n .version-open-text {\n color: #3B82F6;\n }\n i {\n color: #3B82F6;\n }\n }\n}\n\n//[_ngcontent-%COMP%] Loading[_ngcontent-%COMP%] content[_ngcontent-%COMP%] styling\n.loading-peripheral-content[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px 24px;\n background: white;\n border: 2px solid #E5E7EB;\n border-radius: 12px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n color: #4B5563;\n font-size: 14px;\n font-weight: 500;\n\n i {\n font-size: 20px;\n color: #9333EA;\n }\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n//[_ngcontent-%COMP%] Loading[_ngcontent-%COMP%] conversation[_ngcontent-%COMP%] state[_ngcontent-%COMP%] -[_ngcontent-%COMP%] centered[_ngcontent-%COMP%] spinner\n.conversation-loading-state[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n}\n\n.loading-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: 20px;\n gap: 16px;\n color: #6B7280;\n font-size: 15px;\n\n i {\n font-size: 32px;\n color: #3B82F6;\n }\n\n span {\n font-weight: 500;\n }\n}\n\n\n\n@media (max-width: 768px) {\n .chat-header[_ngcontent-%COMP%] {\n padding: 8px 12px;\n gap: 8px;\n flex-direction: column;\n align-items: stretch;\n }\n\n .chat-info[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n }\n\n .chat-title[_ngcontent-%COMP%] {\n font-size: 14px;\n width: 100%;\n white-space: normal;\n }\n\n .project-tag[_ngcontent-%COMP%] {\n margin-left: 0;\n font-size: 10px;\n padding: 3px 8px;\n height: 24px;\n }\n\n .chat-actions[_ngcontent-%COMP%] {\n flex-wrap: wrap;\n justify-content: flex-start;\n width: 100%;\n }\n\n .chat-members[_ngcontent-%COMP%], \n .artifact-indicator[_ngcontent-%COMP%], \n .action-btn[_ngcontent-%COMP%] {\n padding: 6px 10px;\n font-size: 12px;\n }\n\n .ambient-agent-indicator[_ngcontent-%COMP%] {\n font-size: 12px;\n padding: 4px 8px;\n }\n\n .project-selector-modal[_ngcontent-%COMP%] {\n width: min(95vw, 600px);\n height: auto;\n }\n\n .artifacts-modal[_ngcontent-%COMP%] {\n width: min(95vw, 700px);\n }\n\n .artifacts-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n\n .chat-input-container[_ngcontent-%COMP%] {\n padding: 0 0.75rem 0.75rem 0.75rem;\n }\n\n .scroll-to-bottom-icon[_ngcontent-%COMP%] {\n bottom: 16px;\n width: 36px;\n height: 36px;\n }\n\n \n\n .chat-content-area[_ngcontent-%COMP%] {\n position: relative;\n }\n\n .chat-artifact-pane[_ngcontent-%COMP%] {\n position: fixed;\n left: 0;\n right: 0;\n top: 80px;\n bottom: 0;\n width: 100% !important;\n z-index: 100;\n background: #FFF;\n }\n\n .resize-handle[_ngcontent-%COMP%] {\n display: none;\n }\n}\n\n\n\n@media (max-width: 480px) {\n .chat-header[_ngcontent-%COMP%] {\n padding: 6px 8px;\n gap: 6px;\n }\n\n .chat-title[_ngcontent-%COMP%] {\n font-size: 13px;\n }\n\n .project-tag[_ngcontent-%COMP%] {\n font-size: 9px;\n padding: 2px 6px;\n height: 20px;\n }\n\n .chat-members[_ngcontent-%COMP%], \n .artifact-indicator[_ngcontent-%COMP%], \n .action-btn[_ngcontent-%COMP%] {\n padding: 4px 8px;\n font-size: 11px;\n }\n\n .ambient-agent-indicator[_ngcontent-%COMP%] {\n font-size: 11px;\n padding: 3px 6px;\n }\n\n .project-selector-modal[_ngcontent-%COMP%], \n .artifacts-modal[_ngcontent-%COMP%] {\n width: 100vw;\n height: 100vh;\n border-radius: 0;\n }\n\n .chat-input-container[_ngcontent-%COMP%] {\n padding: 0 0.5rem 0.5rem 0.5rem;\n }\n\n .scroll-to-bottom-icon[_ngcontent-%COMP%] {\n bottom: 12px;\n width: 32px;\n height: 32px;\n }\n\n .scroll-to-bottom-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 14px;\n }\n}"] });
1772
1825
  }
1773
1826
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ConversationChatAreaComponent, [{
1774
1827
  type: Component,
1775
- args: [{ selector: 'mj-conversation-chat-area', template: "<div class=\"chat-area\">\n <!-- Fixed Header -->\n <div class=\"chat-header\" *ngIf=\"conversationState.activeConversation as conversation\">\n <div class=\"chat-info\">\n <div class=\"chat-title\">{{ conversation.Name }}</div>\n <button class=\"project-tag\" (click)=\"openProjectSelector()\" title=\"Assign to project\" *ngIf=\"conversation.ProjectID\">\n <i class=\"fas fa-folder\"></i>\n <span>{{ conversation.Project || 'Project' }}</span>\n </button>\n <button class=\"chat-members\" (click)=\"toggleMembersModal()\" title=\"View members\">\n <i class=\"fas fa-users\"></i>\n <span>{{ memberCount }} member{{ memberCount !== 1 ? 's' : '' }}</span>\n </button>\n <button class=\"artifact-indicator\" (click)=\"viewArtifacts()\" title=\"View artifacts\" *ngIf=\"artifactCountDisplay > 0\">\n <i class=\"fas fa-cube\"></i>\n <span>{{ artifactCountDisplay }} artifact{{ artifactCountDisplay !== 1 ? 's' : '' }}</span>\n </button>\n <mj-active-agent-indicator\n [conversationId]=\"conversationState.activeConversation.ID\"\n [currentUser]=\"currentUser\"\n (togglePanel)=\"onToggleAgentPanel()\"\n (agentSelected)=\"onAgentSelected($event)\">\n </mj-active-agent-indicator>\n </div>\n <div class=\"chat-actions\">\n <button class=\"action-btn\" (click)=\"exportConversation()\" title=\"Export conversation\">\n <i class=\"fas fa-download\"></i>\n Export\n </button>\n <button class=\"action-btn share-btn\"\n [class.shared]=\"isShared\"\n (click)=\"shareConversation()\"\n [title]=\"isShared ? 'Manage sharing' : 'Share conversation'\">\n <i class=\"fas fa-share-nodes\"></i>\n Share\n </button>\n </div>\n </div>\n\n <!-- Messages and Artifact Split Layout -->\n <div class=\"chat-content-area\">\n <!-- Messages Pane -->\n <div class=\"chat-messages-pane\" [class.full-width]=\"!showArtifactPanel\">\n @if (!conversationState.activeConversation || conversationState.isNewUnsavedConversation) {\n <!-- Empty State - No conversation selected OR new unsaved conversation -->\n <mj-conversation-empty-state\n [currentUser]=\"currentUser\"\n [disabled]=\"isProcessing\"\n (messageSent)=\"onEmptyStateMessageSent($event)\">\n </mj-conversation-empty-state>\n } @else if (isLoadingConversation) {\n <!-- Loading State - Show centered spinner while conversation loads -->\n <div class=\"conversation-loading-state\">\n <div class=\"loading-content\">\n <i class=\"fas fa-spinner fa-spin\"></i>\n <span>Loading conversation...</span>\n </div>\n </div>\n } @else {\n <!-- Normal Message View -->\n <div class=\"chat-messages-wrapper\">\n <div class=\"chat-messages-container\" #scrollContainer (scroll)=\"checkScroll()\">\n <mj-conversation-message-list\n [messages]=\"messages\"\n [conversation]=\"conversationState.activeConversation\"\n [currentUser]=\"currentUser\"\n [isProcessing]=\"isProcessing\"\n [artifactMap]=\"effectiveArtifactsMap\"\n [agentRunMap]=\"agentRunsByDetailId\"\n [ratingsMap]=\"ratingsByDetailId\"\n [userAvatarMap]=\"userAvatarMap\"\n (replyInThread)=\"onReplyInThread($event)\"\n (viewThread)=\"onViewThread($event)\"\n (retryMessage)=\"onRetryMessage($event)\"\n (artifactClicked)=\"onArtifactClicked($event)\"\n (messageEdited)=\"onMessageEdited($event)\"\n (openEntityRecord)=\"onOpenEntityRecord($event)\"\n (suggestedResponseSelected)=\"onSuggestedResponseSelected($event)\">\n </mj-conversation-message-list>\n\n <!-- Scroll to Bottom Icon (positioned within scroll container for proper centering) -->\n <span class=\"scroll-to-bottom-icon\" style=\"left: 50%;\"\n *ngIf=\"showScrollToBottomIcon && messages && messages.length > 0\"\n (click)=\"scrollToBottomAnimate()\">\n <i class=\"fas fa-arrow-down\"></i>\n </span>\n </div>\n\n <!-- Fixed Input Area -->\n <div class=\"chat-input-container\">\n @if (isLoadingPeripheralData) {\n <!-- Loading State -->\n <div class=\"loading-peripheral-placeholder\">\n <div class=\"loading-peripheral-content\">\n <i class=\"fas fa-spinner fa-spin\"></i>\n <span>Loading conversation data...</span>\n </div>\n </div>\n } @else {\n <!-- Input Component - Multiple instances cached, only one visible -->\n <div class=\"message-input-container-wrapper\">\n @for (inputRef of getCachedInputs(); track inputRef.conversationId) {\n <mj-message-input\n #messageInput\n [hidden]=\"inputRef.conversationId !== conversationState.activeConversation.ID\"\n [conversationId]=\"inputRef.conversationId\"\n [conversationName]=\"inputRef.conversationName\"\n [currentUser]=\"currentUser\"\n [conversationHistory]=\"inputRef.conversationId === conversationState.activeConversation.ID ? messages : []\"\n [artifactsByDetailId]=\"inputRef.conversationId === conversationState.activeConversation.ID ? artifactsByDetailId : emptyArtifactsMap\"\n [agentRunsByDetailId]=\"inputRef.conversationId === conversationState.activeConversation.ID ? agentRunsByDetailId : emptyAgentRunsMap\"\n [inProgressMessageIds]=\"inputRef.conversationId === conversationState.activeConversation.ID ? inProgressMessageIds : emptyInProgressIds\"\n [disabled]=\"isProcessing\"\n [initialMessage]=\"inputRef.conversationId === conversationState.activeConversation.ID ? conversationState.pendingMessageToSend : null\"\n (messageSent)=\"onMessageSent($event)\"\n (agentResponse)=\"onAgentResponse($event)\"\n (agentRunDetected)=\"onAgentRunDetected($event)\"\n (agentRunUpdate)=\"onAgentRunUpdate($event)\"\n (messageComplete)=\"onMessageComplete($event)\"\n (artifactCreated)=\"onArtifactCreated($event)\"\n (conversationRenamed)=\"onConversationRenamed($event)\"\n (intentCheckStarted)=\"onIntentCheckStarted()\"\n (intentCheckCompleted)=\"onIntentCheckCompleted()\">\n </mj-message-input>\n }\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <!-- Artifact Viewer Pane -->\n @if (showArtifactPanel && selectedArtifactId) {\n <div class=\"resize-handle\" (mousedown)=\"onResizeStart($event)\"></div>\n <div class=\"chat-artifact-pane\" [style.width.%]=\"artifactPaneWidth\">\n <mj-artifact-viewer-panel\n [artifactId]=\"selectedArtifactId\"\n [currentUser]=\"currentUser\"\n [environmentId]=\"environmentId\"\n [versionNumber]=\"selectedVersionNumber\"\n [viewContext]=\"'conversation'\"\n [canShare]=\"canShareSelectedArtifact\"\n [canEdit]=\"canEditSelectedArtifact\"\n [refreshTrigger]=\"artifactViewerRefresh$\"\n (closed)=\"onCloseArtifactPanel()\"\n (saveToCollectionRequested)=\"onSaveToCollectionRequested($event)\"\n (navigateToLink)=\"onArtifactLinkNavigation($event)\"\n (shareRequested)=\"onArtifactShareRequested($event)\">\n </mj-artifact-viewer-panel>\n </div>\n }\n\n <!-- Artifact Share Modal -->\n <mj-artifact-share-modal\n [isOpen]=\"isArtifactShareModalOpen\"\n [artifact]=\"artifactToShare\"\n [currentUser]=\"currentUser\"\n (saved)=\"onArtifactShared()\"\n (cancelled)=\"onArtifactShareModalClose()\">\n </mj-artifact-share-modal>\n </div>\n</div>\n\n<!-- Thread Panel -->\n@if (conversationState.activeThreadId) {\n <mj-thread-panel\n [parentMessageId]=\"conversationState.activeThreadId\"\n [conversationId]=\"conversationState.activeConversation?.ID || ''\"\n [currentUser]=\"currentUser\"\n (closed)=\"onThreadClosed()\"\n (replyAdded)=\"onThreadReplyAdded($event)\">\n </mj-thread-panel>\n}\n\n<!-- Export Modal -->\n<mj-export-modal\n [isVisible]=\"showExportModal\"\n [conversation]=\"conversationState.activeConversation || undefined\"\n [currentUser]=\"currentUser\"\n (cancelled)=\"onExportModalCancelled()\"\n (exported)=\"onExportModalComplete()\">\n</mj-export-modal>\n\n<!-- Members Modal -->\n<mj-members-modal\n [isVisible]=\"showMembersModal\"\n [conversation]=\"conversationState.activeConversation || undefined\"\n [currentUser]=\"currentUser\"\n (cancelled)=\"showMembersModal = false\"\n (membersChanged)=\"showMembersModal = false\">\n</mj-members-modal>\n\n<!-- Project Selector Modal -->\n@if (showProjectSelector && conversationState.activeConversation) {\n <div class=\"modal-overlay\" (click)=\"showProjectSelector = false\">\n <div class=\"modal-content project-selector-modal\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Assign Project</h3>\n <button class=\"modal-close-btn\" (click)=\"showProjectSelector = false\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <mj-project-selector\n [environmentId]=\"environmentId\"\n [currentUser]=\"currentUser\"\n [selectedProjectId]=\"conversationState.activeConversation.ProjectID\"\n (projectSelected)=\"onProjectSelected($event)\">\n </mj-project-selector>\n </div>\n </div>\n </div>\n}\n\n<!-- Artifacts Modal -->\n@if (showArtifactsModal) {\n <div class=\"modal-overlay\" (click)=\"showArtifactsModal = false\">\n <div class=\"modal-content artifacts-modal\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Conversation Artifacts</h3>\n <div class=\"modal-header-actions\">\n @if (hasSystemArtifacts) {\n <button class=\"toggle-system-btn\"\n [class.active]=\"showSystemArtifacts\"\n (click)=\"toggleSystemArtifacts()\"\n title=\"Toggle system artifacts visibility\">\n <i class=\"fas fa-cog\"></i>\n <span>{{ showSystemArtifacts ? 'Hide' : 'Show' }} System</span>\n </button>\n }\n <button class=\"modal-close-btn\" (click)=\"showArtifactsModal = false\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n </div>\n <div class=\"modal-body artifacts-grid\">\n @if (artifactsByDetailId.size === 0) {\n <div class=\"empty-state\">\n <i class=\"fas fa-cube\" style=\"font-size: 48px; color: #D1D5DB; margin-bottom: 16px;\"></i>\n <p style=\"color: #6B7280; font-size: 14px;\">No artifacts in this conversation yet</p>\n </div>\n }\n @for (artifact of getArtifactsArray(); track artifact.artifactId) {\n <div class=\"artifact-modal-card\"\n [class.expanded]=\"expandedArtifactId === artifact.artifactId\"\n [class.system-artifact]=\"artifact.visibility === 'System Only'\">\n <!-- Main card header - click to open latest version -->\n <div class=\"artifact-card-header\" (click)=\"openArtifactFromModal(artifact.artifactId)\">\n <div class=\"artifact-modal-icon\">\n <i class=\"fas fa-file-code\"></i>\n </div>\n <div class=\"artifact-modal-info\">\n <div class=\"artifact-modal-title\">{{artifact.name}}</div>\n <div class=\"artifact-modal-meta\">\n @if (artifact.versionCount > 1) {\n {{artifact.versionCount}} versions\n } @else {\n 1 version\n }\n </div>\n </div>\n @if (artifact.versionCount > 1) {\n <button class=\"expand-btn\" (click)=\"toggleArtifactExpansion(artifact.artifactId, $event)\">\n <i class=\"fas\" [class.fa-chevron-down]=\"expandedArtifactId !== artifact.artifactId\"\n [class.fa-chevron-up]=\"expandedArtifactId === artifact.artifactId\"></i>\n </button>\n }\n <div class=\"artifact-modal-action\">\n <i class=\"fas fa-external-link-alt\"></i>\n </div>\n </div>\n\n <!-- Expanded version list -->\n @if (expandedArtifactId === artifact.artifactId && artifact.versionCount > 1) {\n <div class=\"artifact-versions-list\">\n @for (version of artifact.versions; track version.versionId) {\n <div class=\"artifact-version-item\" (click)=\"openArtifactFromModal(artifact.artifactId, version.versionNumber); $event.stopPropagation()\">\n <span class=\"version-badge\">v{{version.versionNumber}}</span>\n <span class=\"version-open-text\">Open this version</span>\n <i class=\"fas fa-arrow-right\"></i>\n </div>\n }\n </div>\n }\n </div>\n }\n </div>\n </div>\n </div>\n}\n\n<!-- Collection Picker Modal -->\n@if (showCollectionPicker) {\n <mj-artifact-collection-picker-modal\n [isOpen]=\"showCollectionPicker\"\n [environmentId]=\"environmentId\"\n [currentUser]=\"currentUser\"\n [excludeCollectionIds]=\"collectionPickerExcludedIds\"\n (saved)=\"onCollectionPickerSaved($event)\"\n (cancelled)=\"onCollectionPickerCancelled()\">\n </mj-artifact-collection-picker-modal>\n}", styles: [":host {\n display: flex;\n width: 100%;\n height: 100%;\n}\n.chat-area {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n.chat-header {\n flex-shrink: 0;\n padding: 12px 20px;\n border-bottom: 1px solid #D9D9D9;\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 16px;\n background: #FFF;\n z-index: 10;\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n}\n.chat-info {\n display: flex;\n align-items: center;\n gap: 12px;\n flex: 1;\n min-width: 0;\n}\n.chat-title {\n font-size: 16px;\n font-weight: 600;\n color: #333;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.project-tag {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 4px 10px;\n background: #F4F4F4;\n border: 1px solid #D9D9D9;\n border-radius: 16px;\n font-size: 11px;\n font-weight: 600;\n color: #AAA;\n cursor: pointer;\n transition: all 0.2s;\n height: 28px;\n margin-left: 12px;\n}\n.project-tag:hover {\n background: #D9D9D9;\n border-color: #AAA;\n}\n.project-tag i {\n font-size: 10px;\n}\n.chat-members {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 6px 12px;\n background: #F4F4F4;\n border: none;\n border-radius: 20px;\n font-size: 12px;\n font-weight: 500;\n color: #AAA;\n cursor: pointer;\n transition: all 0.2s;\n height: 32px;\n}\n.chat-members:hover {\n background: #D9D9D9;\n color: #333;\n}\n.chat-members i {\n font-size: 12px;\n}\n.chat-members span {\n font-size: 12px;\n font-weight: 500;\n}\n.artifact-indicator {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n background: #3B82F6;\n border: none;\n border-radius: 6px;\n font-size: 13px;\n color: white;\n cursor: pointer;\n transition: all 150ms ease;\n}\n.artifact-indicator:hover {\n background: #2563EB;\n}\n.ambient-agent-indicator {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n background: #F3F4F6;\n border: 1px solid #D1D5DB;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n animation: pulse 2s ease-in-out infinite;\n}\n.ambient-agent-indicator i {\n color: #0076B6;\n}\n@keyframes pulse {\n 0%, 100% { opacity: 1; }\n 50% { opacity: 0.7; }\n}\n.chat-actions {\n display: flex;\n gap: 8px;\n}\n.action-btn {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 12px;\n background: transparent;\n border: 1px solid #E5E7EB;\n cursor: pointer;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n transition: all 150ms ease;\n}\n.action-btn:hover {\n background: #F9FAFB;\n color: #111827;\n}\n.share-btn.shared {\n background: #EFF6FF;\n border-color: #1e40af;\n color: #1e40af;\n}\n.share-btn.shared:hover {\n background: #DBEAFE;\n color: #1e3a8a;\n}\n.chat-content-area {\n flex: 1;\n min-height: 0;\n overflow: hidden;\n display: flex;\n flex-direction: row;\n position: relative;\n}\n.chat-messages-pane {\n height: 100%;\n display: flex;\n flex-direction: column;\n min-width: 300px;\n overflow: hidden;\n transition: width 0.3s ease;\n}\n.chat-messages-pane.full-width {\n width: 100%;\n}\n.chat-messages-pane:not(.full-width) {\n flex: 1;\n}\n.resize-handle {\n width: 4px;\n background: transparent;\n cursor: col-resize;\n flex-shrink: 0;\n position: relative;\n transition: background-color 0.2s;\n}\n.resize-handle:hover {\n background: #3B82F6;\n}\n.resize-handle::before {\n content: '';\n position: absolute;\n left: -4px;\n right: -4px;\n top: 0;\n bottom: 0;\n}\n.chat-artifact-pane {\n height: 100%;\n display: flex;\n flex-direction: column;\n background: #FAFAFA;\n overflow: hidden;\n flex-shrink: 0;\n}\n.chat-artifact-pane > mj-artifact-viewer-panel {\n display: flex;\n flex: 1;\n min-height: 0;\n overflow: hidden;\n}\n.chat-messages-wrapper {\n flex: 1;\n display: flex;\n flex-direction: column;\n min-height: 0;\n overflow: hidden;\n}\n.chat-messages-container {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n background: #FFF;\n min-height: 0;\n position: relative;\n}\n.scroll-to-bottom-icon {\n position: sticky;\n bottom: 21px; // 21px from bottom of visible scroll area (moved up 5px from original 16px)\n left: 50%;\n transform: translateX(-50%);\n width: 40px;\n height: 40px;\n margin-top: -40px; // Negative margin to not affect scroll height\n margin-left: auto;\n margin-right: auto;\n background: white;\n border: 1px solid #D1D5DB;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n transition: all 0.2s ease;\n z-index: 100;\n pointer-events: auto;\n}\n.scroll-to-bottom-icon:hover {\n background: #F3F4F6;\n border-color: #3B82F6;\n transform: translateX(-50%) translateY(-2px);\n box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);\n}\n.scroll-to-bottom-icon i {\n color: #6B7280;\n font-size: 16px;\n transition: color 0.2s;\n}\n.scroll-to-bottom-icon:hover i {\n color: #3B82F6;\n}\n.chat-input-container {\n flex-shrink: 0;\n background: #FFF;\n padding: 0 1.25rem 1.25rem 1.25rem; // Increased padding to prevent clipping rounded corners\n overflow: visible; // Allow box shadow and rounded corners to show fully\n}\n\n// Loading placeholder - replaces input while loading\n.loading-peripheral-placeholder {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 140px; // Match typical input area height\n padding: 24px;\n background: rgba(255, 255, 255, 0.5);\n backdrop-filter: blur(2px);\n border-radius: 12px;\n margin: 12px;\n animation: fadeIn 0.2s ease-in-out;\n}\n.modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n}\n.modal-content {\n background: white;\n border-radius: 8px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n max-width: 90vw;\n max-height: 90vh;\n display: flex;\n flex-direction: column;\n}\n.project-selector-modal {\n width: 600px;\n height: 500px;\n}\n.modal-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 16px 20px;\n border-bottom: 1px solid #E5E7EB;\n}\n.modal-header h3 {\n margin: 0;\n font-size: 18px;\n font-weight: 600;\n}\n.modal-header-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.toggle-system-btn {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #F3F4F6;\n border: 1px solid #E5E7EB;\n cursor: pointer;\n color: #6B7280;\n padding: 6px 12px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n transition: all 0.2s;\n}\n.toggle-system-btn:hover {\n background: #E5E7EB;\n border-color: #D1D5DB;\n color: #374151;\n}\n.toggle-system-btn.active {\n background: #3B82F6;\n border-color: #3B82F6;\n color: white;\n}\n.toggle-system-btn.active:hover {\n background: #2563EB;\n border-color: #2563EB;\n}\n.toggle-system-btn i {\n font-size: 12px;\n}\n.modal-close-btn {\n background: none;\n border: none;\n cursor: pointer;\n color: #6B7280;\n padding: 4px 8px;\n border-radius: 4px;\n transition: all 0.2s;\n}\n.modal-close-btn:hover {\n background: #F3F4F6;\n color: #111827;\n}\n.modal-body {\n flex: 1;\n overflow: auto;\n padding: 20px;\n}\n.artifacts-modal {\n width: 700px;\n max-height: 600px;\n}\n.artifacts-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n.empty-state {\n grid-column: 1 / -1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 60px 20px;\n}\n.artifact-modal-card {\n display: flex;\n flex-direction: column;\n background: white;\n border: 1.5px solid #E5E7EB;\n border-radius: 12px;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n overflow: hidden;\n}\n.artifact-modal-card.expanded {\n border-color: #3B82F6;\n}\n.artifact-modal-card.system-artifact {\n opacity: 0.85;\n border-color: #D1D5DB;\n border-style: dashed;\n position: relative;\n}\n.artifact-modal-card.system-artifact::before {\n content: 'SYSTEM';\n position: absolute;\n top: 8px;\n right: 8px;\n font-size: 9px;\n font-weight: 600;\n color: #9CA3AF;\n background: #F3F4F6;\n padding: 2px 6px;\n border-radius: 3px;\n letter-spacing: 0.5px;\n z-index: 10;\n}\n.artifact-modal-card.system-artifact:hover {\n border-color: #9CA3AF;\n box-shadow: 0 4px 12px rgba(156, 163, 175, 0.15);\n}\n.artifact-card-header {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px;\n cursor: pointer;\n}\n.artifact-card-header:hover {\n background: #F9FAFB;\n}\n.artifact-modal-card:hover {\n border-color: #3B82F6;\n box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15);\n transform: translateY(-2px);\n}\n.artifact-modal-icon {\n width: 40px;\n height: 40px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);\n border-radius: 10px;\n color: #3B82F6;\n flex-shrink: 0;\n}\n.artifact-modal-icon i {\n font-size: 18px;\n}\n.artifact-modal-info {\n flex: 1;\n min-width: 0;\n}\n.artifact-modal-title {\n font-size: 14px;\n font-weight: 600;\n color: #1F2937;\n margin-bottom: 4px;\n}\n.artifact-modal-meta {\n font-size: 12px;\n color: #6B7280;\n}\n.artifact-modal-action {\n color: #9CA3AF;\n transition: color 0.2s;\n}\n.artifact-modal-card:hover .artifact-modal-action {\n color: #3B82F6;\n}\n.expand-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n border: none;\n background: transparent;\n color: #6B7280;\n cursor: pointer;\n border-radius: 6px;\n transition: all 0.2s;\n\n &:hover {\n background: #F3F4F6;\n color: #3B82F6;\n }\n}\n.artifact-versions-list {\n display: flex;\n flex-direction: column;\n padding: 0 1rem 1rem 1rem;\n background: #F9FAFB;\n}\n.artifact-version-item {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px 16px 12px 68px; // Indent to align with title\n cursor: pointer;\n transition: background 0.15s;\n\n &:hover {\n background: #F3F4F6;\n }\n\n .version-badge {\n display: inline-block;\n padding: 4px 8px;\n background: #EEF2FF;\n color: #4F46E5;\n font-size: 12px;\n font-weight: 600;\n font-family: monospace;\n border-radius: 4px;\n }\n\n .version-open-text {\n flex: 1;\n font-size: 13px;\n color: #6B7280;\n }\n\n i {\n color: #9CA3AF;\n font-size: 12px;\n }\n\n &:hover {\n .version-badge {\n background: #4F46E5;\n color: white;\n }\n .version-open-text {\n color: #3B82F6;\n }\n i {\n color: #3B82F6;\n }\n }\n}\n\n// Loading content styling\n.loading-peripheral-content {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px 24px;\n background: white;\n border: 2px solid #E5E7EB;\n border-radius: 12px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n color: #4B5563;\n font-size: 14px;\n font-weight: 500;\n\n i {\n font-size: 20px;\n color: #9333EA;\n }\n}\n\n@keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n// Loading conversation state - centered spinner\n.conversation-loading-state {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n}\n\n.loading-content {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: 20px;\n gap: 16px;\n color: #6B7280;\n font-size: 15px;\n\n i {\n font-size: 32px;\n color: #3B82F6;\n }\n\n span {\n font-weight: 500;\n }\n}\n"] }]
1828
+ args: [{ selector: 'mj-conversation-chat-area', template: "<div class=\"chat-area\">\n <!-- Fixed Header -->\n <div class=\"chat-header\" *ngIf=\"conversationState.activeConversation as conversation\">\n <div class=\"chat-info\">\n <div class=\"chat-title\">{{ conversation.Name }}</div>\n <button class=\"project-tag\" (click)=\"openProjectSelector()\" title=\"Assign to project\" *ngIf=\"conversation.ProjectID\">\n <i class=\"fas fa-folder\"></i>\n <span>{{ conversation.Project || 'Project' }}</span>\n </button>\n <mj-active-agent-indicator\n [conversationId]=\"conversationState.activeConversation.ID\"\n [currentUser]=\"currentUser\"\n (togglePanel)=\"onToggleAgentPanel()\"\n (agentSelected)=\"onAgentSelected($event)\">\n </mj-active-agent-indicator>\n </div>\n <div class=\"chat-actions\">\n <button class=\"chat-members\" (click)=\"toggleMembersModal()\" title=\"View members\">\n <i class=\"fas fa-users\"></i>\n <span>{{ memberCount }} member{{ memberCount !== 1 ? 's' : '' }}</span>\n </button>\n <button class=\"artifact-indicator\" (click)=\"viewArtifacts()\" title=\"View artifacts\" *ngIf=\"artifactCountDisplay > 0\">\n <i class=\"fas fa-cube\"></i>\n <span>{{ artifactCountDisplay }} artifact{{ artifactCountDisplay !== 1 ? 's' : '' }}</span>\n </button>\n <mj-active-agent-indicator\n [conversationId]=\"conversationState.activeConversation.ID\"\n [currentUser]=\"currentUser\"\n (togglePanel)=\"onToggleAgentPanel()\"\n (agentSelected)=\"onAgentSelected($event)\">\n </mj-active-agent-indicator>\n </div>\n <div class=\"chat-actions\">\n <button class=\"action-btn\" (click)=\"exportConversation()\" title=\"Export conversation\">\n <i class=\"fas fa-download\"></i>\n Export\n </button>\n <button class=\"action-btn share-btn\"\n [class.shared]=\"isShared\"\n (click)=\"shareConversation()\"\n [title]=\"isShared ? 'Manage sharing' : 'Share conversation'\">\n <i class=\"fas fa-share-nodes\"></i>\n Share\n </button>\n </div>\n </div>\n\n <!-- Messages and Artifact Split Layout -->\n <div class=\"chat-content-area\">\n <!-- Messages Pane -->\n <div class=\"chat-messages-pane\" [class.full-width]=\"!showArtifactPanel\">\n @if (!conversationState.activeConversation || conversationState.isNewUnsavedConversation) {\n <!-- Empty State - No conversation selected OR new unsaved conversation -->\n <mj-conversation-empty-state\n [currentUser]=\"currentUser\"\n [disabled]=\"isProcessing\"\n (messageSent)=\"onEmptyStateMessageSent($event)\">\n </mj-conversation-empty-state>\n } @else if (isLoadingConversation) {\n <!-- Loading State - Show centered spinner while conversation loads -->\n <div class=\"conversation-loading-state\">\n <div class=\"loading-content\">\n <i class=\"fas fa-spinner fa-spin\"></i>\n <span>Loading conversation...</span>\n </div>\n </div>\n } @else {\n <!-- Normal Message View -->\n <div class=\"chat-messages-wrapper\">\n <div class=\"chat-messages-container\" #scrollContainer (scroll)=\"checkScroll()\">\n <mj-conversation-message-list\n [messages]=\"messages\"\n [conversation]=\"conversationState.activeConversation\"\n [currentUser]=\"currentUser\"\n [isProcessing]=\"isProcessing\"\n [artifactMap]=\"effectiveArtifactsMap\"\n [agentRunMap]=\"agentRunsByDetailId\"\n [ratingsMap]=\"ratingsByDetailId\"\n [userAvatarMap]=\"userAvatarMap\"\n (replyInThread)=\"onReplyInThread($event)\"\n (viewThread)=\"onViewThread($event)\"\n (retryMessage)=\"onRetryMessage($event)\"\n (artifactClicked)=\"onArtifactClicked($event)\"\n (messageEdited)=\"onMessageEdited($event)\"\n (openEntityRecord)=\"onOpenEntityRecord($event)\"\n (suggestedResponseSelected)=\"onSuggestedResponseSelected($event)\">\n </mj-conversation-message-list>\n\n <!-- Scroll to Bottom Icon (positioned within scroll container for proper centering) -->\n <span class=\"scroll-to-bottom-icon\" style=\"left: 50%;\"\n *ngIf=\"showScrollToBottomIcon && messages && messages.length > 0\"\n (click)=\"scrollToBottomAnimate()\">\n <i class=\"fas fa-arrow-down\"></i>\n </span>\n </div>\n\n <!-- Fixed Input Area -->\n <div class=\"chat-input-container\">\n @if (isLoadingPeripheralData) {\n <!-- Loading State -->\n <div class=\"loading-peripheral-placeholder\">\n <div class=\"loading-peripheral-content\">\n <i class=\"fas fa-spinner fa-spin\"></i>\n <span>Loading conversation data...</span>\n </div>\n </div>\n } @else {\n <!-- Input Component - Multiple instances cached, only one visible -->\n <div class=\"message-input-container-wrapper\">\n @for (inputRef of getCachedInputs(); track inputRef.conversationId) {\n <mj-message-input\n #messageInput\n [hidden]=\"inputRef.conversationId !== conversationState.activeConversation.ID\"\n [conversationId]=\"inputRef.conversationId\"\n [conversationName]=\"inputRef.conversationName\"\n [currentUser]=\"currentUser\"\n [conversationHistory]=\"inputRef.conversationId === conversationState.activeConversation.ID ? messages : []\"\n [artifactsByDetailId]=\"inputRef.conversationId === conversationState.activeConversation.ID ? artifactsByDetailId : emptyArtifactsMap\"\n [systemArtifactsByDetailId]=\"inputRef.conversationId === conversationState.activeConversation.ID ? systemArtifactsByDetailId : emptyArtifactsMap\"\n [agentRunsByDetailId]=\"inputRef.conversationId === conversationState.activeConversation.ID ? agentRunsByDetailId : emptyAgentRunsMap\"\n [inProgressMessageIds]=\"inputRef.conversationId === conversationState.activeConversation.ID ? inProgressMessageIds : emptyInProgressIds\"\n [disabled]=\"isProcessing\"\n [initialMessage]=\"inputRef.conversationId === conversationState.activeConversation.ID ? conversationState.pendingMessageToSend : null\"\n (messageSent)=\"onMessageSent($event)\"\n (agentResponse)=\"onAgentResponse($event)\"\n (agentRunDetected)=\"onAgentRunDetected($event)\"\n (agentRunUpdate)=\"onAgentRunUpdate($event)\"\n (messageComplete)=\"onMessageComplete($event)\"\n (artifactCreated)=\"onArtifactCreated($event)\"\n (conversationRenamed)=\"onConversationRenamed($event)\"\n (intentCheckStarted)=\"onIntentCheckStarted()\"\n (intentCheckCompleted)=\"onIntentCheckCompleted()\">\n </mj-message-input>\n }\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <!-- Artifact Viewer Pane -->\n @if (showArtifactPanel && selectedArtifactId) {\n <div class=\"resize-handle\" (mousedown)=\"onResizeStart($event)\" (touchstart)=\"onResizeTouchStart($event)\"></div>\n <div class=\"chat-artifact-pane\" [style.width.%]=\"artifactPaneWidth\">\n <mj-artifact-viewer-panel\n [artifactId]=\"selectedArtifactId\"\n [currentUser]=\"currentUser\"\n [environmentId]=\"environmentId\"\n [versionNumber]=\"selectedVersionNumber\"\n [viewContext]=\"'conversation'\"\n [canShare]=\"canShareSelectedArtifact\"\n [canEdit]=\"canEditSelectedArtifact\"\n [refreshTrigger]=\"artifactViewerRefresh$\"\n (closed)=\"onCloseArtifactPanel()\"\n (saveToCollectionRequested)=\"onSaveToCollectionRequested($event)\"\n (navigateToLink)=\"onArtifactLinkNavigation($event)\"\n (shareRequested)=\"onArtifactShareRequested($event)\">\n </mj-artifact-viewer-panel>\n </div>\n }\n\n <!-- Artifact Share Modal -->\n <mj-artifact-share-modal\n [isOpen]=\"isArtifactShareModalOpen\"\n [artifact]=\"artifactToShare\"\n [currentUser]=\"currentUser\"\n (saved)=\"onArtifactShared()\"\n (cancelled)=\"onArtifactShareModalClose()\">\n </mj-artifact-share-modal>\n </div>\n</div>\n\n<!-- Thread Panel -->\n@if (conversationState.activeThreadId) {\n <mj-thread-panel\n [parentMessageId]=\"conversationState.activeThreadId\"\n [conversationId]=\"conversationState.activeConversation?.ID || ''\"\n [currentUser]=\"currentUser\"\n (closed)=\"onThreadClosed()\"\n (replyAdded)=\"onThreadReplyAdded($event)\">\n </mj-thread-panel>\n}\n\n<!-- Export Modal -->\n<mj-export-modal\n [isVisible]=\"showExportModal\"\n [conversation]=\"conversationState.activeConversation || undefined\"\n [currentUser]=\"currentUser\"\n (cancelled)=\"onExportModalCancelled()\"\n (exported)=\"onExportModalComplete()\">\n</mj-export-modal>\n\n<!-- Members Modal -->\n<mj-members-modal\n [isVisible]=\"showMembersModal\"\n [conversation]=\"conversationState.activeConversation || undefined\"\n [currentUser]=\"currentUser\"\n (cancelled)=\"showMembersModal = false\"\n (membersChanged)=\"showMembersModal = false\">\n</mj-members-modal>\n\n<!-- Project Selector Modal -->\n@if (showProjectSelector && conversationState.activeConversation) {\n <div class=\"modal-overlay\" (click)=\"showProjectSelector = false\">\n <div class=\"modal-content project-selector-modal\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Assign Project</h3>\n <button class=\"modal-close-btn\" (click)=\"showProjectSelector = false\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <mj-project-selector\n [environmentId]=\"environmentId\"\n [currentUser]=\"currentUser\"\n [selectedProjectId]=\"conversationState.activeConversation.ProjectID\"\n (projectSelected)=\"onProjectSelected($event)\">\n </mj-project-selector>\n </div>\n </div>\n </div>\n}\n\n<!-- Artifacts Modal -->\n@if (showArtifactsModal) {\n <div class=\"modal-overlay\" (click)=\"showArtifactsModal = false\">\n <div class=\"modal-content artifacts-modal\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Conversation Artifacts</h3>\n <div class=\"modal-header-actions\">\n @if (hasSystemArtifacts) {\n <button class=\"toggle-system-btn\"\n [class.active]=\"showSystemArtifacts\"\n (click)=\"toggleSystemArtifacts()\"\n title=\"Toggle system artifacts visibility\">\n <i class=\"fas fa-cog\"></i>\n <span>{{ showSystemArtifacts ? 'Hide' : 'Show' }} System</span>\n </button>\n }\n <button class=\"modal-close-btn\" (click)=\"showArtifactsModal = false\">\n <i class=\"fas fa-times\"></i>\n </button>\n </div>\n </div>\n <div class=\"modal-body artifacts-grid\">\n @if (artifactsByDetailId.size === 0) {\n <div class=\"empty-state\">\n <i class=\"fas fa-cube\" style=\"font-size: 48px; color: #D1D5DB; margin-bottom: 16px;\"></i>\n <p style=\"color: #6B7280; font-size: 14px;\">No artifacts in this conversation yet</p>\n </div>\n }\n @for (artifact of getArtifactsArray(); track artifact.artifactId) {\n <div class=\"artifact-modal-card\"\n [class.expanded]=\"expandedArtifactId === artifact.artifactId\"\n [class.system-artifact]=\"artifact.visibility === 'System Only'\">\n <!-- Main card header - click to open latest version -->\n <div class=\"artifact-card-header\" (click)=\"openArtifactFromModal(artifact.artifactId)\">\n <div class=\"artifact-modal-icon\">\n <i class=\"fas fa-file-code\"></i>\n </div>\n <div class=\"artifact-modal-info\">\n <div class=\"artifact-modal-title\">{{artifact.name}}</div>\n <div class=\"artifact-modal-meta\">\n @if (artifact.versionCount > 1) {\n {{artifact.versionCount}} versions\n } @else {\n 1 version\n }\n </div>\n </div>\n @if (artifact.versionCount > 1) {\n <button class=\"expand-btn\" (click)=\"toggleArtifactExpansion(artifact.artifactId, $event)\">\n <i class=\"fas\" [class.fa-chevron-down]=\"expandedArtifactId !== artifact.artifactId\"\n [class.fa-chevron-up]=\"expandedArtifactId === artifact.artifactId\"></i>\n </button>\n }\n <div class=\"artifact-modal-action\">\n <i class=\"fas fa-external-link-alt\"></i>\n </div>\n </div>\n\n <!-- Expanded version list -->\n @if (expandedArtifactId === artifact.artifactId && artifact.versionCount > 1) {\n <div class=\"artifact-versions-list\">\n @for (version of artifact.versions; track version.versionId) {\n <div class=\"artifact-version-item\" (click)=\"openArtifactFromModal(artifact.artifactId, version.versionNumber); $event.stopPropagation()\">\n <span class=\"version-badge\">v{{version.versionNumber}}</span>\n <span class=\"version-open-text\">Open this version</span>\n <i class=\"fas fa-arrow-right\"></i>\n </div>\n }\n </div>\n }\n </div>\n }\n </div>\n </div>\n </div>\n}\n\n<!-- Collection Picker Modal -->\n@if (showCollectionPicker) {\n <mj-artifact-collection-picker-modal\n [isOpen]=\"showCollectionPicker\"\n [environmentId]=\"environmentId\"\n [currentUser]=\"currentUser\"\n [excludeCollectionIds]=\"collectionPickerExcludedIds\"\n (saved)=\"onCollectionPickerSaved($event)\"\n (cancelled)=\"onCollectionPickerCancelled()\">\n </mj-artifact-collection-picker-modal>\n}", styles: [":host {\n display: flex;\n width: 100%;\n height: 100%;\n}\n.chat-area {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n.chat-header {\n flex-shrink: 0;\n padding: 12px 20px;\n border-bottom: 1px solid #D9D9D9;\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 16px;\n background: #FFF;\n z-index: 10;\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n}\n.chat-info {\n display: flex;\n align-items: center;\n gap: 12px;\n flex: 1;\n min-width: 0;\n}\n.chat-title {\n font-size: 16px;\n font-weight: 600;\n color: #333;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.project-tag {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 4px 10px;\n background: #F4F4F4;\n border: 1px solid #D9D9D9;\n border-radius: 16px;\n font-size: 11px;\n font-weight: 600;\n color: #AAA;\n cursor: pointer;\n transition: all 0.2s;\n height: 28px;\n margin-left: 12px;\n}\n.project-tag:hover {\n background: #D9D9D9;\n border-color: #AAA;\n}\n.project-tag i {\n font-size: 10px;\n}\n.chat-members {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 12px;\n background: transparent;\n border: 1px solid #E5E7EB;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n cursor: pointer;\n transition: all 150ms ease;\n}\n.chat-members:hover {\n background: #F9FAFB;\n color: #111827;\n}\n.artifact-indicator {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 12px;\n background: transparent;\n border: 1px solid #E5E7EB;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n cursor: pointer;\n transition: all 150ms ease;\n}\n.artifact-indicator:hover {\n background: #F9FAFB;\n color: #111827;\n}\n.ambient-agent-indicator {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n background: #F3F4F6;\n border: 1px solid #D1D5DB;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n animation: pulse 2s ease-in-out infinite;\n}\n.ambient-agent-indicator i {\n color: #0076B6;\n}\n@keyframes pulse {\n 0%, 100% { opacity: 1; }\n 50% { opacity: 0.7; }\n}\n.chat-actions {\n display: flex;\n gap: 8px;\n}\n.action-btn {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 12px;\n background: transparent;\n border: 1px solid #E5E7EB;\n cursor: pointer;\n border-radius: 6px;\n font-size: 13px;\n color: #6B7280;\n transition: all 150ms ease;\n}\n.action-btn:hover {\n background: #F9FAFB;\n color: #111827;\n}\n.share-btn.shared {\n background: #EFF6FF;\n border-color: #1e40af;\n color: #1e40af;\n}\n.share-btn.shared:hover {\n background: #DBEAFE;\n color: #1e3a8a;\n}\n.chat-content-area {\n flex: 1;\n min-height: 0;\n overflow: hidden;\n display: flex;\n flex-direction: row;\n position: relative;\n}\n.chat-messages-pane {\n height: 100%;\n display: flex;\n flex-direction: column;\n min-width: 300px;\n overflow: hidden;\n transition: width 0.3s ease;\n}\n.chat-messages-pane.full-width {\n width: 100%;\n}\n.chat-messages-pane:not(.full-width) {\n flex: 1;\n}\n.resize-handle {\n width: 4px;\n background: transparent;\n cursor: col-resize;\n flex-shrink: 0;\n position: relative;\n transition: background-color 0.2s;\n}\n.resize-handle:hover {\n background: #3B82F6;\n}\n.resize-handle::before {\n content: '';\n position: absolute;\n left: -4px;\n right: -4px;\n top: 0;\n bottom: 0;\n}\n.chat-artifact-pane {\n height: 100%;\n display: flex;\n flex-direction: column;\n background: #FAFAFA;\n overflow: hidden;\n flex-shrink: 0;\n}\n.chat-artifact-pane > mj-artifact-viewer-panel {\n display: flex;\n flex: 1;\n min-height: 0;\n overflow: hidden;\n}\n.chat-messages-wrapper {\n flex: 1;\n display: flex;\n flex-direction: column;\n min-height: 0;\n overflow: hidden;\n}\n.chat-messages-container {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n background: #FFF;\n min-height: 0;\n position: relative;\n}\n.scroll-to-bottom-icon {\n position: sticky;\n bottom: 21px; // 21px from bottom of visible scroll area (moved up 5px from original 16px)\n left: 50%;\n transform: translateX(-50%);\n width: 40px;\n height: 40px;\n margin-top: -40px; // Negative margin to not affect scroll height\n margin-left: auto;\n margin-right: auto;\n background: white;\n border: 1px solid #D1D5DB;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n transition: all 0.2s ease;\n z-index: 100;\n pointer-events: auto;\n}\n.scroll-to-bottom-icon:hover {\n background: #F3F4F6;\n border-color: #3B82F6;\n transform: translateX(-50%) translateY(-2px);\n box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);\n}\n.scroll-to-bottom-icon i {\n color: #6B7280;\n font-size: 16px;\n transition: color 0.2s;\n}\n.scroll-to-bottom-icon:hover i {\n color: #3B82F6;\n}\n.chat-input-container {\n flex-shrink: 0;\n background: #FFF;\n padding: 0 1.25rem 1.25rem 1.25rem; // Increased padding to prevent clipping rounded corners\n overflow: visible; // Allow box shadow and rounded corners to show fully\n}\n\n// Loading placeholder - replaces input while loading\n.loading-peripheral-placeholder {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 140px; // Match typical input area height\n padding: 24px;\n background: rgba(255, 255, 255, 0.5);\n backdrop-filter: blur(2px);\n border-radius: 12px;\n margin: 12px;\n animation: fadeIn 0.2s ease-in-out;\n}\n.modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n}\n.modal-content {\n background: white;\n border-radius: 8px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n max-width: 90vw;\n max-height: 90vh;\n display: flex;\n flex-direction: column;\n}\n.project-selector-modal {\n width: 600px;\n height: 500px;\n}\n.modal-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 16px 20px;\n border-bottom: 1px solid #E5E7EB;\n}\n.modal-header h3 {\n margin: 0;\n font-size: 18px;\n font-weight: 600;\n}\n.modal-header-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.toggle-system-btn {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #F3F4F6;\n border: 1px solid #E5E7EB;\n cursor: pointer;\n color: #6B7280;\n padding: 6px 12px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n transition: all 0.2s;\n}\n.toggle-system-btn:hover {\n background: #E5E7EB;\n border-color: #D1D5DB;\n color: #374151;\n}\n.toggle-system-btn.active {\n background: #3B82F6;\n border-color: #3B82F6;\n color: white;\n}\n.toggle-system-btn.active:hover {\n background: #2563EB;\n border-color: #2563EB;\n}\n.toggle-system-btn i {\n font-size: 12px;\n}\n.modal-close-btn {\n background: none;\n border: none;\n cursor: pointer;\n color: #6B7280;\n padding: 4px 8px;\n border-radius: 4px;\n transition: all 0.2s;\n}\n.modal-close-btn:hover {\n background: #F3F4F6;\n color: #111827;\n}\n.modal-body {\n flex: 1;\n overflow: auto;\n padding: 20px;\n}\n.artifacts-modal {\n width: 700px;\n max-height: 600px;\n}\n.artifacts-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n.empty-state {\n grid-column: 1 / -1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 60px 20px;\n}\n.artifact-modal-card {\n display: flex;\n flex-direction: column;\n background: white;\n border: 1.5px solid #E5E7EB;\n border-radius: 12px;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n overflow: hidden;\n}\n.artifact-modal-card.expanded {\n border-color: #3B82F6;\n}\n.artifact-modal-card.system-artifact {\n opacity: 0.85;\n border-color: #D1D5DB;\n border-style: dashed;\n position: relative;\n}\n.artifact-modal-card.system-artifact::before {\n content: 'SYSTEM';\n position: absolute;\n top: 8px;\n right: 8px;\n font-size: 9px;\n font-weight: 600;\n color: #9CA3AF;\n background: #F3F4F6;\n padding: 2px 6px;\n border-radius: 3px;\n letter-spacing: 0.5px;\n z-index: 10;\n}\n.artifact-modal-card.system-artifact:hover {\n border-color: #9CA3AF;\n box-shadow: 0 4px 12px rgba(156, 163, 175, 0.15);\n}\n.artifact-card-header {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px;\n cursor: pointer;\n}\n.artifact-card-header:hover {\n background: #F9FAFB;\n}\n.artifact-modal-card:hover {\n border-color: #3B82F6;\n box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15);\n transform: translateY(-2px);\n}\n.artifact-modal-icon {\n width: 40px;\n height: 40px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);\n border-radius: 10px;\n color: #3B82F6;\n flex-shrink: 0;\n}\n.artifact-modal-icon i {\n font-size: 18px;\n}\n.artifact-modal-info {\n flex: 1;\n min-width: 0;\n}\n.artifact-modal-title {\n font-size: 14px;\n font-weight: 600;\n color: #1F2937;\n margin-bottom: 4px;\n}\n.artifact-modal-meta {\n font-size: 12px;\n color: #6B7280;\n}\n.artifact-modal-action {\n color: #9CA3AF;\n transition: color 0.2s;\n}\n.artifact-modal-card:hover .artifact-modal-action {\n color: #3B82F6;\n}\n.expand-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n border: none;\n background: transparent;\n color: #6B7280;\n cursor: pointer;\n border-radius: 6px;\n transition: all 0.2s;\n\n &:hover {\n background: #F3F4F6;\n color: #3B82F6;\n }\n}\n.artifact-versions-list {\n display: flex;\n flex-direction: column;\n padding: 0 1rem 1rem 1rem;\n background: #F9FAFB;\n}\n.artifact-version-item {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px 16px 12px 68px; // Indent to align with title\n cursor: pointer;\n transition: background 0.15s;\n\n &:hover {\n background: #F3F4F6;\n }\n\n .version-badge {\n display: inline-block;\n padding: 4px 8px;\n background: #EEF2FF;\n color: #4F46E5;\n font-size: 12px;\n font-weight: 600;\n font-family: monospace;\n border-radius: 4px;\n }\n\n .version-open-text {\n flex: 1;\n font-size: 13px;\n color: #6B7280;\n }\n\n i {\n color: #9CA3AF;\n font-size: 12px;\n }\n\n &:hover {\n .version-badge {\n background: #4F46E5;\n color: white;\n }\n .version-open-text {\n color: #3B82F6;\n }\n i {\n color: #3B82F6;\n }\n }\n}\n\n// Loading content styling\n.loading-peripheral-content {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px 24px;\n background: white;\n border: 2px solid #E5E7EB;\n border-radius: 12px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n color: #4B5563;\n font-size: 14px;\n font-weight: 500;\n\n i {\n font-size: 20px;\n color: #9333EA;\n }\n}\n\n@keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n// Loading conversation state - centered spinner\n.conversation-loading-state {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n}\n\n.loading-content {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: 20px;\n gap: 16px;\n color: #6B7280;\n font-size: 15px;\n\n i {\n font-size: 32px;\n color: #3B82F6;\n }\n\n span {\n font-weight: 500;\n }\n}\n\n/* Mobile adjustments: 481px - 768px */\n@media (max-width: 768px) {\n .chat-header {\n padding: 8px 12px;\n gap: 8px;\n flex-direction: column;\n align-items: stretch;\n }\n\n .chat-info {\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n }\n\n .chat-title {\n font-size: 14px;\n width: 100%;\n white-space: normal;\n }\n\n .project-tag {\n margin-left: 0;\n font-size: 10px;\n padding: 3px 8px;\n height: 24px;\n }\n\n .chat-actions {\n flex-wrap: wrap;\n justify-content: flex-start;\n width: 100%;\n }\n\n .chat-members,\n .artifact-indicator,\n .action-btn {\n padding: 6px 10px;\n font-size: 12px;\n }\n\n .ambient-agent-indicator {\n font-size: 12px;\n padding: 4px 8px;\n }\n\n .project-selector-modal {\n width: min(95vw, 600px);\n height: auto;\n }\n\n .artifacts-modal {\n width: min(95vw, 700px);\n }\n\n .artifacts-grid {\n grid-template-columns: 1fr;\n }\n\n .chat-input-container {\n padding: 0 0.75rem 0.75rem 0.75rem;\n }\n\n .scroll-to-bottom-icon {\n bottom: 16px;\n width: 36px;\n height: 36px;\n }\n\n /* Artifact pane - full width overlay on mobile */\n .chat-content-area {\n position: relative;\n }\n\n .chat-artifact-pane {\n position: fixed;\n left: 0;\n right: 0;\n top: 80px;\n bottom: 0;\n width: 100% !important;\n z-index: 100;\n background: #FFF;\n }\n\n .resize-handle {\n display: none;\n }\n}\n\n/* Small Phone adjustments: <= 480px */\n@media (max-width: 480px) {\n .chat-header {\n padding: 6px 8px;\n gap: 6px;\n }\n\n .chat-title {\n font-size: 13px;\n }\n\n .project-tag {\n font-size: 9px;\n padding: 2px 6px;\n height: 20px;\n }\n\n .chat-members,\n .artifact-indicator,\n .action-btn {\n padding: 4px 8px;\n font-size: 11px;\n }\n\n .ambient-agent-indicator {\n font-size: 11px;\n padding: 3px 6px;\n }\n\n .project-selector-modal,\n .artifacts-modal {\n width: 100vw;\n height: 100vh;\n border-radius: 0;\n }\n\n .chat-input-container {\n padding: 0 0.5rem 0.5rem 0.5rem;\n }\n\n .scroll-to-bottom-icon {\n bottom: 12px;\n width: 32px;\n height: 32px;\n }\n\n .scroll-to-bottom-icon i {\n font-size: 14px;\n }\n}\n"] }]
1776
1829
  }], () => [{ type: i1.ConversationStateService }, { type: i2.AgentStateService }, { type: i3.ConversationAgentService }, { type: i4.ActiveTasksService }, { type: i0.ChangeDetectorRef }, { type: i5.MentionAutocompleteService }, { type: i6.ArtifactPermissionService }], { environmentId: [{
1777
1830
  type: Input
1778
1831
  }], currentUser: [{