@qwik.dev/devtools 2.0.0-beta.43 → 2.0.0-beta.47

package/dist/ui/packages/devtools/ui/src/features/Preloads/Preloads.qwik.mjs

@@ -2,13 +2,19 @@ import { getPageDataSource } from "../../devtools/page-data-source.qwik.mjs";
 import { formatMs } from "../Performance/utils/formatMs.qwik.mjs";
 import { StatCard } from "../Performance/components/StatCard.qwik.mjs";
 import { computePreloadViewModel, createDefaultPreloadFilters, filterPreloadRows } from "./computePreloadViewModel.qwik.mjs";
-import { _captures, _fnSignal, _jsxSorted, _wrapProp, componentQrl, inlinedQrl, useComputedQrl, useSignal, useStore, useVisibleTaskQrl } from "@qwik.dev/core";
+import { _capturesObj, _fnSignal, _jsxSorted, _wrapProp, componentQrl, inlinedQrl, useComputedQrl, useSignal, useStore, useVisibleTaskQrl } from "@qwik.dev/core";
 var _hf0 = (p0) => `${p0.value.overview.csr} CSR • ${p0.value.overview.ssr} SSR`;
+var _hf0_str = "`${p0.value.overview.csr} CSR • ${p0.value.overview.ssr} SSR`";
 var _hf1 = (p0) => p0.value.initialized ? "active" : "inactive";
+var _hf1_str = "p0.value.initialized?\"active\":\"inactive\"";
 var _hf2 = (p0) => p0.value.qrlRequests;
+var _hf2_str = "p0.value.qrlRequests";
 var _hf3 = (p0) => p0.value.sourceCounts["current-project"];
+var _hf3_str = "p0.value.sourceCounts[\"current-project\"]";
 var _hf4 = (p0) => p0.rel || "-";
+var _hf4_str = "p0.rel||\"-\"";
 var _hf5 = (p0) => p0.as || p0.resourceType || "-";
