@qwik.dev/devtools 0.2.5 → 0.2.7

package/dist/ui/features/CodeBreack/CodeBreack.qwik.mjs

@@ -1,9 +1,9 @@
-import { jsxs, jsx } from "@qwik.dev/core/jsx-runtime";
-import { component$, useStyles$, useSignal } from "@qwik.dev/core";
 import { StateParser } from "./StateParser.qwik.mjs";
 import { HtmlParser } from "./HtmlParser.qwik.mjs";
-const CodeBreack = component$(() => {
-  useStyles$(`
+import { _jsxSorted, componentQrl, inlinedQrl, useSignal, useStylesQrl } from "@qwik.dev/core";
+//#region src/features/CodeBreack/CodeBreack.tsx
+var CodeBreack = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl(() => {
+	useStylesQrl(/* @__PURE__ */ inlinedQrl(`
   .code-output-container {
     overflow-x: auto;
     overflow-y: auto;
@@ -16,42 +16,29 @@ const CodeBreack = component$(() => {
     margin: 0;
     min-width: max-content;
   }
-  `);
-  const currentTab = useSignal("state");
-  return /* @__PURE__ */ jsxs("div", {
-    class: "h-full space-y-6 overflow-hidden",
-    children: [
-      /* @__PURE__ */ jsx("div", {
-        class: "flex justify-center",
-        children: /* @__PURE__ */ jsxs("div", {
-          class: "border-border bg-background inline-flex rounded-xl border p-0.5",
-          children: [
-            /* @__PURE__ */ jsx("button", {
-              onClick$: () => currentTab.value = "state",
-              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"
-              },
-              children: "State Parser"
-            }),
-            /* @__PURE__ */ jsx("button", {
-              onClick$: () => currentTab.value = "html",
-              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"
-              },
-              children: "HTML Parser"
-            })
-          ]
-        })
-      }),
-      currentTab.value === "state" && /* @__PURE__ */ jsx(StateParser, {}),
-      currentTab.value === "html" && /* @__PURE__ */ jsx(HtmlParser, {})
-    ]
-  });
-});
-export {
-  CodeBreack
-};
+  `, "CodeBreack_component_useStyles_JLri70kgqEQ"));
+	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", "CodeBreack_component_div_div_div_button_q_e_click_6qSWv3guyJA"),
+			"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", "CodeBreack_component_div_div_div_button_q_e_click_1_qRwht8xTKQw"),
+			"q:p": currentTab
+		}, null, "HTML Parser", 6, null)], 1, null), 1, null),
+		currentTab.value === "state" && /* @__PURE__ */ _jsxSorted(StateParser, null, null, null, 3, "Ck_0"),
+		currentTab.value === "html" && /* @__PURE__ */ _jsxSorted(HtmlParser, null, null, null, 3, "Ck_1")
+	], 1, "Ck_2");
+}, "CodeBreack_component_wtgmi8r4z24"));
+//#endregion
+export { CodeBreack };

package/dist/ui/features/CodeBreack/HtmlParser.qwik.mjs

@@ -1,148 +1,87 @@
-import { jsxs, jsx } from "@qwik.dev/core/jsx-runtime";
-import { component$, useStyles$, useSignal, $, useVisibleTask$ } from "@qwik.dev/core";
-import { _getDomContainer, _vnode_toString } from "@qwik.dev/core/internal";
 import { getHighlighter } from "../../utils/shiki.qwik.mjs";
