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

package/dist/ui/packages/devtools/ui/src/devtools/QwikDevtoolsExtension.qwik.mjs

@@ -14,7 +14,8 @@ import { _captures, _jsxSorted, componentQrl, inlinedQrl, useStore, useVisibleTa
 * The outer `.qwik-devtools` wrapper is required because the Tailwind utilities are scoped under
 * `.qwik-devtools .{class}` in the CSS build. It must be a separate element so descendant selectors
 * match.
-*/ var QwikDevtoolsExtension = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
+*/
+var QwikDevtoolsExtension = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 	const state = useStore(createDevtoolsState({ isExtension: true }));
 	useVisibleTaskQrl(/*#__PURE__*/ inlinedQrl(async () => {
 		const state = _captures[0];
@@ -26,6 +27,6 @@ import { _captures, _jsxSorted, componentQrl, inlinedQrl, useStore, useVisibleTa
 	}, /*#__PURE__*/ _jsxSorted("div", null, {
 		class: "flex overflow-hidden",
 		style: "height: 100%; width: 100%;"
-	}, [/*#__PURE__*/ _jsxSorted(DevtoolsSidebar, null, { state }, null, 3, "Nl_0"), /*#__PURE__*/ _jsxSorted("div", null, { class: "custom-scrollbar min-h-0 flex-1 overflow-y-auto p-4" }, /*#__PURE__*/ _jsxSorted(DevtoolsContent, null, { state }, null, 3, "Nl_1"), 1, null)], 1, null), 1, "Nl_2");
+	}, [/*#__PURE__*/ _jsxSorted(DevtoolsSidebar, null, { state }, null, 3, "jJ_0"), /*#__PURE__*/ _jsxSorted("div", null, { class: "custom-scrollbar min-h-0 flex-1 overflow-y-auto p-4" }, /*#__PURE__*/ _jsxSorted(DevtoolsContent, null, { state }, null, 3, "jJ_1"), 1, null)], 1, null), 1, "jJ_2");
 }, "QwikDevtoolsExtension_component_EdZTDUSLNrE"));
 export { QwikDevtoolsExtension };

package/dist/ui/packages/devtools/ui/src/devtools/command-palette.qwik.mjs

@@ -1,14 +1,16 @@
 import { devtoolsTabs } from "./tabs.qwik.mjs";
 var RECENTS_STORAGE_KEY = "qwik-devtools:palette-recents";
 var MAX_RECENTS = 5;