+var _hf5_str = "p0.as||p0.resourceType||\"-\"";
 var DEFAULT_FILTERS = createDefaultPreloadFilters();
 var FILTERS = [
 	{
@@ -50,7 +56,7 @@ var Preloads = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 	const phaseFilters = useStore({ ...DEFAULT_FILTERS.phaseFilters });
 	const store = useSignal(null);
 	useVisibleTaskQrl(/*#__PURE__*/ inlinedQrl(async () => {
-		const store = _captures[0], version = _captures[1];
+		let store = _capturesObj._[0], version = _capturesObj._[1];
 		const source = getPageDataSource();
 		store.value = await source.readPreloadStore();
 		version.value++;
@@ -66,8 +72,8 @@ var Preloads = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 		};
 	}, "Preloads_component_useVisibleTask_0vUhmjcSbAc", [store, version]));
 	const vm = useComputedQrl(/*#__PURE__*/ inlinedQrl(() => {
-		const phaseFilters = _captures[0], sourceFilters = _captures[1], store = _captures[2];
-		_captures[3].value;
+		let phaseFilters = _capturesObj._[0], sourceFilters = _capturesObj._[1], store = _capturesObj._[2];
+		_capturesObj._[3].value;
 		return computePreloadViewModel(store.value, {
 			sourceFilters: { ...sourceFilters },
 			phaseFilters: { ...phaseFilters }
@@ -79,72 +85,70 @@ var Preloads = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 		version
 	]));
 	const rows = useComputedQrl(/*#__PURE__*/ inlinedQrl(() => {
-		const activeFilter = _captures[0], vm = _captures[1];
+		let activeFilter = _capturesObj._[0], vm = _capturesObj._[1];
 		return filterPreloadRows(vm.value.rows, activeFilter.value);
 	}, "Preloads_component_rows_useComputed_Zff0cdUKId0", [activeFilter, vm]));
 	const runtimeState = useComputedQrl(/*#__PURE__*/ inlinedQrl(() => {
-		const store = _captures[0];
-		_captures[1].value;
+		let store = _capturesObj._[0];
+		_capturesObj._[1].value;
 		return {
 			initialized: !!store.value,
 			qrlRequests: store.value?.qrlRequests.length ?? 0
 		};
 	}, "Preloads_component_runtimeState_useComputed_EHPIU4e0Nko", [store, version]));
 	const clear = /*#__PURE__*/ inlinedQrl(async () => {
-		const store = _captures[0], version = _captures[1];
+		let store = _capturesObj._[0], version = _capturesObj._[1];
 		const source = getPageDataSource();
 		await source.clearPreloadStore();
 		store.value = await source.readPreloadStore();
 		version.value++;
 	}, "Preloads_component_clear_zTejYm3eOBI", [store, version]);
 	const toggleSourceFilter = /*#__PURE__*/ inlinedQrl((key) => {
-		const sourceFilters = _captures[0];
+		let sourceFilters = _capturesObj._[0];
 		sourceFilters[key] = !sourceFilters[key];
 	}, "Preloads_component_toggleSourceFilter_zJPQ6oCTEQw", [sourceFilters]);
 	const togglePhaseFilter = /*#__PURE__*/ inlinedQrl((key) => {
-		const phaseFilters = _captures[0];
+		let phaseFilters = _capturesObj._[0];
 		phaseFilters[key] = !phaseFilters[key];
 	}, "Preloads_component_togglePhaseFilter_TkDMzfHnpcI", [phaseFilters]);
+	const Preloads_component_div_div_div_div_div_div_button_q_e_click_mEfAxj9bfwU = /*#__PURE__*/ inlinedQrl((_, _1, filter) => {
+		let activeFilter = _capturesObj._[0];
+		activeFilter.value = filter.id;
+	}, "Preloads_component_div_div_div_div_div_div_button_q_e_click_mEfAxj9bfwU", [activeFilter]).m();
 	return /*#__PURE__*/ _jsxSorted("div", null, { class: "h-full w-full flex-1 overflow-auto" }, /*#__PURE__*/ _jsxSorted("div", null, { class: "flex min-h-full flex-col gap-4" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-5" }, [
 		/*#__PURE__*/ _jsxSorted(StatCard, { value: String(vm.value.overview.total) }, {
 			label: "Visible QRLs",
-			subtitle: _fnSignal(_hf0, [vm])
-		}, null, 3, "LY_0"),
+			subtitle: _fnSignal(_hf0, [vm], _hf0_str)
+		}, null, 3, "oi_0"),
 		/*#__PURE__*/ _jsxSorted(StatCard, {
 			subtitle: `Max ${formatMs(vm.value.overview.maxImportDuration)}`,
 			value: formatMs(vm.value.overview.avgImportDuration)
-		}, { label: "Average Import Duration" }, null, 3, "LY_1"),
+		}, { label: "Average Import Duration" }, null, 3, "oi_1"),
 		/*#__PURE__*/ _jsxSorted(StatCard, {
 			subtitle: `Max ${formatMs(vm.value.overview.maxLoadDuration)}`,
 			value: formatMs(vm.value.overview.avgLoadDuration)
-		}, { label: "Average Load Duration" }, null, 3, "LY_2"),
+		}, { label: "Average Load Duration" }, null, 3, "oi_2"),
 		/*#__PURE__*/ _jsxSorted(StatCard, { value: String(vm.value.overview.correlated) }, {
 			label: "Preloaded Before Use",
 			subtitle: "Matched before the QRL fired"
-		}, null, 3, "LY_3"),
+		}, null, 3, "oi_3"),
 		/*#__PURE__*/ _jsxSorted(StatCard, { value: String(Math.max(0, vm.value.overview.total - vm.value.overview.correlated)) }, {
 			label: "Missed Preloads",
 			subtitle: "QRLs that were used first"
-		}, null, 3, "LY_4")
+		}, null, 3, "oi_4")
 	], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg flex min-h-0 flex-1 flex-col overflow-hidden rounded-2xl border" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex flex-wrap items-start justify-between gap-4 border-b p-4" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "flex flex-col gap-3" }, [
 		/*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground text-[11px]" }, [
 			"Runtime: ",
-			_fnSignal(_hf1, [runtimeState]),
+			_fnSignal(_hf1, [runtimeState], _hf1_str),
 			" • QRL requests:",
 			" ",
-			_fnSignal(_hf2, [runtimeState])
+			_fnSignal(_hf2, [runtimeState], _hf2_str)
 		], 3, null),
-		/*#__PURE__*/ _jsxSorted("div", null, { class: "flex flex-wrap gap-2" }, FILTERS.map((filter) => {
-			const qrl_0 = /*#__PURE__*/ inlinedQrl((_, _1, filter) => {
-				const activeFilter = _captures[0];
-				activeFilter.value = filter.id;
-			}, "Preloads_component_div_div_div_div_div_div_button_q_e_click_mEfAxj9bfwU", [activeFilter]).m();
-			return /*#__PURE__*/ _jsxSorted("button", {
-				class: activeFilter.value === filter.id ? "bg-primary text-primary-foreground rounded-full px-3 py-1.5 text-xs font-medium" : "border-border text-muted-foreground rounded-full border px-3 py-1.5 text-xs font-medium",
-				"q-e:click": qrl_0,
-				"q:p": filter
-			}, { type: "button" }, _wrapProp(filter, "label"), 4, filter.id);
-		}), 1, null),
+		/*#__PURE__*/ _jsxSorted("div", null, { class: "flex flex-wrap gap-2" }, FILTERS.map((filter) => /*#__PURE__*/ _jsxSorted("button", {
+			class: activeFilter.value === filter.id ? "bg-primary text-primary-foreground rounded-full px-3 py-1.5 text-xs font-medium" : "border-border text-muted-foreground rounded-full border px-3 py-1.5 text-xs font-medium",
+			"q-e:click": Preloads_component_div_div_div_div_div_div_button_q_e_click_mEfAxj9bfwU,
+			"q:p": filter
+		}, { type: "button" }, _wrapProp(filter, "label"), 4, filter.id)), 1, null),
 		/*#__PURE__*/ _jsxSorted("div", null, { class: "flex flex-wrap gap-2" }, [
 			/*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground mr-1 text-xs font-medium tracking-wide uppercase" }, "Sources", 3, null),
 			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border text-muted-foreground flex cursor-default items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium opacity-90" }, [
@@ -155,84 +159,92 @@ var Preloads = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 					class: "h-3.5 w-3.5 rounded"
 				}, null, 3, null),
 				"Current Project (",
-				_fnSignal(_hf3, [vm]),
+				_fnSignal(_hf3, [vm], _hf3_str),
 				")"
 			], 3, null),
-			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", {
-				"q-e:change": /*#__PURE__*/ inlinedQrl((_, _1, toggleSourceFilter) => toggleSourceFilter("vitePluginInjected"), "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_PO4w6A5Idk4").m(),
-				"q:p": toggleSourceFilter
-			}, {
+			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", null, {
 				type: "checkbox",
 				checked: _wrapProp(sourceFilters, "vitePluginInjected"),
 				class: "h-3.5 w-3.5 rounded focus:ring-0",
-				style: { accentColor: "var(--color-primary-active)" }
-			}, null, 6, null), makeLabelCount("Vite Plugin Injected", vm.value.sourceCounts["vite-plugin-injected"])], 1, null),
-			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", {
-				"q-e:change": /*#__PURE__*/ inlinedQrl((_, _1, toggleSourceFilter) => toggleSourceFilter("nodeModules"), "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_1_a4f6Hw5N5s4").m(),
-				"q:p": toggleSourceFilter
-			}, {
+				style: { accentColor: "var(--color-primary-active)" },
+				"q-e:change": /*#__PURE__*/ inlinedQrl(() => {
+					let toggleSourceFilter = _capturesObj._[0];
+					return toggleSourceFilter("vitePluginInjected");
+				}, "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_PO4w6A5Idk4", [toggleSourceFilter])
+			}, null, 3, null), makeLabelCount("Vite Plugin Injected", vm.value.sourceCounts["vite-plugin-injected"])], 1, null),
+			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", null, {
 				type: "checkbox",
 				checked: _wrapProp(sourceFilters, "nodeModules"),
 				class: "h-3.5 w-3.5 rounded focus:ring-0",