-const HtmlParser = component$(() => {
-  useStyles$(`
+import { _captures, _fnSignal, _jsxSorted, _wrapProp, componentQrl, inlinedQrl, useSignal, useStylesQrl, useVisibleTaskQrl } from "@qwik.dev/core";
+import { _getDomContainer, _vnode_toString } from "@qwik.dev/core/internal";
+//#region src/features/CodeBreack/HtmlParser.tsx
+var _hf0 = (p0) => p0.value || "";
+var HtmlParser = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl(() => {
+	useStylesQrl(/* @__PURE__ */ inlinedQrl(`
     pre.shiki { overflow: auto; padding: 10px; height: 100%; }
-  `);
-  const inputHtml = useSignal("");
-  const parsingTime = useSignal(null);
-  const htmlResult = useSignal("");
-  const highlightedHtml = useSignal("");
-  const onParseHtml$ = $(() => {
-    if (!inputHtml.value.trim()) {
-      parsingTime.value = null;
-      htmlResult.value = "// Paste HTML on the left to parse";
-      return;
-    }
-    const startTime = performance.now();
-    try {
-      const parser = new DOMParser();
-      const doc = parser.parseFromString(inputHtml.value, "text/html");
-      let output = "";
-      try {
-        const container = _getDomContainer(doc.documentElement);
-        if (container) {
-          output += "// Qwik Container Found:\n";
-          output += `- Container Type: ${container.qContainer}
-`;
-          output += `- Manifest Hash: ${container.qManifestHash}
-
-`;
-          try {
-            const vdomTree = _vnode_toString.call(container.rootVNode, Number.MAX_SAFE_INTEGER, "", true, false, false);
-            output += "// VNode Tree:\n" + vdomTree + "\n\n";
-          } catch (vnodeErr) {
-            output += "// VNode parsing error: " + vnodeErr + "\n\n";
-          }
-        } else {
-          output = "// No Qwik container found in the HTML";
-        }
-      } catch (containerErr) {
-        output = "// No Qwik container found or error: " + containerErr;
-      }
-      parsingTime.value = performance.now() - startTime;
-      htmlResult.value = output;
-      return;
-    } catch (error) {
-      parsingTime.value = performance.now() - startTime;
-      htmlResult.value = `// Error parsing HTML: ${error instanceof Error ? error.message : "Invalid HTML format"}
-
-// Raw input:
-${inputHtml.value}`;
-      return;
-    }
-  });
-  const shikiRef = useSignal(null);
-  useVisibleTask$(async ({ track }) => {
-    track(() => htmlResult.value);
-    if (!htmlResult.value) {
-      highlightedHtml.value = "";
-      return;
-    }
-    if (!shikiRef.value) {
-      shikiRef.value = await getHighlighter();
-    }
-    highlightedHtml.value = shikiRef.value.codeToHtml(htmlResult.value, {
-      lang: "html",
-      theme: "nord"
-    });
-  });
-  return /* @__PURE__ */ jsxs("div", {
-    class: "grid grid-cols-1 gap-4 md:grid-cols-2",
-    children: [
-      /* @__PURE__ */ jsxs("div", {
-        class: "border-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col rounded-xl border",
-        children: [
-          /* @__PURE__ */ jsxs("div", {
-            class: "border-border flex items-center justify-between border-b p-3",
-            children: [
-              /* @__PURE__ */ jsx("div", {
-                class: "text-sm font-medium",
-                children: "Input HTML"
-              }),
-              parsingTime.value !== null && /* @__PURE__ */ jsxs("span", {
-                class: "border-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs",
-                children: [
-                  parsingTime.value,
-                  "ms"
-                ]
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsxs("div", {
-            class: "min-h-0 flex-1 flex-col space-y-3 p-3",
-            children: [
-              /* @__PURE__ */ jsx("textarea", {
-                value: inputHtml.value,
-                onInput$: (e, t) => inputHtml.value = t.value,
-                placeholder: "Paste HTML and click to parse/format.",
-                class: "border-border bg-background h-full min-h-0 w-full flex-1 resize-none rounded-md border p-3 font-mono text-sm"
-              }),
-              /* @__PURE__ */ jsx("div", {
-                class: "flex items-center gap-3",
-                children: /* @__PURE__ */ jsx("button", {
-                  onClick$: onParseHtml$,
-                  class: "bg-accent rounded-md px-3 py-1.5 text-sm text-white hover:opacity-90",
-                  children: "Parse HTML"
-                })
-              })
-            ]
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        class: "border-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col overflow-hidden rounded-xl border",
-        children: [
-          /* @__PURE__ */ jsxs("div", {
-            class: "border-border flex items-center justify-between border-b p-3",
-            children: [
-              /* @__PURE__ */ jsx("div", {
-                class: "text-sm font-medium",
-                children: "VNode Tree"
-              }),
-              parsingTime.value !== null && /* @__PURE__ */ jsxs("span", {
-                class: "border-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs",
-                children: [
-                  parsingTime.value,
-                  "ms"
-                ]
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsx("div", {
-            class: "h-full min-h-0 flex-1",
-            children: /* @__PURE__ */ jsx("pre", {
-              class: "h-full overflow-auto",
-              dangerouslySetInnerHTML: highlightedHtml.value || ""
-            })
-          })
-        ]
-      })
-    ]
-  });
-});
-export {
-  HtmlParser
-};
+  `, "HtmlParser_component_useStyles_3vm0r670gQo"));
+	const inputHtml = useSignal("");
+	const parsingTime = useSignal(null);
+	const htmlResult = useSignal("");
+	const highlightedHtml = useSignal("");
+	const onParseHtml$ = /* @__PURE__ */ inlinedQrl(() => {
+		const htmlResult = _captures[0], inputHtml = _captures[1], parsingTime = _captures[2];
+		if (!inputHtml.value.trim()) {
+			parsingTime.value = null;
+			htmlResult.value = "// Paste HTML on the left to parse";
+			return;
+		}
+		const startTime = performance.now();
+		try {
+			const doc = new DOMParser().parseFromString(inputHtml.value, "text/html");
+			let output = "";
+			try {
+				const container = _getDomContainer(doc.documentElement);
+				if (container) {
+					output += "// Qwik Container Found:\n";
+					output += `- Container Type: ${container.qContainer}\n`;
+					output += `- Manifest Hash: ${container.qManifestHash}\n\n`;
+					try {
+						const vdomTree = _vnode_toString.call(container.rootVNode, Number.MAX_SAFE_INTEGER, "", true, false, false);
+						output += "// VNode Tree:\n" + vdomTree + "\n\n";
+					} catch (vnodeErr) {
+						output += "// VNode parsing error: " + vnodeErr + "\n\n";
+					}
+				} else output = "// No Qwik container found in the HTML";
+			} catch (containerErr) {
+				output = "// No Qwik container found or error: " + containerErr;
+			}
+			parsingTime.value = performance.now() - startTime;
+			htmlResult.value = output;
+			return;
+		} catch (error) {
+			parsingTime.value = performance.now() - startTime;
+			htmlResult.value = `// Error parsing HTML: ${error instanceof Error ? error.message : "Invalid HTML format"}\n\n// Raw input:\n${inputHtml.value}`;
+			return;
+		}
+	}, "HtmlParser_component_onParseHtml_snV50t6EhQc", [
+		htmlResult,
+		inputHtml,
+		parsingTime
+	]);
+	useVisibleTaskQrl(/* @__PURE__ */ inlinedQrl(async ({ track }) => {
+		const highlightedHtml = _captures[0], htmlResult = _captures[1], shikiRef = _captures[2];
+		track(() => htmlResult.value);
+		if (!htmlResult.value) {
+			highlightedHtml.value = "";
+			return;
+		}
+		if (!shikiRef.value) shikiRef.value = await getHighlighter();
+		highlightedHtml.value = shikiRef.value.codeToHtml(htmlResult.value, {
+			lang: "html",
+			theme: "nord"
+		});
+	}, "HtmlParser_component_useVisibleTask_N0N7lePHuYM", [
+		highlightedHtml,
+		htmlResult,
+		useSignal(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 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, "nt_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_1n1clJVgZc4"),
+		"q:p": inputHtml
+	}, {
+		value: _wrapProp(inputHtml),
+		placeholder: "Paste HTML and click to parse/format.",
+		class: "border-glass-border bg-card-item-bg text-foreground h-full min-h-0 w-full flex-1 resize-none rounded-md border p-3 font-mono text-sm placeholder:text-muted-foreground"
+	}, null, 6, 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, "nt_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, "nt_2");
+}, "HtmlParser_component_8lXelHwAVNw"));
+//#endregion
+export { HtmlParser };