-/** Categories always render in this order. */ var CATEGORY_ORDER = [
+/** Categories always render in this order. */
+var CATEGORY_ORDER = [
 	"Tabs",
 	"Components",
 	"Routes",
 	"Packages",
 	"Actions"
 ];
-/** Tabs reachable in the current context (Vite-only tabs are hidden in the extension). */ function getTabResults(state) {
+/** Tabs reachable in the current context (Vite-only tabs are hidden in the extension). */
+function getTabResults(state) {
 	return devtoolsTabs.filter((tab) => !(state.isExtension && tab.viteOnly)).map((tab) => ({
 		id: `tab:${tab.id}`,
 		category: "Tabs",
@@ -31,7 +33,8 @@ function getComponentResults(state) {
 		}
 	}));
 }
-/** Routes live behind the Vite-only Routes tab, so they are excluded in the extension. */ function getRouteResults(state) {
+/** Routes live behind the Vite-only Routes tab, so they are excluded in the extension. */
+function getRouteResults(state) {
 	if (state.isExtension || !state.routes) return [];
 	return state.routes.map((route) => ({
 		id: `route:${route.relativePath}`,
@@ -44,7 +47,8 @@ function getComponentResults(state) {
 		}
 	}));
 }
-/** Packages live behind the Vite-only Packages tab, so they are excluded in the extension. */ function getPackageResults(state) {
+/** Packages live behind the Vite-only Packages tab, so they are excluded in the extension. */
+function getPackageResults(state) {
 	if (state.isExtension) return [];
 	return state.npmPackages.map(([name, version]) => ({
 		id: `package:${name}`,
@@ -57,7 +61,8 @@ function getComponentResults(state) {
 		}
 	}));
 }
-/** Common quick actions available in the current context. */ function getActionResults(state) {
+/** Common quick actions available in the current context. */
+function getActionResults(state) {
 	const actions = [
 		{
 			id: "action:toggleTheme",
@@ -98,7 +103,8 @@ function getComponentResults(state) {
 	});
 	return actions;
 }
-/** Every searchable result for the current context (tabs, components, routes, packages). */ function buildPaletteSources(state) {
+/** Every searchable result for the current context (tabs, components, routes, packages). */
+function buildPaletteSources(state) {
 	return [
 		...getTabResults(state),
 		...getComponentResults(state),
@@ -106,12 +112,14 @@ function getComponentResults(state) {
 		...getPackageResults(state)
 	];
 }
-/** Filters results by a substring match against label and hint; an empty query returns nothing. */ function filterResults(results, query) {
+/** Filters results by a substring match against label and hint; an empty query returns nothing. */
+function filterResults(results, query) {
 	const normalized = query.trim().toLowerCase();
 	if (!normalized) return [];
 	return results.filter((result) => result.label.toLowerCase().includes(normalized) || (result.hint?.toLowerCase().includes(normalized) ?? false));
 }
-/** Groups results by category, preserving the fixed category order and dropping empty groups. */ function groupResults(results) {
+/** Groups results by category, preserving the fixed category order and dropping empty groups. */
+function groupResults(results) {
 	const groups = [];
 	for (const category of CATEGORY_ORDER) {
 		const inCategory = results.filter((result) => result.category === category);
@@ -122,7 +130,8 @@ function getComponentResults(state) {
 	}
 	return groups;
 }
-/** Reads the persisted recent-selection ids, newest first; empty when nothing valid is stored. */ function loadRecentIds() {
+/** Reads the persisted recent-selection ids, newest first; empty when nothing valid is stored. */
+function loadRecentIds() {
 	try {
 		const raw = localStorage.getItem(RECENTS_STORAGE_KEY);
 		if (!raw) return [];
@@ -133,18 +142,21 @@ function getComponentResults(state) {
 		return [];
 	}
 }
-/** Persists the recent-selection ids. Storage failures (private mode, quota) are ignored. */ function saveRecentIds(ids) {
+/** Persists the recent-selection ids. Storage failures (private mode, quota) are ignored. */
+function saveRecentIds(ids) {
 	try {
 		localStorage.setItem(RECENTS_STORAGE_KEY, JSON.stringify(ids));
 	} catch {}
 }
-/** Returns a new list with `id` moved to the front, de-duped and capped at MAX_RECENTS. */ function addRecentId(recentIds, id) {
+/** Returns a new list with `id` moved to the front, de-duped and capped at MAX_RECENTS. */
+function addRecentId(recentIds, id) {
 	return [id, ...recentIds.filter((existing) => existing !== id)].slice(0, MAX_RECENTS);
 }
 /**
 * Resolves persisted recent ids to their current results, dropping entries that no longer exist
 * (e.g. a component that unmounted or a package that was removed). Actions are resolvable too.
-*/ function resolveRecents(recentIds, state) {
+*/
+function resolveRecents(recentIds, state) {
 	const byId = /* @__PURE__ */ new Map();
 	for (const result of [...buildPaletteSources(state), ...getActionResults(state)]) byId.set(result.id, result);
 	const resolved = [];

package/dist/ui/packages/devtools/ui/src/devtools/page-data-source.qwik.mjs

@@ -3,7 +3,8 @@ import { QWIK_DEVTOOLS_GLOBAL, createInPageBridge, getQwikDevtoolsGlobal } from
 /**
 * Default implementation that reads directly from `window` globals. Used when the devtools UI runs
 * as an in-app overlay (same document).
-*/ var InPageDataSource = class {
+*/
+var InPageDataSource = class {
 	constructor() {
 		this.bridge = createInPageBridge({ isBrowser });
 	}
@@ -52,7 +53,8 @@ var defaultSource = new InPageDataSource();
 *
 * When the Qwik DevTools root has a `pageDataSource` (by the browser extension entry point), that
 * source is used. Otherwise the default in-page source is returned.
-*/ function getPageDataSource() {
+*/
+function getPageDataSource() {
 	const source = isBrowser ? getQwikDevtoolsGlobal(window)?.[QWIK_DEVTOOLS_GLOBAL.props.pageDataSource] : void 0;
 	if (source) return source;
 	return defaultSource;

package/dist/ui/packages/devtools/ui/src/devtools/rpc.qwik.mjs

@@ -1,6 +1,6 @@
 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 { tryCreateHotContext } from "../../../../../node_modules/.pnpm/vite-hot-client@2.1.0_vite@8.2.1_@types_node@24.10.0_esbuild@0.28.2_jiti@2.6.1_terser@5.46.0_tsx@4.21.0_yaml@2.8.3_/node_modules/vite-hot-client/dist/index.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 { tryCreateHotContext } from "../../../../../node_modules/.pnpm/vite-hot-client@2.2.0_vite@8.2.1_@types_node@25.6.0_esbuild@0.28.2_jiti@2.7.0_terser@5.46.0_tsx@4.21.0_yaml@2.9.0_/node_modules/vite-hot-client/dist/index.qwik.mjs";
 import { noSerialize } from "@qwik.dev/core";
 import { QWIK_DEVTOOLS_GLOBAL, RouteType, createClientRpc, getQwikDevtoolsGlobal, getViteClientRpc, setViteClientContext } from "@qwik.dev/devtools/kit";
 var log = (0, (/* @__PURE__ */ __toESM(require_browser(), 1)).default)("qwik:devtools:devtools");
@@ -33,7 +33,8 @@ function getDevtoolsRpc() {
 /**
 * Default data provider that loads data via Vite HMR RPC. Used when the devtools UI runs as an
 * in-app overlay.
-*/ var viteDataProvider = { async loadData(state) {
+*/
+var viteDataProvider = { async loadData(state) {
 	const rpc = await getDevtoolsRpc();
 	const primaryDataPromise = Promise.allSettled([
 		rpc.getAssetsFromPublicDir(),
@@ -65,7 +66,8 @@ function getDevtoolsRpc() {
 *
 * When the Qwik DevTools root has a `dataProvider` (e.g. from the browser extension entry point),
 * that provider is used. Otherwise, falls back to the default Vite HMR RPC provider.
-*/ async function loadDevtoolsData(state) {
+*/
+async function loadDevtoolsData(state) {
 	await (getQwikDevtoolsGlobal(window)?.[QWIK_DEVTOOLS_GLOBAL.props.dataProvider] ?? viteDataProvider).loadData(state);
 }
 export { getDevtoolsRpc, loadDevtoolsData };

package/dist/ui/packages/devtools/ui/src/devtools/sidebar-tabs.qwik.mjs

@@ -1,18 +1,26 @@
 import { devtoolsTabs } from "./tabs.qwik.mjs";
 var STORAGE_KEY = "qwik-devtools:visible-tabs";
-/** Tab configs keyed by id, for resolving an ordered id list. */ var tabsById = new Map(devtoolsTabs.map((tab) => [tab.id, tab]));
+/** Tab configs keyed by id, for resolving an ordered id list. */
+var tabsById = new Map(devtoolsTabs.map((tab) => [tab.id, tab]));
 var KNOWN_TAB_IDS = new Set(devtoolsTabs.map((tab) => tab.id));
 function isDevtoolsTabId(id) {
 	return KNOWN_TAB_IDS.has(id);
 }
-/** Default sidebar configuration: every tab visible, in registry order. */ function getDefaultVisibleTabIds() {
+/** Default sidebar configuration: every tab visible, in registry order. */
+function getDefaultVisibleTabIds() {
 	return devtoolsTabs.map((tab) => tab.id);
 }
-/** Tabs not currently visible (reachable via the More panel), in registry order. */ function getAvailableTabIds(visibleTabIds) {
+/** Tabs not currently visible (reachable via the More panel), in registry order. */
+function getAvailableTabIds(visibleTabIds) {
 	const visible = new Set(visibleTabIds);
 	return devtoolsTabs.map((tab) => tab.id).filter((id) => !visible.has(id));
 }
-/** Moves `draggedId` to sit just before `targetId` in the list, returning a new list. */ function reorderVisibleTabs(visibleTabIds, draggedId, targetId) {
+/** Hidden tabs resolved to their configs (the More panel contents), in registry order. */
+function getAvailableTabs(visibleTabIds) {
+	return resolveTabs(getAvailableTabIds(visibleTabIds));
+}
+/** Moves `draggedId` to sit just before `targetId` in the list, returning a new list. */
+function reorderVisibleTabs(visibleTabIds, draggedId, targetId) {
 	if (draggedId === targetId) return visibleTabIds;
 	const without = visibleTabIds.filter((id) => id !== draggedId);
 	const targetIndex = without.indexOf(targetId);
@@ -20,11 +28,13 @@ function isDevtoolsTabId(id) {
 	without.splice(targetIndex, 0, draggedId);
 	return without;
 }
-/** Adds (appends) or removes a tab from the ordered visible list, returning a new list. */ function setTabVisible(visibleTabIds, id, visible) {
+/** Adds (appends) or removes a tab from the ordered visible list, returning a new list. */
+function setTabVisible(visibleTabIds, id, visible) {
 	if (visible) return visibleTabIds.includes(id) ? visibleTabIds : [...visibleTabIds, id];
 	return visibleTabIds.filter((tabId) => tabId !== id);
 }
-/** Drops ids no longer in the registry and de-dupes, preserving the stored order. */ function normalizeVisibleTabIds(ids) {
+/** Drops ids no longer in the registry and de-dupes, preserving the stored order. */
+function normalizeVisibleTabIds(ids) {
 	const seen = /* @__PURE__ */ new Set();
 	const result = [];
 	for (const id of ids) if (isDevtoolsTabId(id) && !seen.has(id)) {
@@ -37,7 +47,8 @@ function isDevtoolsTabId(id) {
 * Reads the persisted visible-tabs list, or null when nothing valid is stored so the caller falls
 * back to the default. An empty list is honored (the user hid every tab). Tabs added to the
 * registry since the last save stay hidden (reachable via the More panel) until opted in.
-*/ function loadVisibleTabIds() {
+*/
+function loadVisibleTabIds() {
 	try {
 		const raw = localStorage.getItem(STORAGE_KEY);
 		if (!raw) return null;
@@ -48,12 +59,14 @@ function isDevtoolsTabId(id) {
 		return null;
 	}
 }
-/** Persists the visible-tabs list. Storage failures (private mode, quota) are ignored. */ function saveVisibleTabIds(visibleTabIds) {
+/** Persists the visible-tabs list. Storage failures (private mode, quota) are ignored. */
+function saveVisibleTabIds(visibleTabIds) {
 	try {
 		localStorage.setItem(STORAGE_KEY, JSON.stringify(visibleTabIds));
 	} catch {}
 }
-/** Resolves an ordered id list to its tab configs, dropping unknown ids. */ function resolveTabs(ids) {
+/** Resolves an ordered id list to its tab configs, dropping unknown ids. */
+function resolveTabs(ids) {
 	const tabs = [];
 	for (const id of ids) {
 		const tab = tabsById.get(id);
@@ -61,13 +74,11 @@ function isDevtoolsTabId(id) {
 	}
 	return tabs;
 }
-/** Hidden tabs resolved to their configs (the More panel contents), in registry order. */ function getAvailableTabs(visibleTabIds) {
-	return resolveTabs(getAvailableTabIds(visibleTabIds));
-}
 /**
 * Resolves the ordered visible ids to their tab configs, dropping, in the extension, tabs that
 * require the Vite plugin.
-*/ function getVisibleTabs(visibleTabIds, isExtension) {
+*/
+function getVisibleTabs(visibleTabIds, isExtension) {
 	return resolveTabs(visibleTabIds).filter((tab) => !(isExtension && tab.viteOnly));
 }
 export { getAvailableTabIds, getAvailableTabs, getDefaultVisibleTabIds, getVisibleTabs, loadVisibleTabIds, reorderVisibleTabs, resolveTabs, saveVisibleTabIds, setTabVisible };

package/dist/ui/packages/devtools/ui/src/devtools/tabs.qwik.mjs

@@ -4,56 +4,56 @@ var devtoolsTabs = [
 	{
 		id: "overview",
 		title: "Overview",
-		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconBoltOutline, null, { class: "h-6 w-6" }, null, 3, "0V_0")
+		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconBoltOutline, null, { class: "h-6 w-6" }, null, 3, "NS_0")
 	},
 	{
 		id: "packages",
 		title: "Packages",
-		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconCubeOutline, null, { class: "h-6 w-6" }, null, 3, "0V_1"),
+		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconCubeOutline, null, { class: "h-6 w-6" }, null, 3, "NS_1"),
 		viteOnly: true
 	},
 	{
 		id: "renderTree",
 		title: "Render Tree",
-		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconDiagram3, null, { class: "h-6 w-6" }, null, 3, "0V_2")
+		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconDiagram3, null, { class: "h-6 w-6" }, null, 3, "NS_2")
 	},
 	{
 		id: "routes",
 		title: "Routes",
-		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconFolderTree, null, { class: "h-6 w-6" }, null, 3, "0V_3"),
+		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconFolderTree, null, { class: "h-6 w-6" }, null, 3, "NS_3"),
 		viteOnly: true
 	},
 	{
 		id: "assets",
 		title: "Assets",
-		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconPhotoOutline, null, { class: "h-6 w-6" }, null, 3, "0V_4"),
+		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconPhotoOutline, null, { class: "h-6 w-6" }, null, 3, "NS_4"),
 		viteOnly: true
 	},
 	{
 		id: "inspect",
 		title: "Inspect",
-		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconMegaphoneMini, null, { class: "h-6 w-6" }, null, 3, "0V_5"),
+		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconMegaphoneMini, null, { class: "h-6 w-6" }, null, 3, "NS_5"),
 		viteOnly: true
 	},
 	{
 		id: "codeBreak",
 		title: "Code Break",
-		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconCodeBracketSolid, null, { class: "h-6 w-6" }, null, 3, "0V_6")
+		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconCodeBracketSolid, null, { class: "h-6 w-6" }, null, 3, "NS_6")
 	},
 	{
 		id: "performance",
 		title: "Performance",
-		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconClockOutline, null, { class: "h-6 w-6" }, null, 3, "0V_7")
+		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconClockOutline, null, { class: "h-6 w-6" }, null, 3, "NS_7")
 	},
 	{
 		id: "preloads",
 		title: "Preloads",
-		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconArrowDownTray, null, { class: "h-6 w-6" }, null, 3, "0V_8")
+		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconArrowDownTray, null, { class: "h-6 w-6" }, null, 3, "NS_8")
 	},
 	{
 		id: "buildAnalysis",
 		title: "Build Analysis",
-		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconChartBarOutline, null, { class: "h-6 w-6" }, null, 3, "0V_9"),
+		renderIcon: () => /*#__PURE__*/ _jsxSorted(IconChartBarOutline, null, { class: "h-6 w-6" }, null, 3, "NS_9"),
 		viteOnly: true
 	}
 ];

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

@@ -10,7 +10,7 @@ var Assets = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps) =>
 			width: 176,
 			height: 176,
 			class: "h-full w-full object-cover"
-		}, null, 3, null), 1, "LV_0") : /*#__PURE__*/ _jsxSorted("div", null, { class: "bg-foreground/5 flex aspect-square items-center justify-center" }, /*#__PURE__*/ _jsxSorted("span", null, { class: "text-muted-foreground font-mono text-2xl" }, fileExt, 1, null), 1, "LV_1"), /*#__PURE__*/ _jsxSorted("div", null, { class: "space-y-2 p-4" }, [/*#__PURE__*/ _jsxSorted("div", { title: _wrapProp(asset, "path") }, { class: "truncate text-sm" }, asset.path.split("/").pop(), 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground flex items-center justify-between text-xs" }, [/*#__PURE__*/ _jsxSorted("span", null, null, [(asset.size / 1024).toFixed(2), " KB"], 1, null), /*#__PURE__*/ _jsxSorted("span", null, { class: "bg-foreground/5 rounded-full px-2 py-1" }, fileExt, 1, null)], 1, null)], 1, null)], 1, asset.filePath);
-	}), 1, "LV_2");
+		}, null, 3, null), 1, "El_0") : /*#__PURE__*/ _jsxSorted("div", null, { class: "bg-foreground/5 flex aspect-square items-center justify-center" }, /*#__PURE__*/ _jsxSorted("span", null, { class: "text-muted-foreground font-mono text-2xl" }, fileExt, 1, null), 1, "El_1"), /*#__PURE__*/ _jsxSorted("div", null, { class: "space-y-2 p-4" }, [/*#__PURE__*/ _jsxSorted("div", { title: _wrapProp(asset, "path") }, { class: "truncate text-sm" }, asset.path.split("/").pop(), 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground flex items-center justify-between text-xs" }, [/*#__PURE__*/ _jsxSorted("span", null, null, [(asset.size / 1024).toFixed(2), " KB"], 1, null), /*#__PURE__*/ _jsxSorted("span", null, { class: "bg-foreground/5 rounded-full px-2 py-1" }, fileExt, 1, null)], 1, null)], 1, null)], 1, asset.filePath);
+	}), 1, "El_2");
 }, "Assets_component_3McbsijSMd8"));
 export { Assets };

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

@@ -2,7 +2,9 @@ import { getDevtoolsRpc } from "../../devtools/rpc.qwik.mjs";
 import { _captures, _fnSignal, _jsxSorted, _wrapProp, componentQrl, inlinedQrl, isBrowser, useSignal, useVisibleTaskQrl } from "@qwik.dev/core";
 import { Fragment } from "@qwik.dev/core/jsx-runtime";
 var _hf0 = (p0) => p0.value ? "Rebuilding..." : "Rebuild Report";
+var _hf0_str = "p0.value?\"Rebuilding...\":\"Rebuild Report\"";
 var _hf1 = (p0) => p0.value ? "Building..." : "Build Report";
+var _hf1_str = "p0.value?\"Building...\":\"Build Report\"";
 var BUILD_ANALYSIS_VIEW_PATH = "/__qwik_devtools/build-analysis/report";
 function getBuildAnalysisIframeSrc(version, origin) {
 	const baseOrigin = origin ?? (isBrowser ? location.origin : "");
@@ -92,22 +94,22 @@ var BuildAnalysis = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 	return /*#__PURE__*/ _jsxSorted("div", null, { class: "flex h-full min-h-0 flex-col gap-4" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg rounded-2xl border p-5" }, /*#__PURE__*/ _jsxSorted("div", null, { class: "flex flex-col gap-3" }, [
 		/*#__PURE__*/ _jsxSorted("div", null, { class: "text-lg font-semibold" }, "Build Analysis", 3, null),
 		/*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground max-w-3xl text-sm leading-6" }, "This tab embeds the HTML report generated by the visualizer plugin after a build.", 3, null),
-		buildCommand.value ? /*#__PURE__*/ _jsxSorted("code", null, { class: "text-muted-foreground bg-foreground/5 rounded-lg px-3 py-2 text-xs" }, _wrapProp(buildCommand), 3, "iP_0") : null,
-		buildTriggerHint.value ? /*#__PURE__*/ _jsxSorted("div", null, { class: "rounded-xl border border-amber-500/20 bg-amber-500/10 px-3 py-2 text-sm text-amber-200" }, _wrapProp(buildTriggerHint), 3, "iP_1") : null,
-		errorMessage.value ? /*#__PURE__*/ _jsxSorted("div", null, { class: "rounded-xl border border-red-500/20 bg-red-500/10 px-3 py-2 text-sm text-red-300" }, _wrapProp(errorMessage), 3, "iP_2") : null
-	], 1, null), 1, null), isChecking.value ? /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg text-muted-foreground rounded-2xl border p-6 text-sm" }, "Checking build analysis report...", 3, "iP_3") : hasReport.value ? /*#__PURE__*/ _jsxSorted(Fragment, null, null, [/*#__PURE__*/ _jsxSorted("div", null, { class: "flex items-center justify-end gap-3" }, [buildCommand.value && canTriggerBuild.value ? /*#__PURE__*/ _jsxSorted("button", null, {
+		buildCommand.value ? /*#__PURE__*/ _jsxSorted("code", null, { class: "text-muted-foreground bg-foreground/5 rounded-lg px-3 py-2 text-xs" }, _wrapProp(buildCommand), 3, "td_0") : null,
+		buildTriggerHint.value ? /*#__PURE__*/ _jsxSorted("div", null, { class: "rounded-xl border border-amber-500/20 bg-amber-500/10 px-3 py-2 text-sm text-amber-200" }, _wrapProp(buildTriggerHint), 3, "td_1") : null,
+		errorMessage.value ? /*#__PURE__*/ _jsxSorted("div", null, { class: "rounded-xl border border-red-500/20 bg-red-500/10 px-3 py-2 text-sm text-red-300" }, _wrapProp(errorMessage), 3, "td_2") : null
+	], 1, null), 1, null), isChecking.value ? /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg text-muted-foreground rounded-2xl border p-6 text-sm" }, "Checking build analysis report...", 3, "td_3") : hasReport.value ? /*#__PURE__*/ _jsxSorted(Fragment, null, null, [/*#__PURE__*/ _jsxSorted("div", null, { class: "flex items-center justify-end gap-3" }, [buildCommand.value && canTriggerBuild.value ? /*#__PURE__*/ _jsxSorted("button", null, {
 		type: "button",
 		"q-e:click": buildReport,
 		disabled: _wrapProp(isBuilding),
 		class: "border-border bg-foreground/5 hover:bg-foreground/10 rounded-xl border px-4 py-2 text-sm transition-colors disabled:cursor-not-allowed disabled:opacity-50"
-	}, _fnSignal(_hf0, [isBuilding]), 3, "iP_4") : null, /*#__PURE__*/ _jsxSorted("button", null, {
+	}, _fnSignal(_hf0, [isBuilding], _hf0_str), 3, "td_4") : null, /*#__PURE__*/ _jsxSorted("button", null, {
 		type: "button",
 		"q-e:click": refreshFrame,
 		class: "border-border bg-foreground/5 hover:bg-foreground/10 rounded-xl border px-4 py-2 text-sm transition-colors"
 	}, "Reload Report", 3, null)], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg min-h-0 flex-1 overflow-hidden rounded-2xl border" }, /*#__PURE__*/ _jsxSorted("iframe", { src: getBuildAnalysisIframeSrc(iframeVersion.value) }, {
 		title: "Build Analysis Report",
 		class: "h-full min-h-[680px] w-full border-0 bg-white"
-	}, null, 3, getBuildAnalysisIframeSrc(iframeVersion.value)), 1, null)], 1, "iP_5") : /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg rounded-2xl border p-6" }, /*#__PURE__*/ _jsxSorted("div", null, { class: "flex max-w-3xl flex-col gap-4" }, [
+	}, null, 3, getBuildAnalysisIframeSrc(iframeVersion.value)), 1, null)], 1, "td_5") : /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg rounded-2xl border p-6" }, /*#__PURE__*/ _jsxSorted("div", null, { class: "flex max-w-3xl flex-col gap-4" }, [
 		/*#__PURE__*/ _jsxSorted("div", null, { class: "text-base font-semibold" }, "No build analysis report yet", 3, null),
 		/*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground text-sm leading-6" }, canTriggerBuild.value ? "The visualizer HTML file does not exist yet. You need to build the current project first, and DevTools will ask for your confirmation before running that build." : "The visualizer HTML file does not exist yet. Run the build command locally to generate it, or reconnect from localhost if you want DevTools to trigger it for you.", 1, null),
 		/*#__PURE__*/ _jsxSorted("code", null, { class: "text-muted-foreground bg-foreground/5 rounded-lg px-3 py-2 text-xs" }, _wrapProp(reportPath), 3, null),