-				style: { accentColor: "var(--color-primary-active)" }
-			}, null, 6, null), makeLabelCount("Node Modules", vm.value.sourceCounts.node_modules)], 1, null),
-			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", {
-				"q-e:change": /*#__PURE__*/ inlinedQrl((_, _1, toggleSourceFilter) => toggleSourceFilter("virtualModule"), "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_2_JsdB9QG1WM0").m(),
-				"q:p": toggleSourceFilter
-			}, {
+				style: { accentColor: "var(--color-primary-active)" },
+				"q-e:change": /*#__PURE__*/ inlinedQrl(() => {
+					let toggleSourceFilter = _capturesObj._[0];
+					return toggleSourceFilter("nodeModules");
+				}, "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_1_a4f6Hw5N5s4", [toggleSourceFilter])
+			}, null, 3, null), makeLabelCount("Node Modules", vm.value.sourceCounts.node_modules)], 1, null),
+			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", null, {
 				type: "checkbox",
 				checked: _wrapProp(sourceFilters, "virtualModule"),
 				class: "h-3.5 w-3.5 rounded focus:ring-0",
-				style: { accentColor: "var(--color-primary-active)" }
-			}, null, 6, null), makeLabelCount("Virtual Module", vm.value.sourceCounts["virtual-module"])], 1, null),
-			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", {
-				"q-e:change": /*#__PURE__*/ inlinedQrl((_, _1, toggleSourceFilter) => toggleSourceFilter("generated"), "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_3_90iPosvF3mQ").m(),
-				"q:p": toggleSourceFilter
-			}, {
+				style: { accentColor: "var(--color-primary-active)" },
+				"q-e:change": /*#__PURE__*/ inlinedQrl(() => {
+					let toggleSourceFilter = _capturesObj._[0];
+					return toggleSourceFilter("virtualModule");
+				}, "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_2_JsdB9QG1WM0", [toggleSourceFilter])
+			}, null, 3, null), makeLabelCount("Virtual Module", vm.value.sourceCounts["virtual-module"])], 1, null),
+			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", null, {
 				type: "checkbox",
 				checked: _wrapProp(sourceFilters, "generated"),
 				class: "h-3.5 w-3.5 rounded focus:ring-0",
-				style: { accentColor: "var(--color-primary-active)" }
-			}, null, 6, null), makeLabelCount("Generated", vm.value.sourceCounts.generated)], 1, null),
-			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", {
-				"q-e:change": /*#__PURE__*/ inlinedQrl((_, _1, toggleSourceFilter) => toggleSourceFilter("external"), "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_4_AuLKgSZkHes").m(),
-				"q:p": toggleSourceFilter
-			}, {
+				style: { accentColor: "var(--color-primary-active)" },
+				"q-e:change": /*#__PURE__*/ inlinedQrl(() => {
+					let toggleSourceFilter = _capturesObj._[0];
+					return toggleSourceFilter("generated");
+				}, "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_3_90iPosvF3mQ", [toggleSourceFilter])
+			}, null, 3, null), makeLabelCount("Generated", vm.value.sourceCounts.generated)], 1, null),
+			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", null, {
 				type: "checkbox",
 				checked: _wrapProp(sourceFilters, "external"),
 				class: "h-3.5 w-3.5 rounded focus:ring-0",
-				style: { accentColor: "var(--color-primary-active)" }
-			}, null, 6, null), makeLabelCount("External", vm.value.sourceCounts.external)], 1, null),
-			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", {
-				"q-e:change": /*#__PURE__*/ inlinedQrl((_, _1, toggleSourceFilter) => toggleSourceFilter("unknown"), "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_5_0E0MQZDqb5U").m(),
-				"q:p": toggleSourceFilter
-			}, {
+				style: { accentColor: "var(--color-primary-active)" },
+				"q-e:change": /*#__PURE__*/ inlinedQrl(() => {
+					let toggleSourceFilter = _capturesObj._[0];
+					return toggleSourceFilter("external");
+				}, "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_4_AuLKgSZkHes", [toggleSourceFilter])
+			}, null, 3, null), makeLabelCount("External", vm.value.sourceCounts.external)], 1, null),
+			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", null, {
 				type: "checkbox",
 				checked: _wrapProp(sourceFilters, "unknown"),
 				class: "h-3.5 w-3.5 rounded focus:ring-0",