package/dist/ui/features/CodeBreack/StateParser.qwik.mjs

@@ -1,161 +1,113 @@
-import { jsxs, jsx } from "@qwik.dev/core/jsx-runtime";
-import { component$, useStyles$, useSignal, $, useVisibleTask$ } from "@qwik.dev/core";
-import { _preprocessState, _dumpState } from "@qwik.dev/core/internal";
 import { getHighlighter } from "../../utils/shiki.qwik.mjs";
-const StateParser = component$(() => {
-  useStyles$(`
+import { _captures, _fnSignal, _jsxSorted, _wrapProp, componentQrl, inlinedQrl, useSignal, useStylesQrl, useVisibleTaskQrl } from "@qwik.dev/core";
+import { _dumpState, _preprocessState } from "@qwik.dev/core/internal";
+//#region src/features/CodeBreack/StateParser.tsx
+var _hf0 = (p0) => p0.value || "";
+var StateParser = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl(() => {
+	useStylesQrl(/* @__PURE__ */ inlinedQrl(`
     pre.shiki { overflow: auto; padding: 10px;  height: 100%; }
-  `);
-  const inputState = useSignal("");
-  const parsingTime = useSignal(null);
-  const stateResult = useSignal("");
-  const highlightedState = useSignal("");
-  const onParseState$ = $(() => {
-    if (!inputState.value.trim()) {
-      parsingTime.value = null;
-      stateResult.value = "// Paste state on the left to parse";
-      return;
-    }
-    const startTime = performance.now();
-    try {
-      const stateData = JSON.parse(inputState.value);
-      const container = {
-        $getObjectById$: (id) => id,
-        element: null,
-        getSyncFn: () => () => {
-        },
-        $storeProxyMap$: /* @__PURE__ */ new WeakMap(),
-        $forwardRefs$: null,
-        $initialQRLsIndexes$: null,
-        $scheduler$: null
-      };
-      _preprocessState(stateData, container);
-      const dumpedState = _dumpState(stateData, false, "", null).replace(/\n/, "");
-      parsingTime.value = performance.now() - startTime;
-      stateResult.value = dumpedState;
-      return;
-    } catch (error) {
-      try {
-        const cleanInput = inputState.value.replace(/<script[^>]*>/gi, "").replace(/<\/script>/gi, "").trim();
-        if (cleanInput) {
-          const stateData = JSON.parse(cleanInput);
-          const container = {
-            $getObjectById$: (id) => id,
-            element: null,
-            getSyncFn: () => () => {
-            },
-            $storeProxyMap$: /* @__PURE__ */ new WeakMap(),
-            $forwardRefs$: null,
-            $initialQRLsIndexes$: null,
-            $scheduler$: null
-          };
-          _preprocessState(stateData, container);
-          const dumpedState = _dumpState(stateData, false, "", null);
-          parsingTime.value = performance.now() - startTime;
-          stateResult.value = dumpedState;
-          return;
-        }
-      } catch (secondError) {
-        parsingTime.value = performance.now() - startTime;
-        stateResult.value = `// Error parsing state: ${error instanceof Error ? error.message : "Invalid state format"}
-
-// Raw input:
-${inputState.value}`;
-        return;
-      }
-    }
-    parsingTime.value = performance.now() - startTime;
-    stateResult.value = "// Unable to parse the provided state";
-  });
-  const shikiRef = useSignal(null);
-  useVisibleTask$(async ({ track }) => {
-    track(() => stateResult.value);
-    if (!stateResult.value) {
-      highlightedState.value = "";
-      return;
-    }
-    if (!shikiRef.value) {
-      shikiRef.value = await getHighlighter();
-    }
-    highlightedState.value = shikiRef.value.codeToHtml(stateResult.value, {
-      lang: "json",
-      theme: "nord"
-    });
-  });
-  return /* @__PURE__ */ jsxs("div", {
-    class: "grid grid-cols-1 gap-4 md:grid-cols-2",
-    children: [
-      /* @__PURE__ */ jsxs("div", {
-        class: "border-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col rounded-xl border",
-        children: [
-          /* @__PURE__ */ jsxs("div", {
-            class: "border-border flex items-center justify-between border-b p-3",
-            children: [
-              /* @__PURE__ */ jsx("div", {
-                class: "text-sm font-medium",
-                children: "Input State"
-              }),
-              parsingTime.value !== null && /* @__PURE__ */ jsxs("span", {
-                class: "border-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs",
-                children: [
-                  parsingTime.value,
-                  "ms"
-                ]
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsxs("div", {
-            class: "min-h-0 flex-1 flex-col space-y-3 p-3",
-            children: [
-              /* @__PURE__ */ jsx("textarea", {
-                value: inputState.value,
-                onInput$: (e, t) => inputState.value = t.value,
-                placeholder: "Paste Qwik state and click to parse/format.",
-                class: "border-border bg-background h-full min-h-0 w-full flex-1 resize-none rounded-md border p-3 font-mono text-sm"
-              }),
-              /* @__PURE__ */ jsx("div", {
-                class: "flex items-center gap-3",
-                children: /* @__PURE__ */ jsx("button", {
-                  onClick$: onParseState$,
-                  class: "bg-accent rounded-md px-3 py-1.5 text-sm text-white hover:opacity-90",
-                  children: "Parse State"
-                })
-              })
-            ]
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        class: "border-border bg-card-item-bg flex h-[60vh] min-h-0 flex-col overflow-hidden rounded-xl border",
-        children: [
-          /* @__PURE__ */ jsxs("div", {
-            class: "border-border flex items-center justify-between border-b p-3",
-            children: [
-              /* @__PURE__ */ jsx("div", {
-                class: "text-sm font-medium",
-                children: "Parsed State"
-              }),
-              parsingTime.value !== null && /* @__PURE__ */ jsxs("span", {
-                class: "border-border text-muted-foreground rounded-full border px-2 py-0.5 text-xs",
-                children: [
-                  parsingTime.value,
-                  "ms"
-                ]
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsx("div", {
-            class: "h-full min-h-0 flex-1",
-            children: /* @__PURE__ */ jsx("pre", {
-              class: "h-full overflow-auto",
-              dangerouslySetInnerHTML: highlightedState.value || ""
-            })
-          })
-        ]
-      })
-    ]
-  });
-});
-export {
-  StateParser
-};
+  `, "StateParser_component_useStyles_EEff1o82UPQ"));
+	const inputState = useSignal("");
+	const parsingTime = useSignal(null);
+	const stateResult = useSignal("");
+	const highlightedState = useSignal("");
+	const onParseState$ = /* @__PURE__ */ inlinedQrl(() => {
+		const inputState = _captures[0], parsingTime = _captures[1], stateResult = _captures[2];
+		if (!inputState.value.trim()) {
+			parsingTime.value = null;
+			stateResult.value = "// Paste state on the left to parse";
+			return;
+		}
+		const startTime = performance.now();
+		try {
+			const stateData = JSON.parse(inputState.value);
+			_preprocessState(stateData, {
+				$getObjectById$: (id) => id,
+				element: null,
+				getSyncFn: () => () => {},
+				$storeProxyMap$: /* @__PURE__ */ new WeakMap(),
+				$forwardRefs$: null,
+				$initialQRLsIndexes$: null,
+				$scheduler$: null
+			});
+			const dumpedState = _dumpState(stateData, false, "", null).replace(/\n/, "");
+			parsingTime.value = performance.now() - startTime;
+			stateResult.value = dumpedState;
+			return;
+		} catch (error) {
+			try {
+				const cleanInput = inputState.value.replace(/<script[^>]*>/gi, "").replace(/<\/script>/gi, "").trim();
+				if (cleanInput) {
+					const stateData = JSON.parse(cleanInput);
+					_preprocessState(stateData, {
+						$getObjectById$: (id) => id,
+						element: null,
+						getSyncFn: () => () => {},
+						$storeProxyMap$: /* @__PURE__ */ new WeakMap(),
+						$forwardRefs$: null,
+						$initialQRLsIndexes$: null,
+						$scheduler$: null
+					});
+					const dumpedState = _dumpState(stateData, false, "", null);
+					parsingTime.value = performance.now() - startTime;
+					stateResult.value = dumpedState;
+					return;
+				}
+			} catch {
+				parsingTime.value = performance.now() - startTime;
+				stateResult.value = `// Error parsing state: ${error instanceof Error ? error.message : "Invalid state format"}\n\n// Raw input:\n${inputState.value}`;
+				return;
+			}
+		}
+		parsingTime.value = performance.now() - startTime;
+		stateResult.value = "// Unable to parse the provided state";
+	}, "StateParser_component_onParseState_Vw3Sfsgu02E", [
+		inputState,
+		parsingTime,
+		stateResult
+	]);
+	useVisibleTaskQrl(/* @__PURE__ */ inlinedQrl(async ({ track }) => {
+		const highlightedState = _captures[0], shikiRef = _captures[1], stateResult = _captures[2];
+		track(() => stateResult?.value);
+		const currentState = stateResult?.value ?? "";
+		if (!currentState) {
+			if (highlightedState) highlightedState.value = "";
+			return;
+		}
+		try {
+			if (!shikiRef?.value) {
+				if (shikiRef) shikiRef.value = await getHighlighter();
+			}
+			if (!shikiRef?.value) {
+				if (highlightedState) highlightedState.value = currentState;
+				return;
+			}
+			if (highlightedState) highlightedState.value = shikiRef.value.codeToHtml(currentState, {
+				lang: "json",
+				theme: "nord"
+			});
+		} catch {
+			if (highlightedState) highlightedState.value = currentState;
+		}
+	}, "StateParser_component_useVisibleTask_XIR02OCRVMA", [
+		highlightedState,
+		useSignal(null),
+		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 border-b p-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, "EG_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, inputState) => inputState.value = t.value, "StateParser_component_div_div_div_textarea_q_e_input_UI4xRl0sXrQ"),
+		"q:p": inputState
+	}, {
+		value: _wrapProp(inputState),
+		placeholder: "Paste Qwik state and click to parse/format.",
+		class: "border-glass-border bg-card-item-bg text-foreground h-full min-h-0 w-full flex-1 resize-none rounded-md border p-3 font-mono text-sm placeholder:text-muted-foreground"
+	}, null, 6, null), /* @__PURE__ */ _jsxSorted("div", null, { class: "flex items-center gap-3" }, /* @__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), 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" }, "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, "EG_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, "EG_2");
+}, "StateParser_component_HMASm9n0HkM"));
+//#endregion
+export { StateParser };