@memberjunction/ng-conversations 5.43.0 → 5.45.0

package/dist/lib/components/realtime/realtime-activity-rail.component.js

@@ -1,9 +1,14 @@
 import { Component, EventEmitter, Input, Output, ChangeDetectorRef, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { AngularSplitModule } from 'angular-split';
+import { UserInfoEngine } from '@memberjunction/core-entities';
+import { ArtifactsModule } from '@memberjunction/ng-artifacts';
 import { FriendlyStepLabel, FormatElapsed } from './realtime-session-state';
+import { ACTIVITY_SPLIT_DEFAULT_PERCENT, ACTIVITY_SPLIT_PREF_KEY, ClampActivitySplitPercent, ParseActivitySplitPercent, SerializeActivitySplitPercent } from './realtime-surface-tab-style';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
-const _forTrack0 = ($index, $item) => $item.ArtifactVersionID;
+import * as i2 from "angular-split";
+import * as i3 from "@memberjunction/ng-artifacts";
 function RealtimeActivityRailComponent_Conditional_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 5);
     i0.ɵɵelement(1, "i", 6);
@@ -28,133 +33,247 @@ function RealtimeActivityRailComponent_Conditional_1_Template(rf, ctx) { if (rf
     i0.ɵɵadvance();
     i0.ɵɵconditional(!ctx_r1.Collapsed ? 3 : -1);
 } }
-function RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 12);
-    i0.ɵɵelement(1, "i", 18);
+function RealtimeActivityRailComponent_Conditional_2_Conditional_3_For_5_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-artifact-message-card", 20);
+    i0.ɵɵlistener("actionPerformed", function RealtimeActivityRailComponent_Conditional_2_Conditional_3_For_5_Conditional_1_Template_mj_artifact_message_card_actionPerformed_0_listener() { i0.ɵɵrestoreView(_r4); const artifact_r5 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OpenArtifact(artifact_r5)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const artifact_r5 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵproperty("artifactId", artifact_r5.ArtifactID)("currentUser", ctx_r1.CurrentUser);
+} }
+function RealtimeActivityRailComponent_Conditional_2_Conditional_3_For_5_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 21);
+    i0.ɵɵlistener("click", function RealtimeActivityRailComponent_Conditional_2_Conditional_3_For_5_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const artifact_r5 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OpenArtifact(artifact_r5)); });
+    i0.ɵɵelement(1, "i", 22);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(4, "i", 23);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const artifact_r5 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("title", "View " + artifact_r5.Name);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(artifact_r5.Name);
+} }
+function RealtimeActivityRailComponent_Conditional_2_Conditional_3_For_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 17);
+    i0.ɵɵconditionalCreate(1, RealtimeActivityRailComponent_Conditional_2_Conditional_3_For_5_Conditional_1_Template, 1, 2, "mj-artifact-message-card", 18)(2, RealtimeActivityRailComponent_Conditional_2_Conditional_3_For_5_Conditional_2_Template, 5, 2, "button", 19);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const artifact_r5 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassProp("act-card__artifact--open", ctx_r1.IsArtifactOpen(artifact_r5));
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.CurrentUser ? 1 : 2);
+} }
+function RealtimeActivityRailComponent_Conditional_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 10)(1, "div", 14);
+    i0.ɵɵelement(2, "i", 15);
+    i0.ɵɵtext(3, " Session artifacts ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵrepeaterCreate(4, RealtimeActivityRailComponent_Conditional_2_Conditional_3_For_5_Template, 3, 3, "div", 16, i0.ɵɵcomponentInstance().TrackArtifact, true);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(4);
+    i0.ɵɵrepeater(ctx_r1.ExtraArtifacts);
+} }
+function RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 27);
+    i0.ɵɵelement(1, "i", 32);
     i0.ɵɵtext(2, " Running ");
     i0.ɵɵelementEnd();
 } }
-function RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 13);
-    i0.ɵɵelement(1, "i", 19);
+function RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 28);
+    i0.ɵɵelement(1, "i", 33);
     i0.ɵɵtext(2, " Done ");
     i0.ɵɵelementEnd();
 } }
-function RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 14);
-    i0.ɵɵelement(1, "i", 20);
+function RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 29);
+    i0.ɵɵelement(1, "i", 34);
     i0.ɵɵtext(2, " Failed ");
     i0.ɵɵelementEnd();
 } }
-function RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_9_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 21);
-    i0.ɵɵelement(1, "i", 23);
+function RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_9_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 35);
+    i0.ɵɵelement(1, "i", 37);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", ctx, " ");
 } }
-function RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_9_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 22);
+function RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_9_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 36);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const card_r3 = i0.ɵɵnextContext(2).$implicit;
+    const card_r7 = i0.ɵɵnextContext(2).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(ctx_r1.Preview(card_r3));
+    i0.ɵɵtextInterpolate(ctx_r1.Preview(card_r7));
 } }
-function RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_9_Conditional_0_Template, 3, 1, "div", 21);
-    i0.ɵɵconditionalCreate(1, RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_9_Conditional_1_Template, 2, 1, "div", 22);
+function RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_9_Conditional_0_Template, 3, 1, "div", 35);
+    i0.ɵɵconditionalCreate(1, RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_9_Conditional_1_Template, 2, 1, "div", 36);
 } if (rf & 2) {
     let tmp_12_0;
-    const card_r3 = i0.ɵɵnextContext().$implicit;
+    const card_r7 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵconditional((tmp_12_0 = ctx_r1.Elapsed(card_r3)) ? 0 : -1, tmp_12_0);
+    i0.ɵɵconditional((tmp_12_0 = ctx_r1.Elapsed(card_r7)) ? 0 : -1, tmp_12_0);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.Preview(card_r3) ? 1 : -1);
+    i0.ɵɵconditional(ctx_r1.Preview(card_r7) ? 1 : -1);
 } }
-function RealtimeActivityRailComponent_Conditional_2_For_2_For_11_Template(rf, ctx) { if (rf & 1) {
-    const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 24);
-    i0.ɵɵlistener("click", function RealtimeActivityRailComponent_Conditional_2_For_2_For_11_Template_button_click_0_listener() { const artifact_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OpenArtifact(artifact_r5)); });
-    i0.ɵɵelement(1, "i", 25);
+function RealtimeActivityRailComponent_Conditional_2_For_5_For_11_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-artifact-message-card", 20);
+    i0.ɵɵlistener("actionPerformed", function RealtimeActivityRailComponent_Conditional_2_For_5_For_11_Conditional_1_Template_mj_artifact_message_card_actionPerformed_0_listener() { i0.ɵɵrestoreView(_r8); const artifact_r9 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OpenArtifact(artifact_r9)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const artifact_r9 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵproperty("artifactId", artifact_r9.ArtifactID)("currentUser", ctx_r1.CurrentUser);
+} }
+function RealtimeActivityRailComponent_Conditional_2_For_5_For_11_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 21);
+    i0.ɵɵlistener("click", function RealtimeActivityRailComponent_Conditional_2_For_5_For_11_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const artifact_r9 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OpenArtifact(artifact_r9)); });
+    i0.ɵɵelement(1, "i", 22);
     i0.ɵɵelementStart(2, "span");
-    i0.ɵɵtext(3, "View");
+    i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(4, "i", 26);
+    i0.ɵɵelement(4, "i", 23);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const artifact_r5 = ctx.$implicit;
-    i0.ɵɵproperty("title", "View " + artifact_r5.Name);
+    const artifact_r9 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("title", "View " + artifact_r9.Name);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(artifact_r9.Name);
 } }
-function RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 27);
-    i0.ɵɵlistener("click", function RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_12_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const card_r3 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OpenRun(card_r3)); });
-    i0.ɵɵelement(1, "i", 28);
+function RealtimeActivityRailComponent_Conditional_2_For_5_For_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 17);
+    i0.ɵɵconditionalCreate(1, RealtimeActivityRailComponent_Conditional_2_For_5_For_11_Conditional_1_Template, 1, 2, "mj-artifact-message-card", 18)(2, RealtimeActivityRailComponent_Conditional_2_For_5_For_11_Conditional_2_Template, 5, 2, "button", 19);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const artifact_r9 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassProp("act-card__artifact--open", ctx_r1.IsArtifactOpen(artifact_r9));
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.CurrentUser ? 1 : 2);
+} }
+function RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 38);
+    i0.ɵɵlistener("click", function RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_12_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r11); const card_r7 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OpenRun(card_r7)); });
+    i0.ɵɵelement(1, "i", 39);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "Open run");
     i0.ɵɵelementEnd()();
 } }