@@ -116,7 +118,7 @@ var BuildAnalysis = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 			"q-e:click": buildReport,
 			disabled: _wrapProp(isBuilding),
 			class: "border-border bg-foreground/5 hover:bg-foreground/10 rounded-xl border px-4 py-2 text-sm transition-colors disabled:cursor-not-allowed disabled:opacity-50"
-		}, _fnSignal(_hf1, [isBuilding]), 3, "iP_6") : null, 1, null)
-	], 1, null), 1, "iP_7")], 1, "iP_8");
+		}, _fnSignal(_hf1, [isBuilding], _hf1_str), 3, "td_6") : null, 1, null)
+	], 1, null), 1, "td_7")], 1, "td_8");
 }, "BuildAnalysis_component_wViM53DMgX4"));
 export { BuildAnalysis, getBuildAnalysisIframeSrc };

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

@@ -1,6 +1,6 @@
 import { StateParser } from "./StateParser.qwik.mjs";
 import { HtmlParser } from "./HtmlParser.qwik.mjs";
-import { _jsxSorted, componentQrl, inlinedQrl, useSignal, useStylesQrl } from "@qwik.dev/core";
+import { _captures, _jsxSorted, componentQrl, inlinedQrl, useSignal, useStylesQrl } from "@qwik.dev/core";
 var CodeBreak = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 	useStylesQrl(/*#__PURE__*/ inlinedQrl(`
   .code-output-container {
@@ -18,25 +18,23 @@ var CodeBreak = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
   `, "CodeBreak_component_useStyles_lHrOlzOysW0"));
 	const currentTab = useSignal("state");
 	return /*#__PURE__*/ _jsxSorted("div", null, { class: "h-full space-y-6 overflow-hidden" }, [
-		/*#__PURE__*/ _jsxSorted("div", null, { class: "flex justify-center" }, /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg inline-flex rounded-xl border p-0.5" }, [/*#__PURE__*/ _jsxSorted("button", {
-			class: {
-				"rounded-lg px-3 py-2 text-sm font-medium transition-colors md:px-4": true,
-				"bg-accent text-white shadow": currentTab.value === "state",
-				"text-muted-foreground hover:bg-foreground/5": currentTab.value !== "state"
-			},
-			"q-e:click": /*#__PURE__*/ inlinedQrl((_, _1, currentTab) => currentTab.value = "state", "CodeBreak_component_div_div_div_button_q_e_click_xWgXsjQPkqw").m(),
-			"q:p": currentTab
-		}, null, "State Parser", 6, null), /*#__PURE__*/ _jsxSorted("button", {
-			class: {
-				"rounded-lg px-3 py-2 text-sm font-medium transition-colors md:px-4": true,
-				"bg-accent text-white shadow": currentTab.value === "html",
-				"text-muted-foreground hover:bg-foreground/5": currentTab.value !== "html"
-			},
-			"q-e:click": /*#__PURE__*/ inlinedQrl((_, _1, currentTab) => currentTab.value = "html", "CodeBreak_component_div_div_div_button_q_e_click_1_LC2WyereJ0c").m(),
-			"q:p": currentTab
-		}, null, "HTML Parser", 6, null)], 1, null), 1, null),
-		currentTab.value === "state" && /*#__PURE__*/ _jsxSorted(StateParser, null, null, null, 3, "on_0"),
-		currentTab.value === "html" && /*#__PURE__*/ _jsxSorted(HtmlParser, null, null, null, 3, "on_1")
-	], 1, "on_2");
+		/*#__PURE__*/ _jsxSorted("div", null, { class: "flex justify-center" }, /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg inline-flex rounded-xl border p-0.5" }, [/*#__PURE__*/ _jsxSorted("button", { class: {
+			"rounded-lg px-3 py-2 text-sm font-medium transition-colors md:px-4": true,
+			"bg-accent text-white shadow": currentTab.value === "state",
+			"text-muted-foreground hover:bg-foreground/5": currentTab.value !== "state"
+		} }, { "q-e:click": /*#__PURE__*/ inlinedQrl(() => {
+			const currentTab = _captures[0];
+			return currentTab.value = "state";
+		}, "CodeBreak_component_div_div_div_button_q_e_click_xWgXsjQPkqw", [currentTab]) }, "State Parser", 3, null), /*#__PURE__*/ _jsxSorted("button", { class: {
+			"rounded-lg px-3 py-2 text-sm font-medium transition-colors md:px-4": true,
+			"bg-accent text-white shadow": currentTab.value === "html",
+			"text-muted-foreground hover:bg-foreground/5": currentTab.value !== "html"
+		} }, { "q-e:click": /*#__PURE__*/ inlinedQrl(() => {
+			const currentTab = _captures[0];
+			return currentTab.value = "html";
+		}, "CodeBreak_component_div_div_div_button_q_e_click_1_LC2WyereJ0c", [currentTab]) }, "HTML Parser", 3, null)], 1, null), 1, null),
+		currentTab.value === "state" && /*#__PURE__*/ _jsxSorted(StateParser, null, null, null, 3, "Qk_0"),
+		currentTab.value === "html" && /*#__PURE__*/ _jsxSorted(HtmlParser, null, null, null, 3, "Qk_1")
+	], 1, "Qk_2");
 }, "CodeBreak_component_TGxTKTmWfNE"));
 export { CodeBreak };