-				style: { accentColor: "var(--color-primary-active)" }
-			}, null, 6, null), makeLabelCount("Unknown", vm.value.sourceCounts.unknown)], 1, null)
+				style: { accentColor: "var(--color-primary-active)" },
+				"q-e:change": /*#__PURE__*/ inlinedQrl(() => {
+					let toggleSourceFilter = _capturesObj._[0];
+					return toggleSourceFilter("unknown");
+				}, "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_5_0E0MQZDqb5U", [toggleSourceFilter])
+			}, null, 3, null), makeLabelCount("Unknown", vm.value.sourceCounts.unknown)], 1, null)
 		], 1, null),
 		/*#__PURE__*/ _jsxSorted("div", null, { class: "flex flex-wrap gap-2" }, [
 			/*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground mr-1 text-xs font-medium tracking-wide uppercase" }, "Phase", 3, null),
-			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", {
-				"q-e:change": /*#__PURE__*/ inlinedQrl((_, _1, togglePhaseFilter) => togglePhaseFilter("csr"), "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_6_L5lgZJlMTm8").m(),
-				"q:p": togglePhaseFilter
-			}, {
+			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", null, {
 				type: "checkbox",
 				checked: _wrapProp(phaseFilters, "csr"),
 				class: "h-3.5 w-3.5 rounded focus:ring-0",
-				style: { accentColor: "var(--color-primary-active)" }
-			}, null, 6, null), makeLabelCount("CSR", vm.value.phaseCounts.csr)], 1, null),
-			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", {
-				"q-e:change": /*#__PURE__*/ inlinedQrl((_, _1, togglePhaseFilter) => togglePhaseFilter("ssr"), "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_7_PiCA1ivS01Y").m(),
-				"q:p": togglePhaseFilter
-			}, {
+				style: { accentColor: "var(--color-primary-active)" },
+				"q-e:change": /*#__PURE__*/ inlinedQrl(() => {
+					let togglePhaseFilter = _capturesObj._[0];
+					return togglePhaseFilter("csr");
+				}, "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_6_L5lgZJlMTm8", [togglePhaseFilter])
+			}, null, 3, null), makeLabelCount("CSR", vm.value.phaseCounts.csr)], 1, null),
+			/*#__PURE__*/ _jsxSorted("label", null, { class: "border-border flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium" }, [/*#__PURE__*/ _jsxSorted("input", null, {
 				type: "checkbox",
 				checked: _wrapProp(phaseFilters, "ssr"),
 				class: "h-3.5 w-3.5 rounded focus:ring-0",
-				style: { accentColor: "var(--color-primary-active)" }
-			}, null, 6, null), makeLabelCount("SSR", vm.value.phaseCounts.ssr)], 1, null)
+				style: { accentColor: "var(--color-primary-active)" },
+				"q-e:change": /*#__PURE__*/ inlinedQrl(() => {
+					let togglePhaseFilter = _capturesObj._[0];
+					return togglePhaseFilter("ssr");
+				}, "Preloads_component_div_div_div_div_div_div_label_input_q_e_change_7_PiCA1ivS01Y", [togglePhaseFilter])
+			}, null, 3, null), makeLabelCount("SSR", vm.value.phaseCounts.ssr)], 1, null)
 		], 1, null)
 	], 1, null), /*#__PURE__*/ _jsxSorted("button", null, {
 		type: "button",
@@ -250,11 +262,11 @@ var Preloads = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 		/*#__PURE__*/ _jsxSorted("td", null, { class: "px-4 py-3" }, [
 			/*#__PURE__*/ _jsxSorted("div", null, { class: "font-medium break-all" }, _wrapProp(row, "shortHref"), 1, null),
 			/*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground mt-1 text-xs break-all" }, _wrapProp(row, "href"), 1, null),
-			row.qrlSymbol ? /*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground mt-1 text-xs" }, ["Symbol: ", _wrapProp(row, "qrlSymbol")], 1, "LY_5") : null
+			row.qrlSymbol ? /*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground mt-1 text-xs" }, ["Symbol: ", _wrapProp(row, "qrlSymbol")], 1, "oi_5") : null
 		], 1, null),
 		/*#__PURE__*/ _jsxSorted("td", null, { class: "px-4 py-3" }, [
-			/*#__PURE__*/ _jsxSorted("div", null, null, _fnSignal(_hf4, [row]), 1, null),
-			/*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground mt-1 text-xs" }, _fnSignal(_hf5, [row]), 1, null),
+			/*#__PURE__*/ _jsxSorted("div", null, null, _fnSignal(_hf4, [row], _hf4_str), 1, null),
+			/*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground mt-1 text-xs" }, _fnSignal(_hf5, [row], _hf5_str), 1, null),
 			/*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground mt-1 text-[11px] tracking-wide uppercase" }, _wrapProp(row, "originKind"), 1, null)
 		], 1, null),
 		/*#__PURE__*/ _jsxSorted("td", null, { class: "px-4 py-3" }, /*#__PURE__*/ _jsxSorted("div", null, { class: "font-medium tracking-wide uppercase" }, _wrapProp(row, "phase"), 1, null), 1, null),
@@ -265,6 +277,6 @@ var Preloads = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 	], 1, row.id)) : /*#__PURE__*/ _jsxSorted("tr", null, { class: "border-glass-border border-t" }, /*#__PURE__*/ _jsxSorted("td", null, {
 		class: "text-muted-foreground px-4 py-8 text-center text-sm",
 		colSpan: 7
-	}, "No rows match the current filters. Uncheck a filter or re-enable CSR to view data.", 3, null), 3, "LY_6"), 1, null)], 1, null), 1, null)], 1, null)], 1, null), 1, "LY_7");
+	}, "No rows match the current filters. Uncheck a filter or re-enable CSR to view data.", 3, null), 3, "oi_6"), 1, null)], 1, null), 1, null)], 1, null)], 1, null), 1, "oi_7");
 }, "Preloads_component_fKcrex5znk4"));
 export { Preloads };

package/dist/ui/packages/devtools/ui/src/features/RenderTree/RenderTree.qwik.mjs

@@ -1,5 +1,5 @@
 import { __toESM } from "../../../../../../_virtual/_rolldown/runtime.qwik.mjs";
-import { require_browser } from "../../../../../../node_modules/.pnpm/debug@4.4.3_supports-color@10.2.2/node_modules/debug/src/browser.qwik.mjs";
+import { require_browser } from "../../../../../../node_modules/.pnpm/debug@4.4.3_supports-color@11.0.0/node_modules/debug/src/browser.qwik.mjs";
 import { getHighlighter } from "../../utils/shiki.qwik.mjs";
 import { Tree } from "../../components/Tree/Tree.qwik.mjs";
 import { getPageDataSource } from "../../devtools/page-data-source.qwik.mjs";