-function RealtimeActivityRailComponent_Conditional_2_For_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 9)(1, "div", 10)(2, "span", 11);
+function RealtimeActivityRailComponent_Conditional_2_For_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 24)(1, "div", 25)(2, "span", 26);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_4_Template, 3, 0, "span", 12)(5, RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_5_Template, 3, 0, "span", 13)(6, RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_6_Template, 3, 0, "span", 14);
+    i0.ɵɵconditionalCreate(4, RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_4_Template, 3, 0, "span", 27)(5, RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_5_Template, 3, 0, "span", 28)(6, RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_6_Template, 3, 0, "span", 29);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "div", 15);
+    i0.ɵɵelementStart(7, "div", 30);
     i0.ɵɵtext(8);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(9, RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_9_Template, 2, 2);
-    i0.ɵɵrepeaterCreate(10, RealtimeActivityRailComponent_Conditional_2_For_2_For_11_Template, 5, 1, "button", 16, _forTrack0);
-    i0.ɵɵconditionalCreate(12, RealtimeActivityRailComponent_Conditional_2_For_2_Conditional_12_Template, 4, 0, "button", 17);
+    i0.ɵɵconditionalCreate(9, RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_9_Template, 2, 2);
+    i0.ɵɵrepeaterCreate(10, RealtimeActivityRailComponent_Conditional_2_For_5_For_11_Template, 3, 3, "div", 16, i0.ɵɵcomponentInstance().TrackArtifact, true);
+    i0.ɵɵconditionalCreate(12, RealtimeActivityRailComponent_Conditional_2_For_5_Conditional_12_Template, 4, 0, "button", 31);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const card_r3 = ctx.$implicit;
+    const card_r7 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵclassProp("act-card--running", !card_r3.Done)("act-card--done", card_r3.Done && card_r3.Success)("act-card--failed", card_r3.Done && !card_r3.Success);
+    i0.ɵɵclassProp("act-card--running", !card_r7.Done)("act-card--done", card_r7.Done && card_r7.Success)("act-card--failed", card_r7.Done && !card_r7.Success);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(card_r3.AgentName);
+    i0.ɵɵtextInterpolate(card_r7.AgentName);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(!card_r3.Done ? 4 : card_r3.Success ? 5 : 6);
+    i0.ɵɵconditional(!card_r7.Done ? 4 : card_r7.Success ? 5 : 6);
     i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(ctx_r1.StepLabel(card_r3));
+    i0.ɵɵtextInterpolate(ctx_r1.StepLabel(card_r7));
     i0.ɵɵadvance();
-    i0.ɵɵconditional(card_r3.Done ? 9 : -1);
+    i0.ɵɵconditional(card_r7.Done ? 9 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵrepeater(ctx_r1.CardArtifacts(card_r3));
+    i0.ɵɵrepeater(ctx_r1.CardArtifacts(card_r7));
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.ShowOpenRun(card_r3) ? 12 : -1);
+    i0.ɵɵconditional(ctx_r1.ShowOpenRun(card_r7) ? 12 : -1);
 } }
-function RealtimeActivityRailComponent_Conditional_2_ForEmpty_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 8);
+function RealtimeActivityRailComponent_Conditional_2_ForEmpty_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 12);
     i0.ɵɵtext(1, "Tool and agent calls will appear here as they run.");
     i0.ɵɵelementEnd();
 } }
+function RealtimeActivityRailComponent_Conditional_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    const _r12 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "as-split-area", 13)(1, "div", 40)(2, "div", 41)(3, "span", 42);
+    i0.ɵɵelement(4, "i", 22);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "button", 43);
+    i0.ɵɵlistener("click", function RealtimeActivityRailComponent_Conditional_2_Conditional_7_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.CloseArtifact()); });
+    i0.ɵɵelement(7, "i", 34);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(8, "div", 44);
+    i0.ɵɵelement(9, "mj-artifact-viewer-panel", 45);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const artifact_r13 = ctx;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("size", ctx_r1.SplitArtifactPercent)("minSize", 25);
+    i0.ɵɵadvance(3);
+    i0.ɵɵproperty("title", artifact_r13.Name);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", artifact_r13.Name, " ");
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("artifactId", artifact_r13.ArtifactID)("currentUser", ctx_r1.CurrentUser)("environmentId", ctx_r1.EnvironmentID)("showHeader", false)("showTabs", false)("showSaveToCollection", false)("showCloseButton", false)("showMaximizeButton", false);
+} }
 function RealtimeActivityRailComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 2);
