@copilotkit/web-inspector 1.77.0 → 1.77.2

package/dist/index.umd.js

@@ -30,13 +30,13 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 		intelligence: ["enabled", "disabled"],
 		deployment: ["managed", "self-hosted"]
 	};
-	function record(value) {
+	function record$1(value) {
 		return value !== null && typeof value === "object" && !Array.isArray(value);
 	}
-	function onlyKeys(value, keys) {
+	function onlyKeys$1(value, keys) {
 		return Object.keys(value).every((key) => keys.includes(key));
 	}
-	function text(value, max = 256) {
+	function text$1(value, max = 256) {
 		return typeof value === "string" && value.trim().length > 0 && value.length <= max;
 	}
 	function isNotificationId(value) {
@@ -47,11 +47,11 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 	}
 	/** Validate authored conditions; unsupported predicates cannot broaden the audience. */
 	function validNotificationConditions(value) {
-		if (!record(value)) return false;
+		if (!record$1(value)) return false;
 		if (value.sdkVersion !== void 0 && value.framework === void 0) return false;
 		return Object.entries(value).every(([key, expected]) => {
 			var _conditionValues$key$, _conditionValues$key;
-			if (!text(expected)) return false;
+			if (!text$1(expected)) return false;
 			if (key === "sdkVersion") return (0, semver.validRange)(expected) !== null;
 			if (key === "plan") return /^[a-z0-9]+(?:-[a-z0-9]+)*$/.test(expected);
 			return Object.prototype.hasOwnProperty.call(conditionValues, key) && ((_conditionValues$key$ = (_conditionValues$key = conditionValues[key]) === null || _conditionValues$key === void 0 ? void 0 : _conditionValues$key.includes(expected)) !== null && _conditionValues$key$ !== void 0 ? _conditionValues$key$ : false);
@@ -59,11 +59,11 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 	}
 	/** Parse the public envelope. Any invalid entry rejects the whole feed. */
 	function parseNotificationFeed(value) {
-		if (!record(value) || !onlyKeys(value, ["schemaVersion", "notifications"]) || value.schemaVersion !== 1) return null;
+		if (!record$1(value) || !onlyKeys$1(value, ["schemaVersion", "notifications"]) || value.schemaVersion !== 1) return null;
 		if (!Array.isArray(value.notifications) || value.notifications.length > 100) return null;
 		const notifications = [];
 		for (const notice of value.notifications) {
-			if (!record(notice) || !onlyKeys(notice, [
+			if (!record$1(notice) || !onlyKeys$1(notice, [
 				"id",
 				"title",
 				"body",
@@ -72,10 +72,10 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 				"priority",
 				"priorityOverride"
 			])) return null;
-			if (!isNotificationId(notice.id) || !text(notice.title) || !text(notice.body, 1e5) || !text(notice.publishedAt)) return null;
+			if (!isNotificationId(notice.id) || !text$1(notice.title) || !text$1(notice.body, 1e5) || !text$1(notice.publishedAt)) return null;
 			if (!/^\d{4}-\d\d-\d\dT\d\d:\d\d:\d\d\.\d{3}Z$/.test(notice.publishedAt) || !Number.isFinite(Date.parse(notice.publishedAt)) || new Date(notice.publishedAt).toISOString() !== notice.publishedAt) return null;
 			if (!Array.isArray(notice.audiences) || !notice.audiences.length || notice.audiences.length > 100 || !notice.audiences.every(validNotificationConditions)) return null;
-			if (!text(notice.priority) || !Object.prototype.hasOwnProperty.call(priorities, notice.priority)) return null;
+			if (!text$1(notice.priority) || !Object.prototype.hasOwnProperty.call(priorities, notice.priority)) return null;
 			if (notice.priorityOverride !== void 0 && (typeof notice.priorityOverride !== "number" || !Number.isSafeInteger(notice.priorityOverride) || notice.priorityOverride < 0)) return null;
 			if (notifications.some((n) => n.id === notice.id)) return null;
 			notifications.push({
@@ -95,7 +95,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 	}
 	/** Ignore malformed or incompatible browser state. */
 	function parseNotificationState(value) {
-		if (!record(value) || value.schemaVersion !== 1 || !ids(value.eligibleIds) || !ids(value.readIds) || !ids(value.suppressedIds) || value.activeId !== null && !isNotificationId(value.activeId)) return null;
+		if (!record$1(value) || value.schemaVersion !== 1 || !ids(value.eligibleIds) || !ids(value.readIds) || !ids(value.suppressedIds) || value.activeId !== null && !isNotificationId(value.activeId)) return null;
 		return {
 			schemaVersion: 1,
 			eligibleIds: value.eligibleIds,
@@ -205,6 +205,135 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 		return request;
 	}
 
+//#endregion
+//#region src/lib/hud-config.ts
+	const HUD_FEATURE_IDS = ["threads", "learning"];
+	const HUD_LABEL_MAX_LENGTH = 32;
+	const HUD_DESCRIPTION_MAX_LENGTH = 140;
+	const frameworkPattern = /^[a-z][a-z0-9-]{0,31}$/;
+	const featureIdPattern = /^[a-z][a-z0-9-]{0,31}$/;
+	const destinationPattern = /^[a-z][a-z0-9-]{0,63}$/;
+	const controlCharacters = /[\u0000-\u001f\u007f-\u009f\u2028\u2029]/;
+	function record(value) {
+		return value !== null && typeof value === "object" && !Array.isArray(value);
+	}
+	function onlyKeys(value, keys) {
+		return Object.keys(value).every((key) => keys.includes(key));
+	}
+	function text(value, max) {
+		return typeof value === "string" && value.trim().length > 0 && value.length <= max && !controlCharacters.test(value);
+	}
+	function parseFeature(value) {
+		if (!record(value) || !Object.keys(value).length || !onlyKeys(value, [
+			"label",
+			"description",
+			"destination"
+		])) return null;
+		if (value.label !== void 0 && !text(value.label, HUD_LABEL_MAX_LENGTH)) return null;
+		if (value.description !== void 0 && !text(value.description, HUD_DESCRIPTION_MAX_LENGTH)) return null;
+		if (value.destination !== void 0 && (typeof value.destination !== "string" || !destinationPattern.test(value.destination))) return null;
+		return {
+			...value.label === void 0 ? {} : { label: value.label },
+			...value.description === void 0 ? {} : { description: value.description },
+			...value.destination === void 0 ? {} : { destination: value.destination }
+		};
+	}
+	function parseRule(value) {
+		if (!record(value) || !onlyKeys(value, [
+			"framework",
+			"sdkVersion",
+			"features"
+		]) || typeof value.framework !== "string" || !frameworkPattern.test(value.framework) || !text(value.sdkVersion, 256) || (0, semver.validRange)(value.sdkVersion) === null || !record(value.features) || !Object.keys(value.features).length) return null;
+		const features = {};
+		for (const [id, entry] of Object.entries(value.features)) {
+			if (!featureIdPattern.test(id)) return null;
+			const feature = parseFeature(entry);
+			if (!feature) return null;
+			features[id] = feature;
+		}
+		return {
+			framework: value.framework,
+			sdkVersion: value.sdkVersion,
+			features
+		};
+	}
+	/** Parse the public envelope. Any invalid entry rejects the whole feed. */
+	function parseHudFeed(value) {
+		if (!record(value) || !onlyKeys(value, ["schemaVersion", "rules"]) || value.schemaVersion !== 1 || !Array.isArray(value.rules) || value.rules.length > 100) return null;
+		const rules = [];
+		for (const entry of value.rules) {
+			const rule = parseRule(entry);
+			if (!rule) return null;
+			rules.push(rule);
+		}
+		return {
+			schemaVersion: 1,
+			rules
+		};
+	}
+	/** Return the first rule for a development client with a known stable SDK. */
+	function matchHudRule(feed, context) {
+		var _feed$rules$find;
+		const { development, framework, sdkVersion } = context;
+		if (!development || !framework || !sdkVersion || (0, semver.valid)(sdkVersion) === null || (0, semver.prerelease)(sdkVersion) !== null) return null;
+		return (_feed$rules$find = feed.rules.find((rule) => rule.framework === framework && (0, semver.satisfies)(sdkVersion, rule.sdkVersion))) !== null && _feed$rules$find !== void 0 ? _feed$rules$find : null;
+	}
+	/** Overlay the matching rule on the built-in content, field by field. */
+	function resolveHudContent(feed, context, options) {
+		const rule = feed ? matchHudRule(feed, context) : null;
+		const content = {};
+		for (const id of HUD_FEATURE_IDS) {
+			var _override$label, _override$description;
+			const fallback = options.defaults[id];
+			const override = rule === null || rule === void 0 ? void 0 : rule.features[id];
+			content[id] = {
+				label: (_override$label = override === null || override === void 0 ? void 0 : override.label) !== null && _override$label !== void 0 ? _override$label : fallback.label,
+				description: (_override$description = override === null || override === void 0 ? void 0 : override.description) !== null && _override$description !== void 0 ? _override$description : fallback.description,
+				destination: (override === null || override === void 0 ? void 0 : override.destination) !== void 0 && options.supportedDestinations.includes(override.destination) ? override.destination : fallback.destination
+			};
+		}
+		return content;
+	}
+
+//#endregion
+//#region src/lib/hud-loader.ts
+	const HUD_FEED_URL = "https://cdn.copilotkit.ai/inspector-hud/v1.json";
+	let request = null;
+	/** Load the HUD feed once per page. The request carries no client data. */
+	function loadHudFeed() {
+		var _request;
+		if (typeof window === "undefined" || typeof fetch === "undefined") return Promise.resolve(null);
+		(_request = request) !== null && _request !== void 0 || (request = Promise.resolve().then(() => fetch(HUD_FEED_URL, {
+			cache: "no-cache",
+			credentials: "omit"
+		})).then(async (response) => {
+			if (!response.ok) throw new Error(`Feed request failed (${response.status})`);
+			const feed = parseHudFeed(await response.json());
+			if (!feed) throw new Error("Feed failed validation");
+			return feed;
+		}).catch((error) => {
+			console.warn("[CopilotKit Inspector] Failed to load HUD content", error);
+			return null;
+		}));
+		return request;
+	}
+
+//#endregion
+//#region src/lib/hud-defaults.ts
+/** Built-in HUD copy and destinations; a matching feed rule overrides fields. */
+	const HUD_DEFAULT_CONTENT = {
+		threads: {
+			label: "Rich Threads",
+			description: "Click to learn more",
+			destination: "threads"
+		},
+		learning: {
+			label: "Automatic Learning",
+			description: "Click to learn more",
+			destination: "memories"
+		}
+	};
+
 //#endregion
 //#region src/lib/persistence.ts
 	function loadInspectorState(storageKey) {
@@ -2935,7 +3064,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 //#endregion
 //#region package.json
-	var version = "1.77.0";
+	var version = "1.77.2";
 
 //#endregion
 //#region src/lib/telemetry.ts
@@ -3503,8 +3632,46 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 		return FEATURE_ONBOARDING_PROMPT_TEMPLATE.replace(RUN_ID_PLACEHOLDER, runId).replace(INTENT_PLACEHOLDER, FEATURE_ONBOARDING_INTENT[serviceId]);
 	}
 
+//#endregion
+//#region \0@oxc-project+runtime@0.112.0/helpers/checkPrivateRedeclaration.js
+	function _checkPrivateRedeclaration(e, t) {
+		if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object");
+	}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.112.0/helpers/classPrivateMethodInitSpec.js
+	function _classPrivateMethodInitSpec(e, a) {
+		_checkPrivateRedeclaration(e, a), a.add(e);
+	}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.112.0/helpers/classPrivateFieldInitSpec.js
+	function _classPrivateFieldInitSpec(e, t, a) {
+		_checkPrivateRedeclaration(e, t), t.set(e, a);
+	}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.112.0/helpers/assertClassBrand.js
+	function _assertClassBrand(e, t, n) {
+		if ("function" == typeof e ? e === t : e.has(t)) return arguments.length < 3 ? t : n;
+		throw new TypeError("Private element is not present on this object");
+	}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.112.0/helpers/classPrivateFieldGet2.js
+	function _classPrivateFieldGet2(s, a) {
+		return s.get(_assertClassBrand(s, a));
+	}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.112.0/helpers/classPrivateFieldSet2.js
+	function _classPrivateFieldSet2(s, a, r) {
+		return s.set(_assertClassBrand(s, a), r), r;
+	}
+
 //#endregion
 //#region src/index.ts
+	var _globalThis$HTMLEleme;
 	const WEB_INSPECTOR_TAG = "cpk-web-inspector";
 	const THREAD_INSPECTOR_TAG = "cpk-thread-inspector";
 	/**
@@ -3601,9 +3768,6 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 	const PILL_SUBLINE_LABEL = "Open Inspector for details";
 	const HUD_INSPECTOR_LABEL = "CopilotKit Inspector";
 	const HUD_ANNOUNCEMENT_TITLE_LIMIT = 80;
-	const HUD_THREADS_LABEL = "Rich Threads";
-	const HUD_LEARNING_LABEL = "Automatic Learning";
-	const HUD_LEARN_MORE_LABEL = "Click to learn more";
 	const INSPECTOR_DISMISSAL_MS = {
 		day: 1440 * 60 * 1e3,
 		week: 10080 * 60 * 1e3,
@@ -4318,7 +4482,96 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 			return value;
 		}
 	}
+	let inspectorJsonRenderer = null;
+	let inspectorJsonSlotCount = 0;
+	const JSON_BLOCK_TAG = "cpk-json-block";
+	/**
+	* Replaces the inspector's built-in JSON blocks (tool arguments and results,
+	* state, events, and context) with a host renderer. Pass `null` to restore the
+	* built-in blocks. Set it before the inspector renders: a block that is
+	* already on screen changes at the inspector's next render.
+	*
+	* @example
+	* ```ts
+	* setInspectorJsonRenderer((container, value) => {
+	*   const root = createRoot(container);
+	*   root.render(<JsonView value={value} />);
+	*   return () => root.unmount();
+	* });
+	* ```
+	*/
+	function setInspectorJsonRenderer(renderer) {
+		inspectorJsonRenderer = renderer;
+	}
+	var _value = /* @__PURE__ */ new WeakMap();
+	var _hasValue = /* @__PURE__ */ new WeakMap();
+	var _cleanup = /* @__PURE__ */ new WeakMap();
+	var _container = /* @__PURE__ */ new WeakMap();
+	var _CpkJsonBlock_brand = /* @__PURE__ */ new WeakSet();
+	/**
+	* Hosts one value drawn by the host renderer. Inside a shadow root, the
+	* container lives in the shadow host's light DOM and shows here through a
+	* named slot, so the host page's own styles apply to what the renderer draws.
+	*/
+	var CpkJsonBlock = class extends ((_globalThis$HTMLEleme = globalThis.HTMLElement) !== null && _globalThis$HTMLEleme !== void 0 ? _globalThis$HTMLEleme : class {}) {
+		constructor(..._args) {
+			super(..._args);
+			_classPrivateMethodInitSpec(this, _CpkJsonBlock_brand);
+			_classPrivateFieldInitSpec(this, _value, void 0);
+			_classPrivateFieldInitSpec(this, _hasValue, false);
+			_classPrivateFieldInitSpec(this, _cleanup, void 0);
+			_classPrivateFieldInitSpec(this, _container, void 0);
+		}
+		get value() {
+			return _classPrivateFieldGet2(_value, this);
+		}
+		set value(next) {
+			if (_classPrivateFieldGet2(_hasValue, this) && Object.is(next, _classPrivateFieldGet2(_value, this))) return;
+			_classPrivateFieldSet2(_value, this, next);
+			_classPrivateFieldSet2(_hasValue, this, true);
+			if (this.isConnected) _assertClassBrand(_CpkJsonBlock_brand, this, _render).call(this);
+		}
+		connectedCallback() {
+			this.style.display = "block";
+			_assertClassBrand(_CpkJsonBlock_brand, this, _render).call(this);
+		}
+		disconnectedCallback() {
+			_assertClassBrand(_CpkJsonBlock_brand, this, _teardown).call(this);
+		}
+	};
+	function _render() {
+		_assertClassBrand(_CpkJsonBlock_brand, this, _teardown).call(this);
+		const renderer = inspectorJsonRenderer;
+		if (!renderer) return;
+		const root = this.getRootNode();
+		const container = this.ownerDocument.createElement("div");
+		if (root.nodeType === Node.DOCUMENT_FRAGMENT_NODE && "host" in root) {
+			inspectorJsonSlotCount += 1;
+			const name = `cpk-json-${inspectorJsonSlotCount}`;
+			const slot = this.ownerDocument.createElement("slot");
+			slot.name = name;
+			this.replaceChildren(slot);
+			container.slot = name;
+			root.host.append(container);
+		} else this.replaceChildren(container);
+		_classPrivateFieldSet2(_container, this, container);
+		const cleanup = renderer(container, _classPrivateFieldGet2(_value, this));
+		_classPrivateFieldSet2(_cleanup, this, typeof cleanup === "function" ? cleanup : void 0);
+	}
+	function _teardown() {
+		var _classPrivateFieldGet2$1;
+		const cleanup = _classPrivateFieldGet2(_cleanup, this);
+		_classPrivateFieldSet2(_cleanup, this, void 0);
+		cleanup === null || cleanup === void 0 || cleanup();
+		(_classPrivateFieldGet2$1 = _classPrivateFieldGet2(_container, this)) === null || _classPrivateFieldGet2$1 === void 0 || _classPrivateFieldGet2$1.remove();
+		_classPrivateFieldSet2(_container, this, void 0);
+		this.replaceChildren();
+	}
 	function renderHighlightedJsonBlock(value, options = {}) {
+		if (inspectorJsonRenderer) return lit.html`<cpk-json-block
+      .value=${value}
+      style=${options.maxHeight ? `overflow:auto;max-height:${options.maxHeight}` : lit.nothing}
+    ></cpk-json-block>`;
 		const parsed = coerceJsonValue(value);
 		return lit.html`<pre class="cpk-json-block" style=${(options.maxHeight ? `max-height:${options.maxHeight}` : void 0) || lit.nothing}>
 ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
@@ -4380,8 +4633,8 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
 		}
 	};
 	var CpkThreadList = class extends PortableLitElement {
-		constructor(..._args) {
-			super(..._args);
+		constructor(..._args2) {
+			super(..._args2);
 			this.threads = [];
 			this.selectedThreadId = null;
 			this.inAppThreadId = null;
@@ -4735,8 +4988,8 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
     }
   `;
 	var CpkThreadInspector = class CpkThreadInspector extends PortableLitElement {
-		constructor(..._args2) {
-			super(..._args2);
+		constructor(..._args3) {
+			super(..._args3);
 			this.showThreadTitle = true;
 			this.threadId = null;
 			this.provider = null;
@@ -7969,8 +8222,8 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
 		return Math.max(6, Math.min(100, Math.round(relevance * 100)));
 	}
 	var CpkMemoryList = class extends PortableLitElement {
-		constructor(..._args3) {
-			super(..._args3);
+		constructor(..._args4) {
+			super(..._args4);
 			this.memories = [];
 			this.recallResults = null;
 			this.recallLoading = false;
@@ -8582,8 +8835,8 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
 		if (!registry.get(tag)) registry.define(tag, ctor);
 	}
 	var WebInspectorElement = class WebInspectorElement extends lit.LitElement {
-		constructor(..._args4) {
-			super(..._args4);
+		constructor(..._args5) {
+			super(..._args5);
 			this._core = null;
 			this.coreSubscriber = null;
 			this.coreUnsubscribe = null;
@@ -8744,6 +8997,9 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
 			this.announcementId = null;
 			this.announcementLoaded = false;
 			this.announcementPromise = null;
+			this.hudFeed = null;
+			this.hudFeedPromise = null;
+			this.hudContent = HUD_DEFAULT_CONTENT;
 			this.newsSignalArmed = false;
 			this.pulsingSignal = null;
 			this.pendingPulseSignal = null;
@@ -9091,7 +9347,8 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
 					control,
 					trigger
 				}));
-				this.hudLandingMenu = row === "threads" ? "threads" : row === "learning" ? "memories" : "home";
+				const destination = this.hudContent[row].destination;
+				this.hudLandingMenu = isInspectorMenuKey(destination) && this.menuItems.some((item) => item.key === destination) ? destination : row === "threads" ? "threads" : "memories";
 				this.closeLauncherHud();
 				this.openInspector("floating_button");
 			};
@@ -11239,7 +11496,8 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
           <div data-inspector-portal-anchor></div>
         ` : this.renderButton();
 		}
-		willUpdate() {
+		willUpdate(changed) {
+			if (changed.has("notificationContext")) this.refreshHudContent();
 			this.evaluateErrorSignals();
 			this.reconcileSelectedMenuVisibility();
 			if (this.isOpen && this.dockMode === "docked-left") this.setAttribute("data-docked", "true");
@@ -11630,6 +11888,7 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
 		renderHudRow(args) {
 			if (args.connected) return lit.nothing;
 			const detailId = `cpk-hud-detail-${args.id}`;
+			const { label, description } = this.hudContent[args.id];
 			return lit.html`
       <li
         class="cpk-launcher-hud__row"
@@ -11643,7 +11902,7 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
             type="button"
             class="cpk-launcher-hud__action"
             data-cpk-hud-action
-            aria-label=${`Open ${args.label} in Inspector`}
+            aria-label=${`Open ${label} in Inspector`}
             @click=${(event) => this.handleHudActionClick(event, args.id, "action")}
             @pointerdown=${(event) => event.stopPropagation()}
           >
@@ -11653,13 +11912,13 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
               aria-hidden="true"
               >${this.renderIcon(args.icon)}</span
             >
-            <span class="cpk-launcher-hud__label">${args.label}</span>
+            <span class="cpk-launcher-hud__label">${label}</span>
           </button>
           <span
             class="cpk-launcher-hud__tooltip"
             id=${detailId}
             role="tooltip"
-            >${HUD_LEARN_MORE_LABEL}</span
+            >${description}</span
           >
         </span>
         <span class="cpk-launcher-hud__controls">
@@ -11667,7 +11926,7 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
             type="button"
             class="cpk-launcher-hud__learn-more"
             data-cpk-hud-learn-more=${args.id}
-            aria-label=${`Learn more about ${args.label}`}
+            aria-label=${`Learn more about ${label}`}
             aria-describedby=${detailId}
             @click=${(event) => this.handleHudActionClick(event, args.id, "learn_more")}
             @pointerdown=${(event) => event.stopPropagation()}
@@ -11679,7 +11938,7 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
             class="cpk-launcher-hud__toggle"
             data-cpk-hud-toggle=${args.id}
             data-enabled=${args.connected ? "true" : "false"}
-            aria-label=${args.connected ? `${args.label} is enabled` : `Open ${args.label} in Inspector`}
+            aria-label=${args.connected ? `${label} is enabled` : `Open ${label} in Inspector`}
             ?disabled=${args.connected}
             @click=${(event) => this.handleHudActionClick(event, args.id, "toggle")}
             @pointerdown=${(event) => event.stopPropagation()}
@@ -11765,14 +12024,12 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
                   >
                     ${this.renderHudRow({
 				id: "threads",
-				label: HUD_THREADS_LABEL,
 				icon: "MessageSquare",
 				connected: threadsOn,
 				introIndex: featureBlockIntroIndex + 1
 			})}
                     ${this.renderHudRow({
 				id: "learning",
-				label: HUD_LEARNING_LABEL,
 				icon: "Brain",
 				connected: learningOn,
 				introIndex: featureBlockIntroIndex + (threadsOn ? 1 : 2)
@@ -17722,9 +17979,24 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
 				trackWhatsNewSignalViewed(props);
 			}
 		}
+		/** Start the development-only remote feeds; neither blocks rendering. */
 		ensureAnnouncementLoading() {
-			if (this.isInspectorDismissed || !this.notificationContext.development || !this.isConnected || this.announcementPromise || typeof window === "undefined" || typeof fetch === "undefined") return;
-			this.announcementPromise = this.fetchAnnouncement();
+			var _this$announcementPro, _this$hudFeedPromise;
+			if (this.isInspectorDismissed || !this.notificationContext.development || !this.isConnected || typeof window === "undefined" || typeof fetch === "undefined") return;
+			(_this$announcementPro = this.announcementPromise) !== null && _this$announcementPro !== void 0 || (this.announcementPromise = this.fetchAnnouncement());
+			(_this$hudFeedPromise = this.hudFeedPromise) !== null && _this$hudFeedPromise !== void 0 || (this.hudFeedPromise = this.fetchHudFeed());
+		}
+		async fetchHudFeed() {
+			this.hudFeed = await loadHudFeed();
+			this.refreshHudContent();
+			this.requestUpdate();
+		}
+		/** Overlay the matching feed rule on the built-in HUD content. */
+		refreshHudContent() {
+			this.hudContent = resolveHudContent(this.hudFeed, this.notificationContext, {
+				defaults: HUD_DEFAULT_CONTENT,
+				supportedDestinations: INSPECTOR_MENU_KEYS
+			});
 		}
 		async fetchAnnouncement() {
 			try {
@@ -19212,6 +19484,8 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
 
       .cpk-launcher-hud__label {
         min-width: 0;
+        /* Remote copy can be one long word; wrap it inside the row. */
+        overflow-wrap: anywhere;
       }
 
       .cpk-launcher-hud__feature-icon {
@@ -19908,6 +20182,7 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(parsed))}</pre
 		defineElementOnce(registry, THREAD_INSPECTOR_TAG, CpkThreadInspector);
 		defineElementOnce(registry, "cpk-thread-details", ɵCpkThreadDetails);
 		defineElementOnce(registry, "cpk-memory-list", CpkMemoryList);
+		defineElementOnce(registry, JSON_BLOCK_TAG, CpkJsonBlock);
 		defineElementOnce(registry, WEB_INSPECTOR_TAG, WebInspectorElement);
 	}
 	/**
@@ -19930,6 +20205,7 @@ exports.WEB_INSPECTOR_TAG = WEB_INSPECTOR_TAG;
 exports.WebInspectorElement = WebInspectorElement;
 exports.configureWebInspectorElement = configureWebInspectorElement;
 exports.defineWebInspector = defineWebInspector;
+exports.setInspectorJsonRenderer = setInspectorJsonRenderer;
 exports.ɵCpkThreadDetails = ɵCpkThreadDetails;
 exports.ɵbuildCapabilityRows = buildCapabilityRows;
 exports.ɵmaxRecallScore = maxRecallScore;