@@ -9,7 +9,7 @@ import { StateTreeNodeLabel } from "./components/StateTreeNodeLabel.qwik.mjs";
 import { HookFiltersCard } from "./components/HookFiltersCard.qwik.mjs";
 import { HighlightedCodeList } from "./components/HighlightedCodeList.qwik.mjs";
 import { getCodeLanguage } from "./utils/getCodeLanguage.qwik.mjs";
-import { Resource, _captures, _jsxSorted, _wrapProp, componentQrl, inlinedQrl, useComputedQrl, useResourceQrl, useSignal, useStylesQrl, useVisibleTaskQrl } from "@qwik.dev/core";
+import { Resource, _capturesObj, _jsxSorted, _wrapProp, componentQrl, inlinedQrl, useComputedQrl, useResourceQrl, useSignal, useStylesQrl, useVisibleTaskQrl } from "@qwik.dev/core";
 import { getViteClientRpc } from "@qwik.dev/devtools/kit";
 var log = (0, (/* @__PURE__ */ __toESM(require_browser(), 1)).default)("qwik:devtools:renderTree");
 var LOAD_RETRY_DELAY_MS = 300;
@@ -25,7 +25,7 @@ var RenderTree = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps)
     }
   `, "RenderTree_component_useStyles_AWhkWvC33YA"));
 	const revealNode = useComputedQrl(/*#__PURE__*/ inlinedQrl(() => {
-		return _captures[0].state.componentReveal;
+		return _capturesObj._[0].state.componentReveal;
 	}, "RenderTree_component_revealNode_useComputed_kosn0Rf4154", [_rawProps]));
 	const codes = useSignal([]);
 	const data = useSignal([]);
@@ -35,7 +35,7 @@ var RenderTree = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps)
 	const hookFilters = useSignal([]);
 	const hooksOpen = useSignal(true);
 	const highlightedCodesResource = useResourceQrl(/*#__PURE__*/ inlinedQrl(async (_rawProps) => {
-		const codes = _captures[0];
+		let codes = _capturesObj._[0];
 		_rawProps.track(() => codes.value);
 		if (!codes.value.length) return [];
 		const highlighter = await getHighlighter();
@@ -47,7 +47,7 @@ var RenderTree = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps)
 		});
 	}, "RenderTree_component_highlightedCodesResource_useResource_hdA49UhUQ7M", [codes]));
 	useVisibleTaskQrl(/*#__PURE__*/ inlinedQrl(({ cleanup }) => {
-		const data = _captures[0], lastTreeIds = _captures[1];
+		let data = _capturesObj._[0], lastTreeIds = _capturesObj._[1];
 		const source = getPageDataSource();
 		const syncTree = (tree) => {
 			if (!tree || tree.length === 0) return false;
@@ -71,7 +71,7 @@ var RenderTree = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps)
 		});
 	}, "RenderTree_component_useVisibleTask_zrAfIjp4mH4", [data, lastTreeIds]));
 	const onNodeClick = /*#__PURE__*/ inlinedQrl(async (node) => {
-		const codes = _captures[0], fullStateTree = _captures[1], hookFilters = _captures[2], stateTree = _captures[3];
+		let codes = _capturesObj._[0], fullStateTree = _capturesObj._[1], hookFilters = _capturesObj._[2], stateTree = _capturesObj._[3];
 		log(" current node clicked: %O", node);
 		const source = getPageDataSource();
 		const name = node.name || node.label || "";
@@ -113,15 +113,15 @@ var RenderTree = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps)
 	]);
 	const currentTab = useSignal("state");
 	const showStateTab = /*#__PURE__*/ inlinedQrl(() => {
-		const currentTab = _captures[0];
+		let currentTab = _capturesObj._[0];
 		currentTab.value = "state";
 	}, "RenderTree_component_showStateTab_O4o7nNS0Yc4", [currentTab]);
 	const showCodeTab = /*#__PURE__*/ inlinedQrl(() => {
-		const currentTab = _captures[0];
+		let currentTab = _capturesObj._[0];
 		currentTab.value = "code";
 	}, "RenderTree_component_showCodeTab_m6wrkPHXkYM", [currentTab]);
 	const refreshFilteredStateTree = /*#__PURE__*/ inlinedQrl(() => {
-		const fullStateTree = _captures[0], hookFilters = _captures[1], stateTree = _captures[2];
+		let fullStateTree = _capturesObj._[0], hookFilters = _capturesObj._[1], stateTree = _capturesObj._[2];
 		stateTree.value = applyHookFilters(fullStateTree.value, hookFilters.value);
 	}, "RenderTree_component_refreshFilteredStateTree_Ng6tq73zzek", [
 		fullStateTree,
@@ -129,7 +129,7 @@ var RenderTree = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps)
 		stateTree
 	]);
 	const handleSelectAll = /*#__PURE__*/ inlinedQrl(() => {
-		const hookFilters = _captures[0], refreshFilteredStateTree = _captures[1];
+		let hookFilters = _capturesObj._[0], refreshFilteredStateTree = _capturesObj._[1];
 		hookFilters.value = hookFilters.value.map((item) => ({
 			...item,
 			display: true
@@ -137,7 +137,7 @@ var RenderTree = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps)
 		refreshFilteredStateTree();
 	}, "RenderTree_component_handleSelectAll_yl6MuzcFZk0", [hookFilters, refreshFilteredStateTree]);
 	const handleClear = /*#__PURE__*/ inlinedQrl(() => {
-		const hookFilters = _captures[0], refreshFilteredStateTree = _captures[1];
+		let hookFilters = _capturesObj._[0], refreshFilteredStateTree = _capturesObj._[1];
 		hookFilters.value = hookFilters.value.map((item) => ({
 			...item,
 			display: false
@@ -145,7 +145,7 @@ var RenderTree = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps)
 		refreshFilteredStateTree();
 	}, "RenderTree_component_handleClear_0fY9KH70S2A", [hookFilters, refreshFilteredStateTree]);
 	const handleFilterChange = /*#__PURE__*/ inlinedQrl((index, checked) => {
-		const hookFilters = _captures[0], refreshFilteredStateTree = _captures[1];
+		let hookFilters = _capturesObj._[0], refreshFilteredStateTree = _capturesObj._[1];
 		hookFilters.value = hookFilters.value.map((item, itemIndex) => itemIndex === index ? {
 			...item,
 			display: checked
@@ -156,45 +156,49 @@ var RenderTree = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps)
 		/*#__PURE__*/ _jsxSorted("div", null, {
 			class: "custom-scrollbar w-1/2 overflow-hidden p-3",
 			style: { minWidth: "360px" }
-		}, /*#__PURE__*/ _jsxSorted(Tree, { onRevealed$: /*#__PURE__*/ inlinedQrl(() => {
-			const _rawProps = _captures[0];
-			return _rawProps.state.componentReveal = null;
-		}, "RenderTree_component_div_div_div_Tree_onRevealed_EevePL82QY4", [_rawProps]) }, {
-			data,
+		}, /*#__PURE__*/ _jsxSorted(Tree, {
 			onNodeClick,
+			onRevealed$: /*#__PURE__*/ inlinedQrl(() => {
+				let _rawProps = _capturesObj._[0];
+				return _rawProps.state.componentReveal = null;
+			}, "RenderTree_component_div_div_div_Tree_onRevealed_EevePL82QY4", [_rawProps])
+		}, {
+			data,
 			revealNode
-		}, null, 2, "0a_0"), 1, null),
+		}, null, 2, "U1_1"), 1, null),
 		/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border border-l" }, null, 3, null),
 		/*#__PURE__*/ _jsxSorted("div", null, { class: "flex h-full min-h-0 w-1/2 flex-col overflow-hidden p-4" }, [
 			/*#__PURE__*/ _jsxSorted(RenderTreeTabs, null, {
 				currentTab: _wrapProp(currentTab),
 				onStateClick$: showStateTab,
 				onCodeClick$: showCodeTab
-			}, null, 3, "0a_1"),
-			currentTab.value === "state" && /*#__PURE__*/ _jsxSorted("div", null, { class: "mt-5 flex min-h-0 flex-1 flex-col" }, [/*#__PURE__*/ _jsxSorted(HookFiltersCard, { onToggleOpen$: /*#__PURE__*/ inlinedQrl(() => {
-				const hooksOpen = _captures[0];
-				return hooksOpen.value = !hooksOpen.value;
-			}, "RenderTree_component_div_div_div_div_HookFiltersCard_onToggleOpen_htBb6dFJgKk", [hooksOpen]) }, {
+			}, null, 3, "U1_2"),
+			currentTab.value === "state" && /*#__PURE__*/ _jsxSorted("div", null, { class: "mt-5 flex min-h-0 flex-1 flex-col" }, [/*#__PURE__*/ _jsxSorted(HookFiltersCard, null, {
 				filters: _wrapProp(hookFilters),
 				isOpen: _wrapProp(hooksOpen),
 				onSelectAll$: handleSelectAll,
 				onClear$: handleClear,
+				onToggleOpen$: /*#__PURE__*/ inlinedQrl(() => {
+					let hooksOpen = _capturesObj._[0];
+					return hooksOpen.value = !hooksOpen.value;
+				}, "RenderTree_component_div_div_div_div_HookFiltersCard_onToggleOpen_htBb6dFJgKk", [hooksOpen]),
 				onFilterChange$: handleFilterChange
-			}, null, 2, "0a_2"), /*#__PURE__*/ _jsxSorted("div", null, { class: "mt-4 min-h-0 flex-1 overflow-y-auto p-2" }, /*#__PURE__*/ _jsxSorted(Tree, { renderNode: /*#__PURE__*/ inlinedQrl((node) => {
-				return /*#__PURE__*/ _jsxSorted(StateTreeNodeLabel, { node }, null, null, 3, "0a_3");
-			}, "RenderTree_component_div_div_div_div_div_Tree_renderNode_h2NF5iZQX8A") }, {
+			}, null, 3, "U1_3"), /*#__PURE__*/ _jsxSorted("div", null, { class: "mt-4 min-h-0 flex-1 overflow-y-auto p-2" }, /*#__PURE__*/ _jsxSorted(Tree, null, {
 				data: stateTree,
 				gap: 10,
 				animate: true,
 				animationDuration: 200,
-				isHover: true
-			}, null, 3, "0a_4"), 1, null)], 1, "0a_5"),
+				isHover: true,
+				renderNode: /*#__PURE__*/ inlinedQrl((node) => {
+					return /*#__PURE__*/ _jsxSorted(StateTreeNodeLabel, { node }, null, null, 3, "U1_0");
+				}, "RenderTree_component_div_div_div_div_div_Tree_renderNode_h2NF5iZQX8A")
+			}, null, 3, "U1_4"), 1, null)], 1, "U1_5"),
 			currentTab.value === "code" && /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg mt-4 min-h-0 flex-1 overflow-y-auto rounded-xl border p-2" }, /*#__PURE__*/ _jsxSorted(Resource, null, {
 				value: highlightedCodesResource,
-				onPending: () => /*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground p-2 text-sm" }, "Loading code highlights…", 3, "0a_6"),
-				onResolved: (highlighted) => /*#__PURE__*/ _jsxSorted(HighlightedCodeList, { highlighted }, { codes: _wrapProp(codes) }, null, 3, "0a_7")
-			}, null, 3, "0a_8"), 1, "0a_9")
+				onPending: () => /*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground p-2 text-sm" }, "Loading code highlights…", 3, "U1_6"),
+				onResolved: (highlighted) => /*#__PURE__*/ _jsxSorted(HighlightedCodeList, { highlighted }, { codes: _wrapProp(codes) }, null, 3, "U1_7")
+			}, null, 3, "U1_8"), 1, "U1_9")
 		], 1, null)
-	], 1, null), 1, "0a_10");
+	], 1, null), 1, "U1_10");
 }, "RenderTree_component_Sf4kwEPC9Qg"));
 export { RenderTree };

package/dist/ui/packages/devtools/ui/src/features/RenderTree/components/HighlightedCodeList.qwik.mjs

@@ -1,7 +1,8 @@
 import { _fnSignal, _jsxSorted, _wrapProp, componentQrl, inlinedQrl } from "@qwik.dev/core";
 import { Fragment } from "@qwik.dev/core/jsx-runtime";
 var _hf0 = (p0, p1) => p0.highlighted[p1] || "";
+var _hf0_str = "p0.highlighted[p1]||\"\"";
 var HighlightedCodeList = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps) => {
-	return /*#__PURE__*/ _jsxSorted(Fragment, null, null, _rawProps.codes.map((item, index) => /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg hover:bg-card-item-hover-bg mb-4 rounded-xl border p-4 transition-colors" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "text-primary mb-2 text-base font-semibold break-all" }, _wrapProp(item, "pathId"), 1, null), /*#__PURE__*/ _jsxSorted("pre", { dangerouslySetInnerHTML: _fnSignal(_hf0, [_rawProps, index]) }, { class: "overflow-hidden" }, null, 3, null)], 1, item.pathId)), 1, "XI_0");
+	return /*#__PURE__*/ _jsxSorted(Fragment, null, null, _rawProps.codes.map((item, index) => /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg hover:bg-card-item-hover-bg mb-4 rounded-xl border p-4 transition-colors" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "text-primary mb-2 text-base font-semibold break-all" }, _wrapProp(item, "pathId"), 1, null), /*#__PURE__*/ _jsxSorted("pre", { dangerouslySetInnerHTML: _fnSignal(_hf0, [_rawProps, index], _hf0_str) }, { class: "overflow-hidden" }, null, 3, null)], 1, item.pathId)), 1, "NQ_0");
 }, "HighlightedCodeList_component_R9Fi7pmo1qQ"));
 export { HighlightedCodeList };

package/dist/ui/packages/devtools/ui/src/features/RenderTree/components/HookFiltersCard.qwik.mjs

@@ -1,33 +1,32 @@
 import { IconChevronUpMini } from "../../../components/Icons/Icons.qwik.mjs";
-import { _captures, _fnSignal, _jsxSorted, _wrapProp, componentQrl, inlinedQrl } from "@qwik.dev/core";
+import { _capturesObj, _fnSignal, _jsxSorted, _wrapProp, componentQrl, inlinedQrl } from "@qwik.dev/core";
 var _hf0 = (p0) => ({
 	maxHeight: p0.isOpen ? "800px" : "0px",
 	opacity: p0.isOpen ? "1" : "0",
 	transition: "max-height 200ms ease, opacity 200ms ease"
 });
+var _hf0_str = "{maxHeight:p0.isOpen?\"800px\":\"0px\",opacity:p0.isOpen?\"1\":\"0\",transition:\"max-height 200ms ease, opacity 200ms ease\"}";
 var HookFiltersCard = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps) => {
+	const HookFiltersCard_component_div_div_label_input_q_e_change_FeP7wk8oowk = /*#__PURE__*/ inlinedQrl((event, _1, index) => {
+		let _rawProps = _capturesObj._[0];
+		const target = event.target;
+		_rawProps.onFilterChange$(index, target.checked);
+	}, "HookFiltersCard_component_div_div_label_input_q_e_change_FeP7wk8oowk", [_rawProps]).m();
 	return /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg rounded-xl border" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex items-center justify-between border-b px-2 py-2" }, [/*#__PURE__*/ _jsxSorted("span", null, { class: "text-muted-foreground text-xs font-medium" }, "Hooks", 3, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "flex items-center space-x-2" }, [
 		/*#__PURE__*/ _jsxSorted("button", { "q-e:click": _rawProps.onSelectAll$ }, { class: "text-primary px-2 py-1 text-xs hover:underline" }, "Select all", 2, null),
 		/*#__PURE__*/ _jsxSorted("button", { "q-e:click": _rawProps.onClear$ }, { class: "text-muted-foreground hover:text-foreground px-2 py-1 text-xs hover:underline" }, "Clear", 2, null),
 		/*#__PURE__*/ _jsxSorted("button", { "q-e:click": _rawProps.onToggleOpen$ }, {
 			"aria-label": "toggle hooks",
 			class: "text-muted-foreground hover:text-foreground rounded p-1"
-		}, /*#__PURE__*/ _jsxSorted(IconChevronUpMini, { class: `h-4 w-4 transition-transform duration-200 ${_rawProps.isOpen ? "rotate-180" : "-rotate-90"}` }, null, null, 3, "pG_0"), 0, null)
-	], 1, null)], 1, null), /*#__PURE__*/ _jsxSorted("div", { style: _fnSignal(_hf0, [_rawProps]) }, { class: "grid grid-cols-2 gap-x-4 gap-y-3 overflow-hidden px-3 py-2 text-sm" }, _rawProps.filters.map((item, index) => {
-		const qrl_0 = /*#__PURE__*/ inlinedQrl((event, _1, index) => {
-			const _rawProps = _captures[0];
-			const target = event.target;
-			_rawProps.onFilterChange$(index, target.checked);
-		}, "HookFiltersCard_component_div_div_label_input_q_e_change_FeP7wk8oowk", [_rawProps]).m();
-		return /*#__PURE__*/ _jsxSorted("label", null, { class: "flex min-w-0 cursor-pointer items-center gap-2" }, [/*#__PURE__*/ _jsxSorted("input", {
-			checked: _wrapProp(item, "display"),
-			"q-e:change": qrl_0,
-			"q:p": index
-		}, {
-			type: "checkbox",
-			class: "h-4 w-4 shrink-0 cursor-pointer rounded focus:ring-0",
-			style: { accentColor: "var(--color-primary-active)" }
-		}, null, 6, null), /*#__PURE__*/ _jsxSorted("span", { title: _wrapProp(item, "key") }, { class: "ml-2 truncate select-none" }, _wrapProp(item, "key"), 1, null)], 1, item.key);
-	}), 1, null)], 1, "pG_1");
+		}, /*#__PURE__*/ _jsxSorted(IconChevronUpMini, { class: `h-4 w-4 transition-transform duration-200 ${_rawProps.isOpen ? "rotate-180" : "-rotate-90"}` }, null, null, 3, "5E_0"), 0, null)
+	], 1, null)], 1, null), /*#__PURE__*/ _jsxSorted("div", { style: _fnSignal(_hf0, [_rawProps], _hf0_str) }, { class: "grid grid-cols-2 gap-x-4 gap-y-3 overflow-hidden px-3 py-2 text-sm" }, _rawProps.filters.map((item, index) => /*#__PURE__*/ _jsxSorted("label", null, { class: "flex min-w-0 cursor-pointer items-center gap-2" }, [/*#__PURE__*/ _jsxSorted("input", {
+		checked: _wrapProp(item, "display"),
+		"q-e:change": HookFiltersCard_component_div_div_label_input_q_e_change_FeP7wk8oowk,
+		"q:p": index
+	}, {
+		type: "checkbox",
+		class: "h-4 w-4 shrink-0 cursor-pointer rounded focus:ring-0",
+		style: { accentColor: "var(--color-primary-active)" }
+	}, null, 6, null), /*#__PURE__*/ _jsxSorted("span", { title: _wrapProp(item, "key") }, { class: "ml-2 truncate select-none" }, _wrapProp(item, "key"), 1, null)], 1, item.key)), 1, null)], 1, "5E_1");
 }, "HookFiltersCard_component_nIw23Ky2Txs"));
 export { HookFiltersCard };

package/dist/ui/packages/devtools/ui/src/features/RenderTree/components/RenderTreeTabs.qwik.mjs

@@ -1,10 +1,12 @@
 import { _fnSignal, _jsxSorted, componentQrl, inlinedQrl } from "@qwik.dev/core";
 var _hf0 = (p0, p1) => p0.currentTab === p1 ? { boxShadow: "inset 0 -2px 0 0 var(--color-primary)" } : {};
+var _hf0_str = "p0.currentTab===p1?{boxShadow:\"inset 0 -2px 0 0 var(--color-primary)\"}:{}";
 var RenderTreeTabs = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps) => {
 	return /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex space-x-2 border-b pb-1" }, ["state", "code"].map((tabId) => /*#__PURE__*/ _jsxSorted("button", {
 		class: ["rounded-lg px-4 py-2.5 text-sm font-medium transition-all duration-200", _rawProps.currentTab === tabId ? "text-primary bg-primary/10" : "text-muted-foreground hover:text-foreground hover:bg-foreground/5"],
 		"q-e:click": tabId === "state" ? _rawProps.onStateClick$ : _rawProps.onCodeClick$,
-		style: _fnSignal(_hf0, [_rawProps, tabId])
-	}, null, tabId === "state" ? "State" : "Code", 0, tabId)), 1, "Mj_0");
+		"q:p": tabId,
+		style: _fnSignal(_hf0, [_rawProps, tabId], _hf0_str)
+	}, null, tabId === "state" ? "State" : "Code", 4, tabId)), 1, "DH_0");
 }, "RenderTreeTabs_component_fyOtScBp88U"));
 export { RenderTreeTabs };

package/dist/ui/packages/devtools/ui/src/features/RenderTree/components/StateTreeNodeLabel.qwik.mjs

@@ -1,20 +1,21 @@
 import { getValueColorClass } from "../utils/getValueColorClass.qwik.mjs";
-import { _jsxSorted, componentQrl, inlinedQrl } from "@qwik.dev/core";
+import { _fnSignal, _jsxSorted, componentQrl, inlinedQrl } from "@qwik.dev/core";
 import { Fragment } from "@qwik.dev/core/jsx-runtime";
+var _hf0 = (p0) => p0[0];
+var _hf0_str = "p0[0]";
 var StateTreeNodeLabel = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps) => {
 	const label = _rawProps.node.label || _rawProps.node.name || "";
 	const parts = label.split(":");
-	if (_rawProps.node.children && parts.length === 1) return /*#__PURE__*/ _jsxSorted("span", null, { class: "font-semibold text-pink-400" }, label, 1, "mY_0");
+	if (_rawProps.node.children && parts.length === 1) return /*#__PURE__*/ _jsxSorted("span", null, { class: "font-semibold text-pink-400" }, label, 1, "Pv_0");
 	if (parts.length > 1) {
-		const key = parts[0];
 		const value = parts.slice(1).join(":").trim();
 		const valueClass = getValueColorClass(_rawProps.node, value);
 		return /*#__PURE__*/ _jsxSorted(Fragment, null, null, [
-			/*#__PURE__*/ _jsxSorted("span", null, { class: "text-blue-400" }, key, 1, null),
-			/*#__PURE__*/ _jsxSorted("span", null, { class: "text-foreground/70" }, " : ", 3, null),
+			/*#__PURE__*/ _jsxSorted("span", null, { class: "text-blue-400" }, _fnSignal(_hf0, [parts], _hf0_str), 1, null),
+			/*#__PURE__*/ _jsxSorted("span", null, { class: "text-foreground/70" }, ":", 3, null),
 			/*#__PURE__*/ _jsxSorted("span", { class: valueClass }, null, value, 1, null)
-		], 1, "mY_1");
+		], 1, "Pv_1");
 	}
-	return /*#__PURE__*/ _jsxSorted("span", null, null, label, 1, "mY_2");
+	return /*#__PURE__*/ _jsxSorted("span", null, null, label, 1, "Pv_2");
 }, "StateTreeNodeLabel_component_ONzjgo7C9iQ"));
 export { StateTreeNodeLabel };