-    i0.ɵɵrepeaterCreate(1, RealtimeActivityRailComponent_Conditional_2_For_2_Template, 13, 11, "div", 7, i0.ɵɵcomponentInstance().TrackCard, true, RealtimeActivityRailComponent_Conditional_2_ForEmpty_3_Template, 2, 0, "div", 8);
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "as-split", 7);
+    i0.ɵɵlistener("dragEnd", function RealtimeActivityRailComponent_Conditional_2_Template_as_split_dragEnd_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnSplitDragEnd($event)); });
+    i0.ɵɵelementStart(1, "as-split-area", 8)(2, "div", 9);
+    i0.ɵɵconditionalCreate(3, RealtimeActivityRailComponent_Conditional_2_Conditional_3_Template, 6, 0, "div", 10);
+    i0.ɵɵrepeaterCreate(4, RealtimeActivityRailComponent_Conditional_2_For_5_Template, 13, 11, "div", 11, i0.ɵɵcomponentInstance().TrackCard, true, RealtimeActivityRailComponent_Conditional_2_ForEmpty_6_Template, 2, 0, "div", 12);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(7, RealtimeActivityRailComponent_Conditional_2_Conditional_7_Template, 10, 12, "as-split-area", 13);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
+    let tmp_7_0;
     const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("gutterSize", ctx_r1.SelectedArtifact ? 8 : 0)("disabled", !ctx_r1.SelectedArtifact)("useTransition", !ctx_r1.PrefersReducedMotion);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("size", ctx_r1.SelectedArtifact ? 100 - ctx_r1.SplitArtifactPercent : 100);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.ExtraArtifacts.length > 0 ? 3 : -1);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.State.Cards);
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional((tmp_7_0 = ctx_r1.SelectedArtifact) ? 7 : -1, tmp_7_0);
 } }
 /**
- * The "Session activity" RIGHT RAIL of the call overlay: a compact, newest-first list
- * of EVERY tool/agent call of the session — so parallel/multiple delegations live here
- * and the conversation thread stays clean.
+ * The "Session activity" surface (the Activity tab's content): a compact, newest-first list
+ * of EVERY tool/agent call of the session — so parallel/multiple delegations live here and
+ * the conversation thread stays clean.
  *
- * Each entry shows agent name, status (Running w/ spinner | Done | Failed), the latest
- * friendly step label, elapsed time for finished work, and a one-line result preview
- * for done items. Active items are emphasized; finished items are dimmed.
+ * Each entry shows agent name, status, the latest friendly step label, elapsed time, and a
+ * one-line result preview. When a run produced ARTIFACTS, each artifact renders as an inline
+ * PREVIEW card (reusing `mj-artifact-message-card`, the same component the conversation
+ * messages use). Clicking a preview SPLITS this pane horizontally — activity list on the
+ * LEFT, the full artifact viewer on the RIGHT (`as-split`); clicking another swaps the right
+ * pane; a close control collapses back to full-width activity. The split width is persisted
+ * per-user via {@link UserInfoEngine} (NOT localStorage). This replaces the old "one surface
+ * tab per artifact" model.
  *
- * Collapsible via the chevron in its header (collapses to a slim toggle strip).
- * Presentational over the same {@link RealtimeSessionState} the thread renders —
- * no subscriptions of its own beyond the state's change notifications.
+ * Collapsible via the chevron in its header (standalone presentation only). Presentational
+ * over the same {@link RealtimeSessionState} the thread renders.
  */
 export class RealtimeActivityRailComponent {
     /** Maximum characters of the result preview in a done card. */
@@ -170,21 +289,39 @@ export class RealtimeActivityRailComponent {
      * right-rail presentation for any other consumer.
      */
     Embedded = false;
+    /** The signed-in user, threaded to the split-pane artifact viewer. */
+    CurrentUser = null;
+    /** The active environment id, threaded to the split-pane artifact viewer. */
+    EnvironmentID = '';
+    /**
+     * Extra artifacts NOT tied to a specific activity card — the SESSION-REVIEW chain's
+     * carryover artifacts. Rendered as a "Session artifacts" group above the activity list so
+     * a reviewed session's outputs are reachable inside the Activity tab (the live path gets
+     * artifacts from each card's `Artifacts`). Empty for a live session.
+     */
+    ExtraArtifacts = [];
     /** Emitted with the delegated run's ID when an entry's dev "Open run" link is clicked. */
     OpenRunRequested = new EventEmitter();
-    /** Emitted when an entry's "View" artifact chip is clicked (focuses the artifact's tab). */
+    /** Emitted when an artifact is opened in the split viewer (lets a host react if it wants). */
     OpenArtifactRequested = new EventEmitter();
-    /** Whether the rail is collapsed to its slim toggle strip. */
+    /** Whether the rail is collapsed to its slim toggle strip (standalone mode only). */
     Collapsed = false;
+    /** The artifact currently shown in the split-pane viewer, or null when the split is closed. */
+    SelectedArtifact = null;
+    /** The artifact (right) pane's width percentage — persisted per-user, clamped on load. */
+    SplitArtifactPercent = ACTIVITY_SPLIT_DEFAULT_PERCENT;
     changedSub;
     cdr = inject(ChangeDetectorRef);
+    /** True while reduced-motion is preferred — disables the split's drag transition. */
+    PrefersReducedMotion = typeof matchMedia === 'function' && matchMedia('(prefers-reduced-motion: reduce)').matches;
     ngOnInit() {
+        this.loadSplitPref();
         this.changedSub = this.State.Changed$.subscribe(() => this.cdr.markForCheck());
     }
     ngOnDestroy() {
         this.changedSub?.unsubscribe();
     }
-    /** Toggle the rail between expanded and slim-collapsed. */
+    /** Toggle the rail between expanded and slim-collapsed (standalone presentation). */
     Toggle() {
         this.Collapsed = !this.Collapsed;
     }
@@ -217,9 +354,48 @@ export class RealtimeActivityRailComponent {
     CardArtifacts(card) {
         return card.Done && card.Artifacts ? card.Artifacts : [];
     }
-    /** Emits the open-artifact request for a card's produced artifact. */
+    /** track fn for the @for over a card's artifacts. */
+    TrackArtifact(index, artifact) {
+        return artifact.ArtifactVersionID;
+    }
+    /** Whether the artifact `a` is the one currently open in the split viewer. */
+    IsArtifactOpen(artifact) {
+        return this.SelectedArtifact?.ArtifactVersionID === artifact.ArtifactVersionID;
+    }
+    /**
+     * Opens (or swaps to) `artifact` in the split-pane viewer: the activity list keeps the
+     * left pane, the full artifact viewer fills the right. Re-opening the same artifact is a
+     * no-op; opening a different one swaps the right pane. Also reachable from the surface-tabs
+     * "View →" affordance.
+     */
     OpenArtifact(artifact) {
+        if (this.SelectedArtifact?.ArtifactVersionID === artifact.ArtifactVersionID) {
+            return;
+        }
+        this.SelectedArtifact = artifact;
         this.OpenArtifactRequested.emit(artifact);
+        this.cdr.markForCheck();
+    }
+    /** Closes the split, returning to a full-width activity list. */
+    CloseArtifact() {
+        if (this.SelectedArtifact) {
+            this.SelectedArtifact = null;
+            this.cdr.markForCheck();
+        }
+    }
+    /**
+     * `as-split` drag finished: adopt + persist the artifact (right) pane's width percentage
+     * per-user (debounced, via {@link UserInfoEngine} — never localStorage). The split reports
+     * the two area sizes (percent here); index 1 is the artifact pane. A wildcard `'*'` size
+     * (non-numeric) is ignored — nothing to persist.
+     */
+    OnSplitDragEnd(event) {
+        const right = event.sizes[1];
+        if (typeof right !== 'number') {
+            return;
+        }
+        this.SplitArtifactPercent = ClampActivitySplitPercent(right);
+        this.persistSplitPref(this.SplitArtifactPercent);
     }
     /** One-line result preview for done items. */
     Preview(card) {
@@ -227,11 +403,32 @@ export class RealtimeActivityRailComponent {
         const max = RealtimeActivityRailComponent.PreviewMaxChars;
         return text.length > max ? `${text.slice(0, max).trimEnd()}…` : text;
     }
+    /** Reads the persisted split width once (tolerant; default tier applies when unset). */
+    loadSplitPref() {
+        try {
+            const percent = ParseActivitySplitPercent(UserInfoEngine.Instance.GetSetting(ACTIVITY_SPLIT_PREF_KEY));
+            if (percent !== null) {
+                this.SplitArtifactPercent = percent;
+            }
+        }
+        catch {
+            // UserInfoEngine not configured (plain-node tests / early bootstrap) — default applies.
+        }
+    }
+    /** Persists the split width preference server-side (debounced, best-effort). */
+    persistSplitPref(percent) {
+        try {
+            UserInfoEngine.Instance.SetSettingDebounced(ACTIVITY_SPLIT_PREF_KEY, SerializeActivitySplitPercent(percent));
+        }
+        catch {
+            // engine unavailable — the width still applies for this session
+        }
+    }
     static ɵfac = function RealtimeActivityRailComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || RealtimeActivityRailComponent)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: RealtimeActivityRailComponent, selectors: [["mj-realtime-activity-rail"]], inputs: { State: "State", DevMode: "DevMode", Embedded: "Embedded" }, outputs: { OpenRunRequested: "OpenRunRequested", OpenArtifactRequested: "OpenArtifactRequested" }, decls: 3, vars: 6, consts: [["aria-label", "Session activity", 1, "rail"], [1, "rail__head"], [1, "rail__list"], ["type", "button", 1, "rail__toggle", 3, "click", "title"], ["aria-hidden", "true", 1, "fa-solid", 3, "ngClass"], [1, "rail__title"], ["aria-hidden", "true", 1, "fa-solid", "fa-list-check"], [1, "act-card", 3, "act-card--running", "act-card--done", "act-card--failed"], [1, "rail__empty"], [1, "act-card"], [1, "act-card__top"], [1, "act-card__name"], [1, "act-status", "act-status--running"], [1, "act-status", "act-status--done"], [1, "act-status", "act-status--failed"], [1, "act-card__step"], ["type", "button", 1, "act-card__artifact-link", 3, "title"], ["type", "button", "title", "Open the delegated agent run record", 1, "act-card__dev-link"], ["aria-hidden", "true", 1, "fa-solid", "fa-spinner", "spin"], ["aria-hidden", "true", 1, "fa-solid", "fa-check"], ["aria-hidden", "true", 1, "fa-solid", "fa-xmark"], [1, "act-card__meta"], [1, "act-card__preview"], ["aria-hidden", "true", 1, "fa-regular", "fa-clock"], ["type", "button", 1, "act-card__artifact-link", 3, "click", "title"], ["aria-hidden", "true", 1, "fa-solid", "fa-file-lines"], ["aria-hidden", "true", 1, "fa-solid", "fa-arrow-right"], ["type", "button", "title", "Open the delegated agent run record", 1, "act-card__dev-link", 3, "click"], ["aria-hidden", "true", 1, "fa-solid", "fa-arrow-up-right-from-square"]], template: function RealtimeActivityRailComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: RealtimeActivityRailComponent, selectors: [["mj-realtime-activity-rail"]], inputs: { State: "State", DevMode: "DevMode", Embedded: "Embedded", CurrentUser: "CurrentUser", EnvironmentID: "EnvironmentID", ExtraArtifacts: "ExtraArtifacts" }, outputs: { OpenRunRequested: "OpenRunRequested", OpenArtifactRequested: "OpenArtifactRequested" }, decls: 3, vars: 6, consts: [["aria-label", "Session activity", 1, "rail"], [1, "rail__head"], ["direction", "horizontal", "unit", "percent", 1, "rail__split", 3, "gutterSize", "disabled", "useTransition"], ["type", "button", 1, "rail__toggle", 3, "click", "title"], ["aria-hidden", "true", 1, "fa-solid", 3, "ngClass"], [1, "rail__title"], ["aria-hidden", "true", 1, "fa-solid", "fa-wave-square"], ["direction", "horizontal", "unit", "percent", 1, "rail__split", 3, "dragEnd", "gutterSize", "disabled", "useTransition"], [3, "size"], [1, "rail__list"], [1, "rail__group"], [1, "act-card", 3, "act-card--running", "act-card--done", "act-card--failed"], [1, "rail__empty"], [3, "size", "minSize"], [1, "rail__group-title"], ["aria-hidden", "true", 1, "fa-solid", "fa-folder-open"], [1, "act-card__artifact", 3, "act-card__artifact--open"], [1, "act-card__artifact"], [3, "artifactId", "currentUser"], ["type", "button", 1, "act-card__artifact-link", 3, "title"], [3, "actionPerformed", "artifactId", "currentUser"], ["type", "button", 1, "act-card__artifact-link", 3, "click", "title"], ["aria-hidden", "true", 1, "fa-solid", "fa-file-lines"], ["aria-hidden", "true", 1, "fa-solid", "fa-up-right-and-down-left-from-center"], [1, "act-card"], [1, "act-card__top"], [1, "act-card__name"], [1, "act-status", "act-status--running"], [1, "act-status", "act-status--done"], [1, "act-status", "act-status--failed"], [1, "act-card__step"], ["type", "button", "title", "Open the delegated agent run record", 1, "act-card__dev-link"], ["aria-hidden", "true", 1, "fa-solid", "fa-spinner", "spin"], ["aria-hidden", "true", 1, "fa-solid", "fa-check"], ["aria-hidden", "true", 1, "fa-solid", "fa-xmark"], [1, "act-card__meta"], [1, "act-card__preview"], ["aria-hidden", "true", 1, "fa-regular", "fa-clock"], ["type", "button", "title", "Open the delegated agent run record", 1, "act-card__dev-link", 3, "click"], ["aria-hidden", "true", 1, "fa-solid", "fa-arrow-up-right-from-square"], [1, "rail__viewer"], [1, "rail__viewer-head"], [1, "rail__viewer-title", 3, "title"], ["type", "button", "title", "Close artifact", "aria-label", "Close artifact", 1, "rail__viewer-close", 3, "click"], [1, "rail__viewer-body"], [3, "artifactId", "currentUser", "environmentId", "showHeader", "showTabs", "showSaveToCollection", "showCloseButton", "showMaximizeButton"]], template: function RealtimeActivityRailComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "aside", 0);
             i0.ɵɵconditionalCreate(1, RealtimeActivityRailComponent_Conditional_1_Template, 4, 4, "div", 1);
-            i0.ɵɵconditionalCreate(2, RealtimeActivityRailComponent_Conditional_2_Template, 4, 1, "div", 2);
+            i0.ɵɵconditionalCreate(2, RealtimeActivityRailComponent_Conditional_2_Template, 8, 7, "as-split", 2);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵclassProp("rail--collapsed", ctx.Collapsed && !ctx.Embedded)("rail--embedded", ctx.Embedded);
@@ -239,11 +436,11 @@ export class RealtimeActivityRailComponent {
             i0.ɵɵconditional(!ctx.Embedded ? 1 : -1);
             i0.ɵɵadvance();
             i0.ɵɵconditional(!ctx.Collapsed || ctx.Embedded ? 2 : -1);
-        } }, dependencies: [CommonModule, i1.NgClass], styles: ["[_nghost-%COMP%] {\n  display: block;\n  height: 100%;\n  --sage: var(--mj-color-violet-400, #a78bfa);\n  --sage-bg: color-mix(in srgb, var(--mj-color-violet-400, #a78bfa) 10%, transparent);\n  --sage-border: color-mix(in srgb, var(--mj-color-violet-400, #a78bfa) 38%, transparent);\n}\n\n.rail[_ngcontent-%COMP%] {\n  width: 308px;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  border-left: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n  transition: width 180ms ease;\n}\n.rail--collapsed[_ngcontent-%COMP%] {\n  width: 40px;\n}\n\n\n\n\n.rail--embedded[_ngcontent-%COMP%] {\n  width: 100%;\n  border-left: 0;\n}\n\n.rail__head[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 12px;\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n.rail--collapsed[_ngcontent-%COMP%]   .rail__head[_ngcontent-%COMP%] {\n  justify-content: center;\n  padding: 10px 6px;\n  border-bottom-color: transparent;\n}\n.rail__toggle[_ngcontent-%COMP%] {\n  width: 24px;\n  height: 24px;\n  display: grid;\n  place-items: center;\n  background: transparent;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  flex-shrink: 0;\n  font-size: 10px;\n  transition: color 140ms ease, border-color 140ms ease;\n}\n.rail__toggle[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-primary);\n  border-color: var(--mj-border-strong);\n}\n.rail__title[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--mj-text-secondary);\n  display: inline-flex;\n  align-items: center;\n  gap: 7px;\n  white-space: nowrap;\n}\n.rail__title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n}\n\n.rail__list[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 10px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  scrollbar-width: thin;\n  scrollbar-color: var(--mj-border-strong) transparent;\n}\n.rail__list[_ngcontent-%COMP%]::-webkit-scrollbar {\n  width: 6px;\n}\n.rail__list[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n  background: var(--mj-border-strong);\n  border-radius: 3px;\n}\n\n.rail__empty[_ngcontent-%COMP%] {\n  font-size: 11.5px;\n  color: var(--mj-text-disabled);\n  text-align: center;\n  padding: 18px 8px;\n}\n\n\n\n.act-card[_ngcontent-%COMP%] {\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg, 10px);\n  padding: 8px 10px;\n  background: var(--mj-bg-surface);\n}\n.act-card--running[_ngcontent-%COMP%] {\n  border-color: var(--sage-border);\n  background: var(--sage-bg);\n  box-shadow: 0 0 0 1px var(--sage-border);\n}\n.act-card--done[_ngcontent-%COMP%], \n.act-card--failed[_ngcontent-%COMP%] {\n  opacity: 0.72;\n}\n.act-card--done[_ngcontent-%COMP%]:hover, \n.act-card--failed[_ngcontent-%COMP%]:hover {\n  opacity: 1;\n}\n\n.act-card__top[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n}\n.act-card__name[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  min-width: 0;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.act-status[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  font-size: 10px;\n  font-weight: 700;\n  padding: 1px 7px;\n  border-radius: var(--mj-radius-full, 9999px);\n  flex-shrink: 0;\n  line-height: 1.6;\n}\n.act-status[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 8.5px; }\n.act-status--running[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--sage) 18%, transparent);\n  color: var(--mj-color-violet-300, var(--mj-text-secondary));\n  border: 1px solid var(--sage-border);\n}\n.act-status--done[_ngcontent-%COMP%] {\n  background: var(--mj-status-success-bg, transparent);\n  color: var(--mj-status-success);\n  border: 1px solid color-mix(in srgb, var(--mj-status-success) 35%, transparent);\n}\n.act-status--failed[_ngcontent-%COMP%] {\n  background: var(--mj-status-error-bg, transparent);\n  color: var(--mj-status-error);\n  border: 1px solid color-mix(in srgb, var(--mj-status-error) 35%, transparent);\n}\n.spin[_ngcontent-%COMP%] {\n  animation: _ngcontent-%COMP%_rail-spin 1.1s linear infinite;\n}\n\n.act-card__step[_ngcontent-%COMP%] {\n  font-size: 11.5px;\n  color: var(--mj-text-secondary);\n  margin-top: 4px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.act-card--running[_ngcontent-%COMP%]   .act-card__step[_ngcontent-%COMP%] {\n  color: var(--mj-text-primary);\n  font-weight: 600;\n}\n.act-card__meta[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n  margin-top: 4px;\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n}\n.act-card__preview[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  margin-top: 3px;\n  line-height: 1.45;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n\n\n.act-card__artifact-link[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 5px;\n  margin-top: 6px;\n  margin-right: 6px;\n  padding: 2px 9px;\n  border-radius: var(--mj-radius-full, 9999px);\n  border: 1px solid var(--sage-border);\n  background: var(--sage-bg);\n  color: var(--mj-color-violet-300, var(--mj-text-secondary));\n  font-family: inherit;\n  font-size: 10px;\n  font-weight: 700;\n  cursor: pointer;\n  transition: color 140ms ease, border-color 140ms ease, background 140ms ease;\n}\n.act-card__artifact-link[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-primary);\n  border-color: var(--sage);\n  background: color-mix(in srgb, var(--sage) 18%, transparent);\n}\n.act-card__artifact-link[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 9px;\n}\n\n\n\n.act-card__dev-link[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  margin-top: 6px;\n  padding: 2px 8px;\n  border-radius: var(--mj-radius-full, 9999px);\n  border: 1px dashed var(--mj-border-strong);\n  background: transparent;\n  color: var(--mj-text-muted);\n  font-family: inherit;\n  font-size: 10px;\n  font-weight: 700;\n  cursor: pointer;\n  transition: color 140ms ease, border-color 140ms ease, background 140ms ease;\n}\n.act-card__dev-link[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-link, var(--mj-brand-primary));\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, transparent);\n}\n.act-card__dev-link[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 8px;\n}\n\n@keyframes _ngcontent-%COMP%_rail-spin {\n  to { transform: rotate(360deg); }\n}\n\n\n\n\n@media (max-width: 860px) {\n  .rail[_ngcontent-%COMP%]:not(.rail--embedded) {\n    display: none;\n  }\n}"] });
+        } }, dependencies: [CommonModule, i1.NgClass, AngularSplitModule, i2.SplitComponent, i2.SplitAreaComponent, ArtifactsModule, i3.ArtifactViewerPanelComponent, i3.ArtifactMessageCardComponent], styles: ["[_nghost-%COMP%] {\n  display: block;\n  height: 100%;\n  --sage: var(--mj-color-violet-400, #a78bfa);\n  --sage-bg: color-mix(in srgb, var(--mj-color-violet-400, #a78bfa) 10%, transparent);\n  --sage-border: color-mix(in srgb, var(--mj-color-violet-400, #a78bfa) 38%, transparent);\n}\n\n.rail[_ngcontent-%COMP%] {\n  width: 308px;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  border-left: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n  transition: width 180ms ease;\n}\n.rail--collapsed[_ngcontent-%COMP%] {\n  width: 40px;\n}\n\n\n\n\n.rail--embedded[_ngcontent-%COMP%] {\n  width: 100%;\n  border-left: 0;\n}\n\n.rail__head[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 12px;\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n.rail--collapsed[_ngcontent-%COMP%]   .rail__head[_ngcontent-%COMP%] {\n  justify-content: center;\n  padding: 10px 6px;\n  border-bottom-color: transparent;\n}\n.rail__toggle[_ngcontent-%COMP%] {\n  width: 24px;\n  height: 24px;\n  display: grid;\n  place-items: center;\n  background: transparent;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  flex-shrink: 0;\n  font-size: 10px;\n  transition: color 140ms ease, border-color 140ms ease;\n}\n.rail__toggle[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-primary);\n  border-color: var(--mj-border-strong);\n}\n.rail__title[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--mj-text-secondary);\n  display: inline-flex;\n  align-items: center;\n  gap: 7px;\n  white-space: nowrap;\n}\n.rail__title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n}\n\n\n\n.rail__split[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  width: 100%;\n  height: 100%;\n}\n\n.rail__list[_ngcontent-%COMP%] {\n  height: 100%;\n  overflow-y: auto;\n  padding: 10px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  scrollbar-width: thin;\n  scrollbar-color: var(--mj-border-strong) transparent;\n}\n.rail__list[_ngcontent-%COMP%]::-webkit-scrollbar {\n  width: 6px;\n}\n.rail__list[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n  background: var(--mj-border-strong);\n  border-radius: 3px;\n}\n\n.rail__empty[_ngcontent-%COMP%] {\n  font-size: 11.5px;\n  color: var(--mj-text-disabled);\n  text-align: center;\n  padding: 18px 8px;\n}\n\n\n\n.rail__group[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  padding-bottom: 8px;\n  margin-bottom: 4px;\n  border-bottom: 1px dashed var(--mj-border-default);\n}\n.rail__group-title[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 10.5px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  color: var(--mj-text-muted);\n}\n.rail__group-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--sage);\n}\n\n\n\n.rail__viewer[_ngcontent-%COMP%] {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n  background: var(--mj-bg-surface);\n  border-left: 1px solid var(--mj-border-default);\n}\n.rail__viewer-head[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n  padding: 8px 10px;\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n.rail__viewer-title[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 7px;\n  min-width: 0;\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.rail__viewer-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--sage);\n  flex-shrink: 0;\n}\n.rail__viewer-close[_ngcontent-%COMP%] {\n  width: 24px;\n  height: 24px;\n  display: grid;\n  place-items: center;\n  background: transparent;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  flex-shrink: 0;\n  font-size: 11px;\n  transition: color 140ms ease, border-color 140ms ease;\n}\n.rail__viewer-close[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-primary);\n  border-color: var(--mj-border-strong);\n}\n.rail__viewer-body[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n.rail__viewer-body[_ngcontent-%COMP%]    > *[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n}\n\n\n\n.act-card[_ngcontent-%COMP%] {\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg, 10px);\n  padding: 8px 10px;\n  background: var(--mj-bg-surface);\n}\n.act-card--running[_ngcontent-%COMP%] {\n  border-color: var(--sage-border);\n  background: var(--sage-bg);\n  box-shadow: 0 0 0 1px var(--sage-border);\n}\n.act-card--done[_ngcontent-%COMP%], \n.act-card--failed[_ngcontent-%COMP%] {\n  opacity: 0.72;\n}\n.act-card--done[_ngcontent-%COMP%]:hover, \n.act-card--failed[_ngcontent-%COMP%]:hover {\n  opacity: 1;\n}\n\n.act-card__top[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n}\n.act-card__name[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  min-width: 0;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.act-status[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  font-size: 10px;\n  font-weight: 700;\n  padding: 1px 7px;\n  border-radius: var(--mj-radius-full, 9999px);\n  flex-shrink: 0;\n  line-height: 1.6;\n}\n.act-status[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 8.5px; }\n.act-status--running[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--sage) 18%, transparent);\n  color: var(--mj-color-violet-300, var(--mj-text-secondary));\n  border: 1px solid var(--sage-border);\n}\n.act-status--done[_ngcontent-%COMP%] {\n  background: var(--mj-status-success-bg, transparent);\n  color: var(--mj-status-success);\n  border: 1px solid color-mix(in srgb, var(--mj-status-success) 35%, transparent);\n}\n.act-status--failed[_ngcontent-%COMP%] {\n  background: var(--mj-status-error-bg, transparent);\n  color: var(--mj-status-error);\n  border: 1px solid color-mix(in srgb, var(--mj-status-error) 35%, transparent);\n}\n.spin[_ngcontent-%COMP%] {\n  animation: _ngcontent-%COMP%_rail-spin 1.1s linear infinite;\n}\n\n.act-card__step[_ngcontent-%COMP%] {\n  font-size: 11.5px;\n  color: var(--mj-text-secondary);\n  margin-top: 4px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.act-card--running[_ngcontent-%COMP%]   .act-card__step[_ngcontent-%COMP%] {\n  color: var(--mj-text-primary);\n  font-weight: 600;\n}\n.act-card__meta[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n  margin-top: 4px;\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n}\n.act-card__preview[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  margin-top: 3px;\n  line-height: 1.45;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n\n\n.act-card__artifact[_ngcontent-%COMP%] {\n  margin-top: 6px;\n  border-radius: var(--mj-radius-lg, 10px);\n  transition: box-shadow 140ms ease;\n}\n\n\n.act-card__artifact[_ngcontent-%COMP%]     .artifact-message-card {\n  margin: 0;\n}\n\n\n.act-card__artifact--open[_ngcontent-%COMP%] {\n  box-shadow: 0 0 0 2px var(--sage);\n  border-radius: calc(var(--mj-radius-lg, 10px) + 2px);\n}\n\n\n\n.act-card__artifact-link[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 5px;\n  padding: 2px 9px;\n  border-radius: var(--mj-radius-full, 9999px);\n  border: 1px solid var(--sage-border);\n  background: var(--sage-bg);\n  color: var(--mj-color-violet-300, var(--mj-text-secondary));\n  font-family: inherit;\n  font-size: 10px;\n  font-weight: 700;\n  cursor: pointer;\n  max-width: 100%;\n  transition: color 140ms ease, border-color 140ms ease, background 140ms ease;\n}\n.act-card__artifact-link[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-primary);\n  border-color: var(--sage);\n  background: color-mix(in srgb, var(--sage) 18%, transparent);\n}\n.act-card__artifact-link[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.act-card__artifact-link[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 9px;\n  flex-shrink: 0;\n}\n\n\n\n.act-card__dev-link[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  margin-top: 6px;\n  padding: 2px 8px;\n  border-radius: var(--mj-radius-full, 9999px);\n  border: 1px dashed var(--mj-border-strong);\n  background: transparent;\n  color: var(--mj-text-muted);\n  font-family: inherit;\n  font-size: 10px;\n  font-weight: 700;\n  cursor: pointer;\n  transition: color 140ms ease, border-color 140ms ease, background 140ms ease;\n}\n.act-card__dev-link[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-link, var(--mj-brand-primary));\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, transparent);\n}\n.act-card__dev-link[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 8px;\n}\n\n@keyframes _ngcontent-%COMP%_rail-spin {\n  to { transform: rotate(360deg); }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .rail[_ngcontent-%COMP%] { transition: none; }\n  .spin[_ngcontent-%COMP%] { animation: none; }\n}\n\n\n\n\n@media (max-width: 860px) {\n  .rail[_ngcontent-%COMP%]:not(.rail--embedded) {\n    display: none;\n  }\n}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(RealtimeActivityRailComponent, [{
         type: Component,
-        args: [{ standalone: true, selector: 'mj-realtime-activity-rail', imports: [CommonModule], template: "<aside class=\"rail\" [class.rail--collapsed]=\"Collapsed && !Embedded\" [class.rail--embedded]=\"Embedded\" aria-label=\"Session activity\">\n  @if (!Embedded) {\n    <div class=\"rail__head\">\n      <button type=\"button\"\n              class=\"rail__toggle\"\n              (click)=\"Toggle()\"\n              [title]=\"Collapsed ? 'Show session activity' : 'Hide session activity'\"\n              [attr.aria-expanded]=\"!Collapsed\">\n        <i class=\"fa-solid\" [ngClass]=\"Collapsed ? 'fa-chevron-left' : 'fa-chevron-right'\" aria-hidden=\"true\"></i>\n      </button>\n      @if (!Collapsed) {\n        <span class=\"rail__title\">\n          <i class=\"fa-solid fa-list-check\" aria-hidden=\"true\"></i>\n          Session activity\n        </span>\n      }\n    </div>\n  }\n\n  @if (!Collapsed || Embedded) {\n    <div class=\"rail__list\">\n      @for (card of State.Cards; track TrackCard($index, card)) {\n        <div class=\"act-card\"\n             [class.act-card--running]=\"!card.Done\"\n             [class.act-card--done]=\"card.Done && card.Success\"\n             [class.act-card--failed]=\"card.Done && !card.Success\">\n          <div class=\"act-card__top\">\n            <span class=\"act-card__name\">{{ card.AgentName }}</span>\n            @if (!card.Done) {\n              <span class=\"act-status act-status--running\">\n                <i class=\"fa-solid fa-spinner spin\" aria-hidden=\"true\"></i> Running\n              </span>\n            } @else if (card.Success) {\n              <span class=\"act-status act-status--done\">\n                <i class=\"fa-solid fa-check\" aria-hidden=\"true\"></i> Done\n              </span>\n            } @else {\n              <span class=\"act-status act-status--failed\">\n                <i class=\"fa-solid fa-xmark\" aria-hidden=\"true\"></i> Failed\n              </span>\n            }\n          </div>\n          <div class=\"act-card__step\">{{ StepLabel(card) }}</div>\n          @if (card.Done) {\n            @if (Elapsed(card); as elapsed) {\n              <div class=\"act-card__meta\">\n                <i class=\"fa-regular fa-clock\" aria-hidden=\"true\"></i> {{ elapsed }}\n              </div>\n            }\n            @if (Preview(card)) {\n              <div class=\"act-card__preview\">{{ Preview(card) }}</div>\n            }\n          }\n          @for (artifact of CardArtifacts(card); track artifact.ArtifactVersionID) {\n            <button type=\"button\" class=\"act-card__artifact-link\" (click)=\"OpenArtifact(artifact)\"\n                    [title]=\"'View ' + artifact.Name\">\n              <i class=\"fa-solid fa-file-lines\" aria-hidden=\"true\"></i>\n              <span>View</span>\n              <i class=\"fa-solid fa-arrow-right\" aria-hidden=\"true\"></i>\n            </button>\n          }\n          @if (ShowOpenRun(card)) {\n            <button type=\"button\" class=\"act-card__dev-link\" (click)=\"OpenRun(card)\"\n                    title=\"Open the delegated agent run record\">\n              <i class=\"fa-solid fa-arrow-up-right-from-square\" aria-hidden=\"true\"></i>\n              <span>Open run</span>\n            </button>\n          }\n        </div>\n      } @empty {\n        <div class=\"rail__empty\">Tool and agent calls will appear here as they run.</div>\n      }\n    </div>\n  }\n</aside>\n", styles: [":host {\n  display: block;\n  height: 100%;\n  --sage: var(--mj-color-violet-400, #a78bfa);\n  --sage-bg: color-mix(in srgb, var(--mj-color-violet-400, #a78bfa) 10%, transparent);\n  --sage-border: color-mix(in srgb, var(--mj-color-violet-400, #a78bfa) 38%, transparent);\n}\n\n.rail {\n  width: 308px;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  border-left: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n  transition: width 180ms ease;\n}\n.rail--collapsed {\n  width: 40px;\n}\n\n/* EMBEDDED in the surface panel's Activity tab: the panel owns chrome + collapse,\n   so the rail stretches to the pane and drops its own border. */\n.rail--embedded {\n  width: 100%;\n  border-left: 0;\n}\n\n.rail__head {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 12px;\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n.rail--collapsed .rail__head {\n  justify-content: center;\n  padding: 10px 6px;\n  border-bottom-color: transparent;\n}\n.rail__toggle {\n  width: 24px;\n  height: 24px;\n  display: grid;\n  place-items: center;\n  background: transparent;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  flex-shrink: 0;\n  font-size: 10px;\n  transition: color 140ms ease, border-color 140ms ease;\n}\n.rail__toggle:hover {\n  color: var(--mj-text-primary);\n  border-color: var(--mj-border-strong);\n}\n.rail__title {\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--mj-text-secondary);\n  display: inline-flex;\n  align-items: center;\n  gap: 7px;\n  white-space: nowrap;\n}\n.rail__title i {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n}\n\n.rail__list {\n  flex: 1;\n  overflow-y: auto;\n  padding: 10px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  scrollbar-width: thin;\n  scrollbar-color: var(--mj-border-strong) transparent;\n}\n.rail__list::-webkit-scrollbar {\n  width: 6px;\n}\n.rail__list::-webkit-scrollbar-thumb {\n  background: var(--mj-border-strong);\n  border-radius: 3px;\n}\n\n.rail__empty {\n  font-size: 11.5px;\n  color: var(--mj-text-disabled);\n  text-align: center;\n  padding: 18px 8px;\n}\n\n/* ---------- Activity cards ---------- */\n.act-card {\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg, 10px);\n  padding: 8px 10px;\n  background: var(--mj-bg-surface);\n}\n.act-card--running {\n  border-color: var(--sage-border);\n  background: var(--sage-bg);\n  box-shadow: 0 0 0 1px var(--sage-border);\n}\n.act-card--done,\n.act-card--failed {\n  opacity: 0.72;\n}\n.act-card--done:hover,\n.act-card--failed:hover {\n  opacity: 1;\n}\n\n.act-card__top {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n}\n.act-card__name {\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  min-width: 0;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.act-status {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  font-size: 10px;\n  font-weight: 700;\n  padding: 1px 7px;\n  border-radius: var(--mj-radius-full, 9999px);\n  flex-shrink: 0;\n  line-height: 1.6;\n}\n.act-status i { font-size: 8.5px; }\n.act-status--running {\n  background: color-mix(in srgb, var(--sage) 18%, transparent);\n  color: var(--mj-color-violet-300, var(--mj-text-secondary));\n  border: 1px solid var(--sage-border);\n}\n.act-status--done {\n  background: var(--mj-status-success-bg, transparent);\n  color: var(--mj-status-success);\n  border: 1px solid color-mix(in srgb, var(--mj-status-success) 35%, transparent);\n}\n.act-status--failed {\n  background: var(--mj-status-error-bg, transparent);\n  color: var(--mj-status-error);\n  border: 1px solid color-mix(in srgb, var(--mj-status-error) 35%, transparent);\n}\n.spin {\n  animation: rail-spin 1.1s linear infinite;\n}\n\n.act-card__step {\n  font-size: 11.5px;\n  color: var(--mj-text-secondary);\n  margin-top: 4px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.act-card--running .act-card__step {\n  color: var(--mj-text-primary);\n  font-weight: 600;\n}\n.act-card__meta {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n  margin-top: 4px;\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n}\n.act-card__preview {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  margin-top: 3px;\n  line-height: 1.45;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n/* \"View \u2192\" chip for an artifact a delegated run produced (focuses its surface tab) */\n.act-card__artifact-link {\n  display: inline-flex;\n  align-items: center;\n  gap: 5px;\n  margin-top: 6px;\n  margin-right: 6px;\n  padding: 2px 9px;\n  border-radius: var(--mj-radius-full, 9999px);\n  border: 1px solid var(--sage-border);\n  background: var(--sage-bg);\n  color: var(--mj-color-violet-300, var(--mj-text-secondary));\n  font-family: inherit;\n  font-size: 10px;\n  font-weight: 700;\n  cursor: pointer;\n  transition: color 140ms ease, border-color 140ms ease, background 140ms ease;\n}\n.act-card__artifact-link:hover {\n  color: var(--mj-text-primary);\n  border-color: var(--sage);\n  background: color-mix(in srgb, var(--sage) 18%, transparent);\n}\n.act-card__artifact-link i {\n  font-size: 9px;\n}\n\n/* Gear-gated developer link to the delegated run record */\n.act-card__dev-link {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  margin-top: 6px;\n  padding: 2px 8px;\n  border-radius: var(--mj-radius-full, 9999px);\n  border: 1px dashed var(--mj-border-strong);\n  background: transparent;\n  color: var(--mj-text-muted);\n  font-family: inherit;\n  font-size: 10px;\n  font-weight: 700;\n  cursor: pointer;\n  transition: color 140ms ease, border-color 140ms ease, background 140ms ease;\n}\n.act-card__dev-link:hover {\n  color: var(--mj-text-link, var(--mj-brand-primary));\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, transparent);\n}\n.act-card__dev-link i {\n  font-size: 8px;\n}\n\n@keyframes rail-spin {\n  to { transform: rotate(360deg); }\n}\n\n/* On narrow widths the STANDALONE rail stacks out of the way (overlay falls back to a\n   single column). The embedded rail is governed by the surface panel's own breakpoint. */\n@media (max-width: 860px) {\n  .rail:not(.rail--embedded) {\n    display: none;\n  }\n}\n"] }]
+        args: [{ standalone: true, selector: 'mj-realtime-activity-rail', imports: [CommonModule, AngularSplitModule, ArtifactsModule], template: "<aside class=\"rail\" [class.rail--collapsed]=\"Collapsed && !Embedded\" [class.rail--embedded]=\"Embedded\" aria-label=\"Session activity\">\n  @if (!Embedded) {\n    <div class=\"rail__head\">\n      <button type=\"button\"\n              class=\"rail__toggle\"\n              (click)=\"Toggle()\"\n              [title]=\"Collapsed ? 'Show session activity' : 'Hide session activity'\"\n              [attr.aria-expanded]=\"!Collapsed\">\n        <i class=\"fa-solid\" [ngClass]=\"Collapsed ? 'fa-chevron-left' : 'fa-chevron-right'\" aria-hidden=\"true\"></i>\n      </button>\n      @if (!Collapsed) {\n        <span class=\"rail__title\">\n          <i class=\"fa-solid fa-wave-square\" aria-hidden=\"true\"></i>\n          Session activity\n        </span>\n      }\n    </div>\n  }\n\n  @if (!Collapsed || Embedded) {\n    <as-split class=\"rail__split\"\n              direction=\"horizontal\"\n              unit=\"percent\"\n              [gutterSize]=\"SelectedArtifact ? 8 : 0\"\n              [disabled]=\"!SelectedArtifact\"\n              [useTransition]=\"!PrefersReducedMotion\"\n              (dragEnd)=\"OnSplitDragEnd($event)\">\n\n      <!-- LEFT: the activity list (full width until an artifact splits the pane) -->\n      <as-split-area [size]=\"SelectedArtifact ? (100 - SplitArtifactPercent) : 100\">\n        <div class=\"rail__list\">\n          @if (ExtraArtifacts.length > 0) {\n            <div class=\"rail__group\">\n              <div class=\"rail__group-title\">\n                <i class=\"fa-solid fa-folder-open\" aria-hidden=\"true\"></i> Session artifacts\n              </div>\n              @for (artifact of ExtraArtifacts; track TrackArtifact($index, artifact)) {\n                <div class=\"act-card__artifact\"\n                     [class.act-card__artifact--open]=\"IsArtifactOpen(artifact)\">\n                  @if (CurrentUser) {\n                    <mj-artifact-message-card\n                      [artifactId]=\"artifact.ArtifactID\"\n                      [currentUser]=\"CurrentUser\"\n                      (actionPerformed)=\"OpenArtifact(artifact)\">\n                    </mj-artifact-message-card>\n                  } @else {\n                    <button type=\"button\" class=\"act-card__artifact-link\" (click)=\"OpenArtifact(artifact)\"\n                            [title]=\"'View ' + artifact.Name\">\n                      <i class=\"fa-solid fa-file-lines\" aria-hidden=\"true\"></i>\n                      <span>{{ artifact.Name }}</span>\n                      <i class=\"fa-solid fa-up-right-and-down-left-from-center\" aria-hidden=\"true\"></i>\n                    </button>\n                  }\n                </div>\n              }\n            </div>\n          }\n          @for (card of State.Cards; track TrackCard($index, card)) {\n            <div class=\"act-card\"\n                 [class.act-card--running]=\"!card.Done\"\n                 [class.act-card--done]=\"card.Done && card.Success\"\n                 [class.act-card--failed]=\"card.Done && !card.Success\">\n              <div class=\"act-card__top\">\n                <span class=\"act-card__name\">{{ card.AgentName }}</span>\n                @if (!card.Done) {\n                  <span class=\"act-status act-status--running\">\n                    <i class=\"fa-solid fa-spinner spin\" aria-hidden=\"true\"></i> Running\n                  </span>\n                } @else if (card.Success) {\n                  <span class=\"act-status act-status--done\">\n                    <i class=\"fa-solid fa-check\" aria-hidden=\"true\"></i> Done\n                  </span>\n                } @else {\n                  <span class=\"act-status act-status--failed\">\n                    <i class=\"fa-solid fa-xmark\" aria-hidden=\"true\"></i> Failed\n                  </span>\n                }\n              </div>\n              <div class=\"act-card__step\">{{ StepLabel(card) }}</div>\n              @if (card.Done) {\n                @if (Elapsed(card); as elapsed) {\n                  <div class=\"act-card__meta\">\n                    <i class=\"fa-regular fa-clock\" aria-hidden=\"true\"></i> {{ elapsed }}\n                  </div>\n                }\n                @if (Preview(card)) {\n                  <div class=\"act-card__preview\">{{ Preview(card) }}</div>\n                }\n              }\n              @for (artifact of CardArtifacts(card); track TrackArtifact($index, artifact)) {\n                <div class=\"act-card__artifact\"\n                     [class.act-card__artifact--open]=\"IsArtifactOpen(artifact)\">\n                  @if (CurrentUser) {\n                    <!-- Inline preview (same component the conversation message cards use);\n                         clicking expands it into the split-pane viewer on the right. -->\n                    <mj-artifact-message-card\n                      [artifactId]=\"artifact.ArtifactID\"\n                      [currentUser]=\"CurrentUser\"\n                      (actionPerformed)=\"OpenArtifact(artifact)\">\n                    </mj-artifact-message-card>\n                  } @else {\n                    <button type=\"button\" class=\"act-card__artifact-link\" (click)=\"OpenArtifact(artifact)\"\n                            [title]=\"'View ' + artifact.Name\">\n                      <i class=\"fa-solid fa-file-lines\" aria-hidden=\"true\"></i>\n                      <span>{{ artifact.Name }}</span>\n                      <i class=\"fa-solid fa-up-right-and-down-left-from-center\" aria-hidden=\"true\"></i>\n                    </button>\n                  }\n                </div>\n              }\n              @if (ShowOpenRun(card)) {\n                <button type=\"button\" class=\"act-card__dev-link\" (click)=\"OpenRun(card)\"\n                        title=\"Open the delegated agent run record\">\n                  <i class=\"fa-solid fa-arrow-up-right-from-square\" aria-hidden=\"true\"></i>\n                  <span>Open run</span>\n                </button>\n              }\n            </div>\n          } @empty {\n            <div class=\"rail__empty\">Tool and agent calls will appear here as they run.</div>\n          }\n        </div>\n      </as-split-area>\n\n      <!-- RIGHT: the full artifact viewer (only present while an artifact is open) -->\n      @if (SelectedArtifact; as artifact) {\n        <as-split-area [size]=\"SplitArtifactPercent\" [minSize]=\"25\">\n          <div class=\"rail__viewer\">\n            <div class=\"rail__viewer-head\">\n              <span class=\"rail__viewer-title\" [title]=\"artifact.Name\">\n                <i class=\"fa-solid fa-file-lines\" aria-hidden=\"true\"></i>\n                {{ artifact.Name }}\n              </span>\n              <button type=\"button\" class=\"rail__viewer-close\" (click)=\"CloseArtifact()\"\n                      title=\"Close artifact\" aria-label=\"Close artifact\">\n                <i class=\"fa-solid fa-xmark\" aria-hidden=\"true\"></i>\n              </button>\n            </div>\n            <div class=\"rail__viewer-body\">\n              <mj-artifact-viewer-panel\n                [artifactId]=\"artifact.ArtifactID\"\n                [currentUser]=\"CurrentUser!\"\n                [environmentId]=\"EnvironmentID\"\n                [showHeader]=\"false\"\n                [showTabs]=\"false\"\n                [showSaveToCollection]=\"false\"\n                [showCloseButton]=\"false\"\n                [showMaximizeButton]=\"false\">\n              </mj-artifact-viewer-panel>\n            </div>\n          </div>\n        </as-split-area>\n      }\n    </as-split>\n  }\n</aside>\n", styles: [":host {\n  display: block;\n  height: 100%;\n  --sage: var(--mj-color-violet-400, #a78bfa);\n  --sage-bg: color-mix(in srgb, var(--mj-color-violet-400, #a78bfa) 10%, transparent);\n  --sage-border: color-mix(in srgb, var(--mj-color-violet-400, #a78bfa) 38%, transparent);\n}\n\n.rail {\n  width: 308px;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  border-left: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n  transition: width 180ms ease;\n}\n.rail--collapsed {\n  width: 40px;\n}\n\n/* EMBEDDED in the surface panel's Activity tab: the panel owns chrome + collapse,\n   so the rail stretches to the pane and drops its own border. */\n.rail--embedded {\n  width: 100%;\n  border-left: 0;\n}\n\n.rail__head {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 12px;\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n.rail--collapsed .rail__head {\n  justify-content: center;\n  padding: 10px 6px;\n  border-bottom-color: transparent;\n}\n.rail__toggle {\n  width: 24px;\n  height: 24px;\n  display: grid;\n  place-items: center;\n  background: transparent;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  flex-shrink: 0;\n  font-size: 10px;\n  transition: color 140ms ease, border-color 140ms ease;\n}\n.rail__toggle:hover {\n  color: var(--mj-text-primary);\n  border-color: var(--mj-border-strong);\n}\n.rail__title {\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--mj-text-secondary);\n  display: inline-flex;\n  align-items: center;\n  gap: 7px;\n  white-space: nowrap;\n}\n.rail__title i {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n}\n\n/* ---------- split: activity list (left) | artifact viewer (right) ---------- */\n.rail__split {\n  flex: 1;\n  min-height: 0;\n  width: 100%;\n  height: 100%;\n}\n\n.rail__list {\n  height: 100%;\n  overflow-y: auto;\n  padding: 10px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  scrollbar-width: thin;\n  scrollbar-color: var(--mj-border-strong) transparent;\n}\n.rail__list::-webkit-scrollbar {\n  width: 6px;\n}\n.rail__list::-webkit-scrollbar-thumb {\n  background: var(--mj-border-strong);\n  border-radius: 3px;\n}\n\n.rail__empty {\n  font-size: 11.5px;\n  color: var(--mj-text-disabled);\n  text-align: center;\n  padding: 18px 8px;\n}\n\n/* Session-review carryover artifacts group (above the activity cards). */\n.rail__group {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  padding-bottom: 8px;\n  margin-bottom: 4px;\n  border-bottom: 1px dashed var(--mj-border-default);\n}\n.rail__group-title {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 10.5px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  color: var(--mj-text-muted);\n}\n.rail__group-title i {\n  font-size: 10px;\n  color: var(--sage);\n}\n\n/* ---------- artifact viewer (right split pane) ---------- */\n.rail__viewer {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n  background: var(--mj-bg-surface);\n  border-left: 1px solid var(--mj-border-default);\n}\n.rail__viewer-head {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n  padding: 8px 10px;\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n.rail__viewer-title {\n  display: inline-flex;\n  align-items: center;\n  gap: 7px;\n  min-width: 0;\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.rail__viewer-title i {\n  font-size: 11px;\n  color: var(--sage);\n  flex-shrink: 0;\n}\n.rail__viewer-close {\n  width: 24px;\n  height: 24px;\n  display: grid;\n  place-items: center;\n  background: transparent;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  flex-shrink: 0;\n  font-size: 11px;\n  transition: color 140ms ease, border-color 140ms ease;\n}\n.rail__viewer-close:hover {\n  color: var(--mj-text-primary);\n  border-color: var(--mj-border-strong);\n}\n.rail__viewer-body {\n  flex: 1;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n.rail__viewer-body > * {\n  flex: 1;\n  min-height: 0;\n}\n\n/* ---------- Activity cards ---------- */\n.act-card {\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg, 10px);\n  padding: 8px 10px;\n  background: var(--mj-bg-surface);\n}\n.act-card--running {\n  border-color: var(--sage-border);\n  background: var(--sage-bg);\n  box-shadow: 0 0 0 1px var(--sage-border);\n}\n.act-card--done,\n.act-card--failed {\n  opacity: 0.72;\n}\n.act-card--done:hover,\n.act-card--failed:hover {\n  opacity: 1;\n}\n\n.act-card__top {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n}\n.act-card__name {\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  min-width: 0;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.act-status {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  font-size: 10px;\n  font-weight: 700;\n  padding: 1px 7px;\n  border-radius: var(--mj-radius-full, 9999px);\n  flex-shrink: 0;\n  line-height: 1.6;\n}\n.act-status i { font-size: 8.5px; }\n.act-status--running {\n  background: color-mix(in srgb, var(--sage) 18%, transparent);\n  color: var(--mj-color-violet-300, var(--mj-text-secondary));\n  border: 1px solid var(--sage-border);\n}\n.act-status--done {\n  background: var(--mj-status-success-bg, transparent);\n  color: var(--mj-status-success);\n  border: 1px solid color-mix(in srgb, var(--mj-status-success) 35%, transparent);\n}\n.act-status--failed {\n  background: var(--mj-status-error-bg, transparent);\n  color: var(--mj-status-error);\n  border: 1px solid color-mix(in srgb, var(--mj-status-error) 35%, transparent);\n}\n.spin {\n  animation: rail-spin 1.1s linear infinite;\n}\n\n.act-card__step {\n  font-size: 11.5px;\n  color: var(--mj-text-secondary);\n  margin-top: 4px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.act-card--running .act-card__step {\n  color: var(--mj-text-primary);\n  font-weight: 600;\n}\n.act-card__meta {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n  margin-top: 4px;\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n}\n.act-card__preview {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  margin-top: 3px;\n  line-height: 1.45;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n/* ---------- inline artifact preview (opens the split viewer on click) ---------- */\n.act-card__artifact {\n  margin-top: 6px;\n  border-radius: var(--mj-radius-lg, 10px);\n  transition: box-shadow 140ms ease;\n}\n/* The inline preview card carries its own margins; collapse them inside the slot. */\n.act-card__artifact ::ng-deep .artifact-message-card {\n  margin: 0;\n}\n/* Highlight the artifact whose viewer is currently open in the split pane. */\n.act-card__artifact--open {\n  box-shadow: 0 0 0 2px var(--sage);\n  border-radius: calc(var(--mj-radius-lg, 10px) + 2px);\n}\n\n/* Fallback \"View \u2192\" chip (used only when no CurrentUser to render the rich preview) */\n.act-card__artifact-link {\n  display: inline-flex;\n  align-items: center;\n  gap: 5px;\n  padding: 2px 9px;\n  border-radius: var(--mj-radius-full, 9999px);\n  border: 1px solid var(--sage-border);\n  background: var(--sage-bg);\n  color: var(--mj-color-violet-300, var(--mj-text-secondary));\n  font-family: inherit;\n  font-size: 10px;\n  font-weight: 700;\n  cursor: pointer;\n  max-width: 100%;\n  transition: color 140ms ease, border-color 140ms ease, background 140ms ease;\n}\n.act-card__artifact-link:hover {\n  color: var(--mj-text-primary);\n  border-color: var(--sage);\n  background: color-mix(in srgb, var(--sage) 18%, transparent);\n}\n.act-card__artifact-link span {\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.act-card__artifact-link i {\n  font-size: 9px;\n  flex-shrink: 0;\n}\n\n/* Gear-gated developer link to the delegated run record */\n.act-card__dev-link {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  margin-top: 6px;\n  padding: 2px 8px;\n  border-radius: var(--mj-radius-full, 9999px);\n  border: 1px dashed var(--mj-border-strong);\n  background: transparent;\n  color: var(--mj-text-muted);\n  font-family: inherit;\n  font-size: 10px;\n  font-weight: 700;\n  cursor: pointer;\n  transition: color 140ms ease, border-color 140ms ease, background 140ms ease;\n}\n.act-card__dev-link:hover {\n  color: var(--mj-text-link, var(--mj-brand-primary));\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, transparent);\n}\n.act-card__dev-link i {\n  font-size: 8px;\n}\n\n@keyframes rail-spin {\n  to { transform: rotate(360deg); }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .rail { transition: none; }\n  .spin { animation: none; }\n}\n\n/* On narrow widths the STANDALONE rail stacks out of the way (overlay falls back to a\n   single column). The embedded rail is governed by the surface panel's own breakpoint. */\n@media (max-width: 860px) {\n  .rail:not(.rail--embedded) {\n    display: none;\n  }\n}\n"] }]
     }], null, { State: [{
             type: Input,
             args: [{ required: true }]
@@ -251,10 +448,16 @@ export class RealtimeActivityRailComponent {
             type: Input
         }], Embedded: [{
             type: Input
+        }], CurrentUser: [{
+            type: Input
+        }], EnvironmentID: [{
+            type: Input
+        }], ExtraArtifacts: [{
+            type: Input
         }], OpenRunRequested: [{
             type: Output
         }], OpenArtifactRequested: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(RealtimeActivityRailComponent, { className: "RealtimeActivityRailComponent", filePath: "src/lib/components/realtime/realtime-activity-rail.component.ts", lineNumber: 29 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(RealtimeActivityRailComponent, { className: "RealtimeActivityRailComponent", filePath: "src/lib/components/realtime/realtime-activity-rail.component.ts", lineNumber: 41 }); })();
 //# sourceMappingURL=realtime-activity-rail.component.js.map