@copilotkit/web-inspector 1.79.1 → 1.80.0

package/dist/index.umd.js

@@ -927,6 +927,54 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 //#endregion
 //#region src/components/learning-view.ts
+	const plural = (count, singular, pluralForm) => `${count} ${count === 1 ? singular : pluralForm}`;
+	/** Rows shown per evidence kind before the panel asks to show more. */
+	const EVIDENCE_PREVIEW_LIMIT = 10;
+	const EVIDENCE_NOUNS = {
+		threads: ["Thread", "Threads"],
+		trajectories: ["Trajectory", "Trajectories"]
+	};
+	const trajectoryTimeFormat = new Intl.DateTimeFormat(void 0, {
+		month: "short",
+		day: "numeric",
+		hour: "numeric",
+		minute: "2-digit"
+	});
+	/**
+	* Reads the creation time from a UUIDv7 Trajectory id, whose first 48 bits
+	* are Unix milliseconds. Returns null for ids of any other version.
+	*/
+	const trajectoryCreatedAt = (trajectoryId) => {
+		const hex = trajectoryId.replace(/-/g, "");
+		if (!/^[0-9a-f]{12}7[0-9a-f]{19}$/i.test(hex)) return null;
+		return new Date(Number.parseInt(hex.slice(0, 12), 16));
+	};
+	/**
+	* "Showing 100 of 412 Trajectories" for each kind the response shortened,
+	* or null when every cited source is listed.
+	*/
+	function evidenceCoverageLabel(insight) {
+		var _insight$trajectoryEv, _insight$trajectoryEv2;
+		if (!insight.evidenceTruncated) return null;
+		const parts = [];
+		if (insight.evidence.length < insight.totalThreadCount) parts.push(`${insight.evidence.length} of ${plural(insight.totalThreadCount, ...EVIDENCE_NOUNS.threads)}`);
+		const trajectoriesShown = (_insight$trajectoryEv = (_insight$trajectoryEv2 = insight.trajectoryEvidence) === null || _insight$trajectoryEv2 === void 0 ? void 0 : _insight$trajectoryEv2.length) !== null && _insight$trajectoryEv !== void 0 ? _insight$trajectoryEv : 0;
+		if (insight.totalTrajectoryCount !== void 0 && trajectoriesShown < insight.totalTrajectoryCount) parts.push(`${trajectoriesShown} of ${plural(insight.totalTrajectoryCount, ...EVIDENCE_NOUNS.trajectories)}`);
+		return parts.length === 0 ? null : `Showing ${parts.join(" · ")}`;
+	}
+	/**
+	* Labels the sources an Insight cites. Trajectories are named only when
+	* cited, so Thread-only Insights and older Intelligence versions read as
+	* before.
+	*/
+	function evidenceCountLabel(insight) {
+		var _ref, _insight$totalTraject, _insight$trajectoryEv3;
+		const threads = plural(insight.totalThreadCount, "Thread", "Threads");
+		const trajectoryCount = (_ref = (_insight$totalTraject = insight.totalTrajectoryCount) !== null && _insight$totalTraject !== void 0 ? _insight$totalTraject : (_insight$trajectoryEv3 = insight.trajectoryEvidence) === null || _insight$trajectoryEv3 === void 0 ? void 0 : _insight$trajectoryEv3.length) !== null && _ref !== void 0 ? _ref : 0;
+		if (trajectoryCount === 0) return threads;
+		const trajectories = plural(trajectoryCount, "Trajectory", "Trajectories");
+		return insight.totalThreadCount === 0 ? trajectories : `${threads} · ${trajectories}`;
+	}
 	function deriveLearningViewState(input) {
 		if (!input.supported) return input.setupActive ? "setup" : "landing";
 		if (!input.snapshot && input.loading) return "loading";
@@ -958,6 +1006,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 			this.promptTrigger = null;
 			this.expandedSkillId = null;
 			this.selectedInsightId = null;
+			this.expandedEvidence = /* @__PURE__ */ new Set();
 			this.skillPageKey = "";
 			this.handlePromptKeydown = (event) => {
 				if (event.key === "Escape") {
@@ -1156,6 +1205,11 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
     </nav>`;
 		}
 		renderEvidence(insight) {
+			var _insight$trajectoryEv4;
+			const threads = insight.evidence;
+			const trajectories = (_insight$trajectoryEv4 = insight.trajectoryEvidence) !== null && _insight$trajectoryEv4 !== void 0 ? _insight$trajectoryEv4 : [];
+			const mixed = threads.length > 0 && trajectories.length > 0;
+			const coverage = evidenceCoverageLabel(insight);
 			return lit.html`<section class="detail-panel" aria-label="Insight evidence">
       <div class="detail-head">
         <div>
@@ -1174,14 +1228,13 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
           ×
         </button>
       </div>
+      ${coverage ? lit.html`<p class="evidence-coverage">${coverage}</p>` : lit.nothing}
       <div class="evidence-list">
-        ${insight.evidence.length === 0 ? lit.html`
+        ${threads.length === 0 && trajectories.length === 0 ? lit.html`
                 <div class="evidence-unavailable">Evidence is no longer available</div>
-              ` : insight.evidence.map((evidence) => {
+              ` : lit.html`${this.renderEvidenceGroup(insight.id, "threads", threads, mixed, (evidence) => {
 				var _evidence$threadName;
-				return evidence.status === "unavailable" ? lit.html`
-                      <div class="evidence-unavailable">Evidence is no longer available</div>
-                    ` : lit.html`<button
+				return lit.html`<button
                     class="evidence-link"
                     type="button"
                     @click=${() => this.emit("learning-open-evidence", {
@@ -1193,12 +1246,63 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
                     ${(_evidence$threadName = evidence.threadName) !== null && _evidence$threadName !== void 0 ? _evidence$threadName : `Thread ${evidence.threadId.slice(0, 8)}`}
                     <span>Open Thread →</span>
                   </button>`;
-			})}
+			})}${this.renderEvidenceGroup(insight.id, "trajectories", trajectories, mixed, (evidence) => this.renderTrajectoryEvidence(evidence))}`}
       </div>
-      ${insight.evidenceTruncated ? lit.html`
+      ${insight.evidenceTruncated && !coverage ? lit.html`
               <p class="supporting-unavailable">Evidence response shortened</p>
             ` : lit.nothing}
     </section>`;
+		}
+		/**
+		* Lists one kind of evidence: the first rows with a toggle for the rest,
+		* then one line counting the sources that are no longer available.
+		*/
+		renderEvidenceGroup(insightId, kind, entries, showHeading, renderRow) {
+			if (entries.length === 0) return lit.nothing;
+			const available = entries.filter((entry) => entry.status === "available");
+			const unavailable = entries.length - available.length;
+			const key = `${insightId}:${kind}`;
+			const expanded = this.expandedEvidence.has(key);
+			const hidden = Math.max(0, available.length - EVIDENCE_PREVIEW_LIMIT);
+			const [singular, pluralForm] = EVIDENCE_NOUNS[kind];
+			return lit.html`
+      ${showHeading ? lit.html`<h4 class="evidence-group-heading">${pluralForm}</h4>` : lit.nothing}
+      ${(expanded ? available : available.slice(0, EVIDENCE_PREVIEW_LIMIT)).map(renderRow)}
+      ${hidden > 0 ? lit.html`<button
+              class="evidence-more"
+              type="button"
+              aria-expanded=${expanded}
+              @click=${() => {
+				if (expanded) this.expandedEvidence.delete(key);
+				else this.expandedEvidence.add(key);
+				this.requestUpdate();
+			}}
+            >
+              ${expanded ? `Show fewer ${pluralForm}` : `Show ${plural(hidden, `more ${singular}`, `more ${pluralForm}`)}`}
+            </button>` : lit.nothing}
+      ${unavailable > 0 ? lit.html`<div class="evidence-unavailable">
+              ${plural(unavailable, singular, pluralForm)}
+              ${unavailable === 1 ? "is" : "are"} no longer available
+            </div>` : lit.nothing}
+    `;
+		}
+		renderTrajectoryEvidence(evidence) {
+			const createdAt = trajectoryCreatedAt(evidence.trajectoryId);
+			const idTail = evidence.trajectoryId.slice(-8);
+			return lit.html`<a
+      class="evidence-link"
+      href=${evidence.url}
+      target="_blank"
+      rel="noopener noreferrer"
+      title=${evidence.trajectoryId}
+      @click=${() => this.emit("learning-web-link", { category: "trajectory" })}
+    >
+      ⌁
+      ${createdAt ? `Trajectory · ${trajectoryTimeFormat.format(createdAt)}` : `Trajectory ${idTail}`}
+      · ${plural(evidence.eventCount, "cited event", "cited events")}
+      ${createdAt ? lit.html`<small class="evidence-id">${idTail}</small>` : lit.nothing}
+      <span>Open Trajectory ↗</span>
+    </a>`;
 		}
 		selectInsight(insight) {
 			this.selectedInsightId = insight.id;
@@ -1242,8 +1346,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
                         @click=${() => this.selectInsight(skill.sourceInsight)}
                       >
                         ${this.supportingInsightLabel(skill.sourceInsight.statement)}<small
-                          >${skill.sourceInsight.totalThreadCount}
-                          ${skill.sourceInsight.totalThreadCount === 1 ? "Thread" : "Threads"}</small
+                          >${evidenceCountLabel(skill.sourceInsight)}</small
                         >
                       </button>` : lit.html`
                           <div class="supporting-unavailable">Supporting Insight unavailable</div>
@@ -1298,8 +1401,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
                   <p>${insight.impact}</p>
                 </div>
                 <span class="evidence-count"
-                  >${insight.totalThreadCount}
-                  ${insight.totalThreadCount === 1 ? "Thread" : "Threads"}</span
+                  >${evidenceCountLabel(insight)}</span
                 >
               </button>`)}
           </div>`}
@@ -2221,7 +2323,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
       text-align: left;
     }
     .evidence-link {
+      box-sizing: border-box;
       width: 100%;
+      text-decoration: none;
       cursor: pointer;
     }
     .evidence-link span {
@@ -2232,6 +2336,40 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
       color: var(--learning-muted-strong);
       font-style: italic;
     }
+    .evidence-coverage {
+      margin: 12px 0 0;
+      color: var(--learning-muted-strong);
+      font-size: 11px;
+    }
+    .evidence-group-heading {
+      margin: 6px 0 0;
+      color: var(--learning-muted-strong);
+      font-size: 10px;
+      font-weight: 800;
+      letter-spacing: 0.06em;
+      text-transform: uppercase;
+    }
+    .evidence-group-heading:first-child {
+      margin-top: 0;
+    }
+    .evidence-id {
+      color: var(--learning-muted-strong);
+      font:
+        10px ui-monospace,
+        SFMono-Regular,
+        Menlo,
+        monospace;
+    }
+    .evidence-more {
+      justify-self: start;
+      padding: 2px 0;
+      color: var(--learning-purple-dark);
+      background: none;
+      border: 0;
+      font-size: 11px;
+      font-weight: 700;
+      cursor: pointer;
+    }
     .pagination {
       display: flex;
       align-items: center;
@@ -3064,7 +3202,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 //#endregion
 //#region package.json
-	var version = "1.79.1";
+	var version = "1.80.0";
 
 //#endregion
 //#region src/lib/telemetry.ts