package/dist/ui/packages/devtools/ui/src/features/CodeBreak/HtmlParser.qwik.mjs

@@ -2,6 +2,7 @@ import { getHighlighter } from "../../utils/shiki.qwik.mjs";
 import { _captures, _fnSignal, _jsxSorted, _wrapProp, componentQrl, inlinedQrl, useSignal, useStylesQrl, useVisibleTaskQrl } from "@qwik.dev/core";
 import { _getDomContainer, _vnode_toString } from "@qwik.dev/core/internal";
 var _hf0 = (p0) => p0.value || "";
+var _hf0_str = "p0.value||\"\"";
 var HtmlParser = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 	useStylesQrl(/*#__PURE__*/ inlinedQrl(`
     pre.shiki { overflow: auto; padding: 10px; height: 100%; }
@@ -68,19 +69,20 @@ var HtmlParser = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 		htmlResult,
 		shikiRef
 	]));
-	return /*#__PURE__*/ _jsxSorted("div", null, { class: "grid grid-cols-1 gap-4 md:grid-cols-2" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col rounded-xl border" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex items-center justify-between border-b p-3" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "text-sm font-medium" }, "Input HTML", 3, null), parsingTime.value !== null && /*#__PURE__*/ _jsxSorted("span", null, { class: "border-glass-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs" }, [_wrapProp(parsingTime), "ms"], 3, "la_0")], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "min-h-0 flex-1 flex-col space-y-3 p-3" }, [/*#__PURE__*/ _jsxSorted("textarea", {
-		"q-e:input": /*#__PURE__*/ inlinedQrl((e, t, inputHtml) => inputHtml.value = t.value, "HtmlParser_component_div_div_div_textarea_q_e_input_XIyjbAjuy8w").m(),
-		"q:p": inputHtml
-	}, {
+	return /*#__PURE__*/ _jsxSorted("div", null, { class: "grid grid-cols-1 gap-4 md:grid-cols-2" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col rounded-xl border" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex items-center justify-between border-b p-3" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "text-sm font-medium" }, "Input HTML", 3, null), parsingTime.value !== null && /*#__PURE__*/ _jsxSorted("span", null, { class: "border-glass-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs" }, [_wrapProp(parsingTime), "ms"], 3, "nu_0")], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "min-h-0 flex-1 flex-col space-y-3 p-3" }, [/*#__PURE__*/ _jsxSorted("textarea", null, {
 		value: _wrapProp(inputHtml),
+		"q-e:input": /*#__PURE__*/ inlinedQrl((e, t) => {
+			const inputHtml = _captures[0];
+			return inputHtml.value = t.value;
+		}, "HtmlParser_component_div_div_div_textarea_q_e_input_XIyjbAjuy8w", [inputHtml]),
 		placeholder: "Paste HTML and click to parse/format.",
 		class: "border-glass-border bg-card-item-bg text-foreground placeholder:text-muted-foreground h-full min-h-0 w-full flex-1 resize-none rounded-md border p-3 font-mono text-sm"
-	}, null, 6, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "flex items-center gap-3" }, /*#__PURE__*/ _jsxSorted("button", null, {
+	}, null, 3, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "flex items-center gap-3" }, /*#__PURE__*/ _jsxSorted("button", null, {
 		"q-e:click": onParseHtml$,
 		class: "bg-accent rounded-md px-3 py-1.5 text-sm text-white hover:opacity-90"
-	}, "Parse HTML", 3, null), 3, null)], 1, null)], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col overflow-hidden rounded-xl border" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex items-center justify-between border-b p-3" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "text-sm font-medium" }, "VNode Tree", 3, null), parsingTime.value !== null && /*#__PURE__*/ _jsxSorted("span", null, { class: "border-glass-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs" }, [_wrapProp(parsingTime), "ms"], 3, "la_1")], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "h-full min-h-0 flex-1" }, /*#__PURE__*/ _jsxSorted("pre", null, {
+	}, "Parse HTML", 3, null), 3, null)], 3, null)], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col overflow-hidden rounded-xl border" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex items-center justify-between border-b p-3" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "text-sm font-medium" }, "VNode Tree", 3, null), parsingTime.value !== null && /*#__PURE__*/ _jsxSorted("span", null, { class: "border-glass-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs" }, [_wrapProp(parsingTime), "ms"], 3, "nu_1")], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "h-full min-h-0 flex-1" }, /*#__PURE__*/ _jsxSorted("pre", null, {
 		class: "h-full overflow-auto",
-		dangerouslySetInnerHTML: _fnSignal(_hf0, [highlightedHtml])
-	}, null, 3, null), 3, null)], 1, null)], 1, "la_2");
+		dangerouslySetInnerHTML: _fnSignal(_hf0, [highlightedHtml], _hf0_str)
+	}, null, 3, null), 3, null)], 1, null)], 1, "nu_2");
 }, "HtmlParser_component_9YnEezFEUMA"));
 export { HtmlParser };

package/dist/ui/packages/devtools/ui/src/features/CodeBreak/StateParser.qwik.mjs

@@ -2,6 +2,7 @@ import { getHighlighter } from "../../utils/shiki.qwik.mjs";
 import { _captures, _fnSignal, _jsxSorted, _wrapProp, componentQrl, inlinedQrl, useSignal, useStylesQrl, useVisibleTaskQrl } from "@qwik.dev/core";
 import { _dumpState, _preprocessState } from "@qwik.dev/core/internal";
 var _hf0 = (p0) => p0.value || "";
+var _hf0_str = "p0.value||\"\"";
 var StateParser = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 	useStylesQrl(/*#__PURE__*/ inlinedQrl(`
     pre.shiki { overflow: auto; padding: 10px;  height: 100%; }
@@ -94,19 +95,20 @@ var StateParser = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl(() => {
 		shikiRef,
 		stateResult
 	]));
-	return /*#__PURE__*/ _jsxSorted("div", null, { class: "grid grid-cols-1 gap-4 md:grid-cols-2" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col rounded-xl border" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex items-center justify-between gap-3 border-b p-3" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "flex items-center gap-3" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "text-sm font-medium" }, "Input State", 3, null), parsingTime.value !== null && /*#__PURE__*/ _jsxSorted("span", null, { class: "border-glass-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs" }, [_wrapProp(parsingTime), "ms"], 3, "O4_0")], 1, null), /*#__PURE__*/ _jsxSorted("button", null, {
+	return /*#__PURE__*/ _jsxSorted("div", null, { class: "grid grid-cols-1 gap-4 md:grid-cols-2" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col rounded-xl border" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex items-center justify-between gap-3 border-b p-3" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "flex items-center gap-3" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "text-sm font-medium" }, "Input State", 3, null), parsingTime.value !== null && /*#__PURE__*/ _jsxSorted("span", null, { class: "border-glass-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs" }, [_wrapProp(parsingTime), "ms"], 3, "97_0")], 1, null), /*#__PURE__*/ _jsxSorted("button", null, {
 		"q-e:click": onParseState$,
 		class: "bg-accent rounded-md px-3 py-1.5 text-sm text-white hover:opacity-90"
-	}, "Parse State", 3, null)], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "flex min-h-0 flex-1 flex-col p-3" }, /*#__PURE__*/ _jsxSorted("textarea", {
-		"q-e:input": /*#__PURE__*/ inlinedQrl((e, t, inputState) => inputState.value = t.value, "StateParser_component_div_div_div_textarea_q_e_input_kcp2t0mamTI").m(),
-		"q:p": inputState
-	}, {
+	}, "Parse State", 3, null)], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "flex min-h-0 flex-1 flex-col p-3" }, /*#__PURE__*/ _jsxSorted("textarea", null, {
 		value: _wrapProp(inputState),
+		"q-e:input": /*#__PURE__*/ inlinedQrl((e, t) => {
+			const inputState = _captures[0];
+			return inputState.value = t.value;
+		}, "StateParser_component_div_div_div_textarea_q_e_input_kcp2t0mamTI", [inputState]),
 		placeholder: "Paste Qwik state and click to parse/format.",
 		class: "border-glass-border bg-card-item-bg text-foreground placeholder:text-muted-foreground min-h-0 w-full flex-1 resize-none rounded-md border p-3 font-mono text-sm"
-	}, null, 6, null), 1, null)], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col overflow-hidden rounded-xl border" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex items-center justify-between border-b p-3" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "text-sm font-medium" }, "Parsed State", 3, null), parsingTime.value !== null && /*#__PURE__*/ _jsxSorted("span", null, { class: "border-glass-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs" }, [_wrapProp(parsingTime), "ms"], 3, "O4_1")], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "h-full min-h-0 flex-1" }, /*#__PURE__*/ _jsxSorted("pre", null, {
+	}, null, 3, null), 3, null)], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col overflow-hidden rounded-xl border" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "border-glass-border flex items-center justify-between border-b p-3" }, [/*#__PURE__*/ _jsxSorted("div", null, { class: "text-sm font-medium" }, "Parsed State", 3, null), parsingTime.value !== null && /*#__PURE__*/ _jsxSorted("span", null, { class: "border-glass-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs" }, [_wrapProp(parsingTime), "ms"], 3, "97_1")], 1, null), /*#__PURE__*/ _jsxSorted("div", null, { class: "h-full min-h-0 flex-1" }, /*#__PURE__*/ _jsxSorted("pre", null, {
 		class: "h-full overflow-auto",
-		dangerouslySetInnerHTML: _fnSignal(_hf0, [highlightedState])
-	}, null, 3, null), 3, null)], 1, null)], 1, "O4_2");
+		dangerouslySetInnerHTML: _fnSignal(_hf0, [highlightedState], _hf0_str)
+	}, null, 3, null), 3, null)], 1, null)], 1, "97_2");
 }, "StateParser_component_WYGTcR6czK0"));
 export { StateParser };