@qwik.dev/devtools 0.2.5 → 0.2.7

package/dist/ui/devtools.qwik.mjs

@@ -1,20 +1,18 @@
-import { jsxs, Fragment, jsx } from "@qwik.dev/core/jsx-runtime";
-import { component$, useStyles$, useStore, useSignal, useVisibleTask$, noSerialize } from "@qwik.dev/core";
-import { tryCreateHotContext } from "./node_modules/.pnpm/vite-hot-client@2.0.4_vite@7.1.3_@types_node@20.14.11_jiti@2.6.1_lightningcss@1.30.1_tsx@4.19.2_yaml@2.8.1_/node_modules/vite-hot-client/dist/index.qwik.mjs";
-import { HiBoltOutline, HiCubeOutline, HiPhotoOutline, HiMegaphoneMini, HiCodeBracketSolid, HiClockOutline } from "./node_modules/.pnpm/@qwikest_icons@0.0.13_@builder.io_qwik@1.11.0_vite@7.1.3_@types_node@20.14.11_jiti@2.6._02d306fcbd9f637dd624291702bff9c0/node_modules/@qwikest/icons/lib/hi.qwik.qwik.mjs";
-import { BsDiagram3 } from "./node_modules/.pnpm/@qwikest_icons@0.0.13_@builder.io_qwik@1.11.0_vite@7.1.3_@types_node@20.14.11_jiti@2.6._02d306fcbd9f637dd624291702bff9c0/node_modules/@qwikest/icons/lib/bs.qwik.qwik.mjs";
-import { LuFolderTree } from "./node_modules/.pnpm/@qwikest_icons@0.0.13_@builder.io_qwik@1.11.0_vite@7.1.3_@types_node@20.14.11_jiti@2.6._02d306fcbd9f637dd624291702bff9c0/node_modules/@qwikest/icons/lib/lu.qwik.qwik.mjs";
+import { __toESM } from "./_virtual/_rolldown/runtime.qwik.mjs";
+import { tryCreateHotContext } from "./node_modules/.pnpm/vite-hot-client@2.1.0_vite@8.0.0_@types_node@25.5.0_esbuild@0.27.4_jiti@2.6.1_tsx@4.21.0_yaml@2.8.2_/node_modules/vite-hot-client/dist/index.qwik.mjs";
+import { IconBoltOutline, IconClockOutline, IconCodeBracketSolid, IconCubeOutline, IconDiagram3, IconFolderTree, IconMegaphoneMini, IconPhotoOutline } from "./components/Icons/Icons.qwik.mjs";
+import { getViteClientRpc, setViteClientContext } from "./packages/kit/src/context.qwik.mjs";
 import { createClientRpc } from "./packages/kit/src/client.qwik.mjs";
-import "./node_modules/.pnpm/superjson@2.2.2/node_modules/superjson/dist/index.qwik.mjs";
-import { setViteClientContext, getViteClientRpc } from "./packages/kit/src/context.qwik.mjs";
-import { Type as re } from "./node_modules/.pnpm/dree@5.1.5/node_modules/dree/bundled/lib/esm/index.esm.qwik.mjs";
-import globalCss from "./global.css.qwik.mjs";
+import { re } from "./node_modules/.pnpm/dree@5.1.5/node_modules/dree/bundled/lib/esm/index.esm.qwik.mjs";
+import "./packages/kit/src/index.qwik.mjs";
+/* empty css                 */
 import { Tab } from "./components/Tab/Tab.qwik.mjs";
 import { TabContent } from "./components/TabContent/TabContent.qwik.mjs";
 import { Overview } from "./features/Overview/Overview.qwik.mjs";
 import { Assets } from "./features/Assets/Assets.qwik.mjs";
 import { Routes } from "./features/Routes/Routes.qwik.mjs";
 import { TabTitle } from "./components/TabTitle/TabTitle.qwik.mjs";
+import { require_browser } from "./node_modules/.pnpm/debug@4.4.3_supports-color@5.5.0/node_modules/debug/src/browser.qwik.mjs";
 import { RenderTree } from "./features/RenderTree/RenderTree.qwik.mjs";
 import { DevtoolsButton } from "./components/DevtoolsButton/DevtoolsButton.qwik.mjs";
 import { DevtoolsContainer } from "./components/DevtoolsContainer/DevtoolsContainer.qwik.mjs";
@@ -25,302 +23,167 @@ import { QwikThemeToggle } from "./components/ThemeToggle/QwikThemeToggle.qwik.m
 import { ThemeScript } from "./components/ThemeToggle/theme-script.qwik.mjs";
 import { CodeBreack } from "./features/CodeBreack/CodeBreack.qwik.mjs";
 import { Performance } from "./features/Performance/Performance.qwik.mjs";
-import { b as browserExports } from "./_virtual/browser.qwik.mjs";
-const log = browserExports.debug("qwik:devtools:devtools");
+import { _captures, _fnSignal, _jsxSorted, componentQrl, inlinedQrl, noSerialize, useStore, useVisibleTaskQrl } from "@qwik.dev/core";
+import { Fragment } from "@qwik.dev/core/jsx-runtime";
+//#region src/devtools.tsx
+var import_browser = /* @__PURE__ */ __toESM(require_browser(), 1);
+var _hf0 = (p0) => p0.assets?.length || 0;
+var log = (0, import_browser.debug)("qwik:devtools:devtools");
 function getClientRpcFunctions() {
-  return {
-    healthCheck: () => true
-  };
+	return { healthCheck: () => true };
 }
 function toDevtoolsRoutes(routes) {
-  const children = routes?.children || [];
-  const directories = children.filter((child) => child.type === re.DIRECTORY);
-  return [
-    {
-      relativePath: "",
-      name: "index",
-      type: re.DIRECTORY,
-      path: "",
-      isSymbolicLink: false,
-      children: void 0
-    },
-    ...directories
-  ];
+	const directories = (routes?.children || []).filter((child) => child.type === re.DIRECTORY);
+	return [{
+		relativePath: "",
+		name: "index",
+		type: re.DIRECTORY,
+		path: "",
+		isSymbolicLink: false,
+		children: void 0
+	}, ...directories];
 }
-const QwikDevtools = component$(() => {
-  useStyles$(globalCss);
-  const state = useStore({
-    isOpen: useSignal(false),
-    activeTab: "overview",
-    npmPackages: [],
-    assets: [],
-    components: [],
-    routes: void 0,
-    allDependencies: [],
-    isLoadingDependencies: false
-  });
-  useVisibleTask$(async () => {
-    const hot = await tryCreateHotContext(void 0, [
-      "/"
-    ]);
-    if (!hot) {
-      throw new Error("Vite Hot Context not connected");
-    }
-    setViteClientContext(hot);
-    createClientRpc(getClientRpcFunctions());
-    const rpc = getViteClientRpc();
-    const group1 = Promise.allSettled([
-      rpc.getAssetsFromPublicDir(),
-      rpc.getComponents(),
-      rpc.getRoutes(),
-      rpc.getQwikPackages()
-    ]);
-    state.isLoadingDependencies = true;
-    const depsPromise = rpc.getAllDependencies().then((allDeps) => {
-      state.allDependencies = allDeps;
-    }).catch((error) => {
-      log("Failed to load all dependencies:", error);
-    }).finally(() => {
-      state.isLoadingDependencies = false;
-    });
-    const [assetsRes, componentsRes, routesRes, packagesRes] = await group1;
-    if (assetsRes.status === "fulfilled") {
-      state.assets = assetsRes.value;
-    } else {
-      log("Failed to load assets:", assetsRes.reason);
-    }
-    if (componentsRes.status === "fulfilled") {
-      state.components = componentsRes.value;
-    } else {
-      log("Failed to load components:", componentsRes.reason);
-    }
-    if (routesRes.status === "fulfilled") {
-      state.routes = noSerialize(toDevtoolsRoutes(routesRes.value));
-    } else {
-      log("Failed to load routes:", routesRes.reason);
-    }
-    if (packagesRes.status === "fulfilled") {
-      state.npmPackages = packagesRes.value;
-    } else {
-      log("Failed to load Qwik packages:", packagesRes.reason);
-    }
-    await depsPromise;
-  });
-  return /* @__PURE__ */ jsxs(Fragment, {
-    children: [
-      /* @__PURE__ */ jsx(ThemeScript, {}),
-      /* @__PURE__ */ jsxs(DevtoolsContainer, {
-        children: [
-          /* @__PURE__ */ jsx(DevtoolsButton, {
-            state
-          }),
-          state.isOpen.value && /* @__PURE__ */ jsxs(DevtoolsPanel, {
-            state,
-            children: [
-              /* @__PURE__ */ jsxs("div", {
-                class: "bg-background/95 border-border flex flex-col gap-2 border-r p-3",
-                children: [
-                  /* @__PURE__ */ jsx(Tab, {
-                    state,
-                    id: "overview",
-                    title: "Overview",
-                    children: /* @__PURE__ */ jsx(HiBoltOutline, {
-                      class: "h-5 w-5"
-                    })
-                  }),
-                  /* @__PURE__ */ jsx(Tab, {
-                    state,
-                    id: "packages",
-                    title: "Packages",
-                    children: /* @__PURE__ */ jsx(HiCubeOutline, {
-                      class: "h-5 w-5"
-                    })
-                  }),
-                  /* @__PURE__ */ jsx(Tab, {
-                    state,
-                    id: "renderTree",
-                    title: "renderTree",
-                    children: /* @__PURE__ */ jsx(BsDiagram3, {
-                      class: "h-5 w-5"
-                    })
-                  }),
-                  /* @__PURE__ */ jsx(Tab, {
-                    state,
-                    id: "routes",
-                    title: "Routes",
-                    children: /* @__PURE__ */ jsx(LuFolderTree, {
-                      class: "h-5 w-5"
-                    })
-                  }),
-                  /* @__PURE__ */ jsx(Tab, {
-                    state,
-                    id: "assets",
-                    title: "Assets",
-                    children: /* @__PURE__ */ jsx(HiPhotoOutline, {
-                      class: "h-5 w-5"
-                    })
-                  }),
-                  /* @__PURE__ */ jsx(Tab, {
-                    state,
-                    id: "inspect",
-                    title: "inspect",
-                    children: /* @__PURE__ */ jsx(HiMegaphoneMini, {
-                      class: "h-5 w-5"
-                    })
-                  }),
-                  /* @__PURE__ */ jsx(Tab, {
-                    state,
-                    id: "codeBreack",
-                    title: "CodeBreack",
-                    children: /* @__PURE__ */ jsx(HiCodeBracketSolid, {
-                      class: "h-5 w-5"
-                    })
-                  }),
-                  /* @__PURE__ */ jsx(Tab, {
-                    state,
-                    id: "performance",
-                    title: "Performance",
-                    children: /* @__PURE__ */ jsx(HiClockOutline, {
-                      class: "h-5 w-5"
-                    })
-                  }),
-                  /* @__PURE__ */ jsx("div", {
-                    class: "mt-auto",
-                    children: /* @__PURE__ */ jsx(QwikThemeToggle, {})
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                class: "custom-scrollbar flex-1 overflow-y-auto p-4",
-                children: [
-                  state.activeTab === "overview" && /* @__PURE__ */ jsxs(TabContent, {
-                    children: [
-                      /* @__PURE__ */ jsxs("div", {
-                        class: "flex items-center gap-3",
-                        "q:slot": "title",
-                        children: [
-                          /* @__PURE__ */ jsx("img", {
-                            width: 32,
-                            height: 32,
-                            src: "https://qwik.dev/logos/qwik-logo.svg",
-                            alt: "Qwik Logo",
-                            class: "h-8 w-8"
-                          }),
-                          /* @__PURE__ */ jsx("h1", {
-                            class: "text-2xl font-semibold",
-                            children: "Qwik DevTools"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsx(Overview, {
-                        state,
-                        "q:slot": "content"
-                      })
-                    ]
-                  }),
-                  state.activeTab === "assets" && /* @__PURE__ */ jsxs(TabContent, {
-                    children: [
-                      /* @__PURE__ */ jsx(TabTitle, {
-                        title: "Public Assets",
-                        "q:slot": "title"
-                      }),
-                      /* @__PURE__ */ jsxs("div", {
-                        class: "text-muted-foreground flex gap-4 text-sm",
-                        children: [
-                          /* @__PURE__ */ jsxs("span", {
-                            children: [
-                              "Total Size:",
-                              " ",
-                              (state.assets?.reduce((acc, asset) => acc + asset.size, 0) / 1024).toFixed(2),
-                              " ",
-                              "KB"
-                            ]
-                          }),
-                          /* @__PURE__ */ jsxs("span", {
-                            children: [
-                              "Count: ",
-                              state.assets?.length || 0
-                            ]
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsx(Assets, {
-                        state,
-                        "q:slot": "content"
-                      })
-                    ]
-                  }),
-                  state.activeTab === "packages" && /* @__PURE__ */ jsxs(TabContent, {
-                    children: [
-                      /* @__PURE__ */ jsx(TabTitle, {
-                        title: "Project Dependencies",
-                        "q:slot": "title"
-                      }),
-                      /* @__PURE__ */ jsx(Packages, {
-                        state,
-                        "q:slot": "content"
-                      })
-                    ]
-                  }),
-                  state.activeTab === "routes" && /* @__PURE__ */ jsxs(TabContent, {
-                    children: [
-                      /* @__PURE__ */ jsx(TabTitle, {
-                        title: "Application Routes",
-                        "q:slot": "title"
-                      }),
-                      /* @__PURE__ */ jsx(Routes, {
-                        state,
-                        "q:slot": "content"
-                      })
-                    ]
-                  }),
-                  state.activeTab === "inspect" && /* @__PURE__ */ jsx(TabContent, {
-                    children: /* @__PURE__ */ jsx(Inspect, {
-                      "q:slot": "content"
-                    })
-                  }),
-                  state.activeTab === "renderTree" && /* @__PURE__ */ jsxs(TabContent, {
-                    children: [
-                      /* @__PURE__ */ jsx(TabTitle, {
-                        title: "render Tree",
-                        "q:slot": "title"
-                      }),
-                      /* @__PURE__ */ jsx(RenderTree, {
-                        "q:slot": "content"
-                      })
-                    ]
-                  }),
-                  state.activeTab === "codeBreack" && /* @__PURE__ */ jsxs(TabContent, {
-                    children: [
-                      /* @__PURE__ */ jsx(TabTitle, {
-                        title: "codeBreack",
-                        "q:slot": "title"
-                      }),
-                      /* @__PURE__ */ jsx(CodeBreack, {
-                        "q:slot": "content"
-                      })
-                    ]
-                  }),
-                  state.activeTab === "performance" && /* @__PURE__ */ jsxs(TabContent, {
-                    children: [
-                      /* @__PURE__ */ jsx(TabTitle, {
-                        title: "performance",
-                        "q:slot": "title"
-                      }),
-                      /* @__PURE__ */ jsx(Performance, {
-                        "q:slot": "content"
-                      })
-                    ]
-                  })
-                ]
-              })
-            ]
-          })
-        ]
-      })
-    ]
-  });
-});
-export {
-  QwikDevtools
-};
+var QwikDevtools = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl(() => {
+	const state = useStore({
+		isOpen: false,
+		activeTab: "overview",
+		npmPackages: [],
+		assets: [],
+		components: [],
+		routes: void 0,
+		allDependencies: [],
+		isLoadingDependencies: false
+	});
+	useVisibleTaskQrl(/* @__PURE__ */ inlinedQrl(async () => {
+		const state = _captures[0];
+		const hot = await tryCreateHotContext(void 0, ["/"]);
+		if (!hot) throw new Error("Vite Hot Context not connected");
+		setViteClientContext(hot);
+		createClientRpc(getClientRpcFunctions());
+		const rpc = getViteClientRpc();
+		const group1 = Promise.allSettled([
+			rpc.getAssetsFromPublicDir(),
+			rpc.getComponents(),
+			rpc.getRoutes(),
+			rpc.getQwikPackages()
+		]);
+		state.isLoadingDependencies = true;
+		const depsPromise = rpc.getAllDependencies().then((allDeps) => {
+			state.allDependencies = allDeps;
+		}).catch((error) => {
+			log("Failed to load all dependencies:", error);
+		}).finally(() => {
+			state.isLoadingDependencies = false;
+		});
+		const [assetsRes, componentsRes, routesRes, packagesRes] = await group1;
+		if (assetsRes.status === "fulfilled") state.assets = assetsRes.value;
+		else log("Failed to load assets:", assetsRes.reason);
+		if (componentsRes.status === "fulfilled") state.components = componentsRes.value;
+		else log("Failed to load components:", componentsRes.reason);
+		if (routesRes.status === "fulfilled") state.routes = noSerialize(toDevtoolsRoutes(routesRes.value));
+		else log("Failed to load routes:", routesRes.reason);
+		if (packagesRes.status === "fulfilled") state.npmPackages = packagesRes.value;
+		else log("Failed to load Qwik packages:", packagesRes.reason);
+		await depsPromise;
+	}, "QwikDevtools_component_useVisibleTask_LfFqxuMMLVY", [state]));
+	return /* @__PURE__ */ _jsxSorted(Fragment, null, null, [/* @__PURE__ */ _jsxSorted(ThemeScript, null, null, null, 3, "nj_0"), /* @__PURE__ */ _jsxSorted(DevtoolsContainer, null, null, [/* @__PURE__ */ _jsxSorted(DevtoolsButton, null, { state }, null, 3, "nj_1"), state.isOpen && /* @__PURE__ */ _jsxSorted(DevtoolsPanel, null, { state }, [/* @__PURE__ */ _jsxSorted("div", null, { class: "glass-bg border-r border-glass-border shadow-r flex flex-col gap-3 p-3 w-16 md:w-20 items-center justify-start h-full" }, [
+		/* @__PURE__ */ _jsxSorted(Tab, null, {
+			state,
+			id: "overview",
+			title: "Overview"
+		}, /* @__PURE__ */ _jsxSorted(IconBoltOutline, null, { class: "h-6 w-6" }, null, 3, "nj_2"), 1, "nj_3"),
+		/* @__PURE__ */ _jsxSorted(Tab, null, {
+			state,
+			id: "packages",
+			title: "Packages"
+		}, /* @__PURE__ */ _jsxSorted(IconCubeOutline, null, { class: "h-6 w-6" }, null, 3, "nj_4"), 1, "nj_5"),
+		/* @__PURE__ */ _jsxSorted(Tab, null, {
+			state,
+			id: "renderTree",
+			title: "renderTree"
+		}, /* @__PURE__ */ _jsxSorted(IconDiagram3, null, { class: "h-6 w-6" }, null, 3, "nj_6"), 1, "nj_7"),
+		/* @__PURE__ */ _jsxSorted(Tab, null, {
+			state,
+			id: "routes",
+			title: "Routes"
+		}, /* @__PURE__ */ _jsxSorted(IconFolderTree, null, { class: "h-6 w-6" }, null, 3, "nj_8"), 1, "nj_9"),
+		/* @__PURE__ */ _jsxSorted(Tab, null, {
+			state,
+			id: "assets",
+			title: "Assets"
+		}, /* @__PURE__ */ _jsxSorted(IconPhotoOutline, null, { class: "h-6 w-6" }, null, 3, "nj_10"), 1, "nj_11"),
+		/* @__PURE__ */ _jsxSorted(Tab, null, {
+			state,
+			id: "inspect",
+			title: "inspect"
+		}, /* @__PURE__ */ _jsxSorted(IconMegaphoneMini, null, { class: "h-6 w-6" }, null, 3, "nj_12"), 1, "nj_13"),
+		/* @__PURE__ */ _jsxSorted(Tab, null, {
+			state,
+			id: "codeBreack",
+			title: "CodeBreack"
+		}, /* @__PURE__ */ _jsxSorted(IconCodeBracketSolid, null, { class: "h-6 w-6" }, null, 3, "nj_14"), 1, "nj_15"),
+		/* @__PURE__ */ _jsxSorted(Tab, null, {
+			state,
+			id: "performance",
+			title: "Performance"
+		}, /* @__PURE__ */ _jsxSorted(IconClockOutline, null, { class: "h-6 w-6" }, null, 3, "nj_16"), 1, "nj_17"),
+		/* @__PURE__ */ _jsxSorted("div", null, { class: "mt-auto mb-2 opacity-80 hover:opacity-100 transition-opacity" }, /* @__PURE__ */ _jsxSorted(QwikThemeToggle, null, null, null, 3, "nj_18"), 1, null)
+	], 1, null), /* @__PURE__ */ _jsxSorted("div", null, { class: "custom-scrollbar flex-1 overflow-y-auto p-4" }, [
+		state.activeTab === "overview" && /* @__PURE__ */ _jsxSorted(TabContent, null, null, [/* @__PURE__ */ _jsxSorted("div", { "q:slot": "title" }, { class: "flex items-center gap-3" }, [/* @__PURE__ */ _jsxSorted("img", null, {
+			width: 32,
+			height: 32,
+			src: "https://qwik.dev/logos/qwik-logo.svg",
+			alt: "Qwik Logo",
+			class: "h-8 w-8"
+		}, null, 3, null), /* @__PURE__ */ _jsxSorted("h1", null, { class: "text-2xl font-semibold" }, "Qwik DevTools", 3, null)], 3, null), /* @__PURE__ */ _jsxSorted(Overview, null, {
+			state,
+			"q:slot": "content"
+		}, null, 3, "nj_19")], 1, "nj_20"),
+		state.activeTab === "assets" && /* @__PURE__ */ _jsxSorted(TabContent, null, null, [
+			/* @__PURE__ */ _jsxSorted(TabTitle, null, {
+				title: "Public Assets",
+				"q:slot": "title"
+			}, null, 3, "nj_21"),
+			/* @__PURE__ */ _jsxSorted("div", null, { class: "text-muted-foreground flex gap-4 text-sm" }, [/* @__PURE__ */ _jsxSorted("span", null, null, [
+				"Total Size:",
+				" ",
+				(state.assets?.reduce((acc, asset) => acc + asset.size, 0) / 1024).toFixed(2),
+				" ",
+				"KB"
+			], 1, null), /* @__PURE__ */ _jsxSorted("span", null, null, ["Count: ", _fnSignal(_hf0, [state])], 3, null)], 1, null),
+			/* @__PURE__ */ _jsxSorted(Assets, null, {
+				state,
+				"q:slot": "content"
+			}, null, 3, "nj_22")
+		], 1, "nj_23"),
+		state.activeTab === "packages" && /* @__PURE__ */ _jsxSorted(TabContent, null, null, [/* @__PURE__ */ _jsxSorted(TabTitle, null, {
+			title: "Project Dependencies",
+			"q:slot": "title"
+		}, null, 3, "nj_24"), /* @__PURE__ */ _jsxSorted(Packages, null, {
+			state,
+			"q:slot": "content"
+		}, null, 3, "nj_25")], 1, "nj_26"),
+		state.activeTab === "routes" && /* @__PURE__ */ _jsxSorted(TabContent, null, null, [/* @__PURE__ */ _jsxSorted(TabTitle, null, {
+			title: "Application Routes",
+			"q:slot": "title"
+		}, null, 3, "nj_27"), /* @__PURE__ */ _jsxSorted(Routes, null, {
+			state,
+			"q:slot": "content"
+		}, null, 3, "nj_28")], 1, "nj_29"),
+		state.activeTab === "inspect" && /* @__PURE__ */ _jsxSorted(TabContent, null, null, /* @__PURE__ */ _jsxSorted(Inspect, null, { "q:slot": "content" }, null, 3, "nj_30"), 1, "nj_31"),
+		state.activeTab === "renderTree" && /* @__PURE__ */ _jsxSorted(TabContent, null, null, [/* @__PURE__ */ _jsxSorted(TabTitle, null, {
+			title: "render Tree",
+			"q:slot": "title"
+		}, null, 3, "nj_32"), /* @__PURE__ */ _jsxSorted(RenderTree, null, { "q:slot": "content" }, null, 3, "nj_33")], 1, "nj_34"),
+		state.activeTab === "codeBreack" && /* @__PURE__ */ _jsxSorted(TabContent, null, null, [/* @__PURE__ */ _jsxSorted(TabTitle, null, {
+			title: "codeBreack",
+			"q:slot": "title"
+		}, null, 3, "nj_35"), /* @__PURE__ */ _jsxSorted(CodeBreack, null, { "q:slot": "content" }, null, 3, "nj_36")], 1, "nj_37"),
+		state.activeTab === "performance" && /* @__PURE__ */ _jsxSorted(TabContent, null, null, [/* @__PURE__ */ _jsxSorted(TabTitle, null, {
+			title: "performance",
+			"q:slot": "title"
+		}, null, 3, "nj_38"), /* @__PURE__ */ _jsxSorted(Performance, null, { "q:slot": "content" }, null, 3, "nj_39")], 1, "nj_40")
+	], 1, null)], 1, "nj_41")], 1, "nj_42")], 1, "nj_43");
+}, "QwikDevtools_component_8YdpicpTyiE"));
+//#endregion
+export { QwikDevtools };

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

@@ -1,60 +1,18 @@
-import { jsx, jsxs } from "@qwik.dev/core/jsx-runtime";
-import { component$ } from "@qwik.dev/core";
-const Assets = component$(({ state }) => {
-  return /* @__PURE__ */ jsx("div", {
-    class: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3",
-    children: state.assets?.map((asset) => {
-      const isImage = asset.path.match(/\.(jpg|jpeg|png|gif|svg|webp)$/i);
-      const fileExt = asset.path.split(".").pop()?.toUpperCase();
-      return /* @__PURE__ */ jsxs("div", {
-        class: "border-border bg-card-item-bg hover:bg-card-item-hover-bg overflow-hidden rounded-xl border transition-all duration-200",
-        children: [
-          isImage ? /* @__PURE__ */ jsx("div", {
-            class: "aspect-square overflow-hidden bg-black/20",
-            children: /* @__PURE__ */ jsx("img", {
-              width: 176,
-              height: 176,
-              src: asset.publicPath,
-              alt: asset.path,
-              class: "h-full w-full object-cover"
-            })
-          }) : /* @__PURE__ */ jsx("div", {
-            class: "flex aspect-square items-center justify-center bg-black/20",
-            children: /* @__PURE__ */ jsx("span", {
-              class: "text-muted-foreground font-mono text-2xl",
-              children: fileExt
-            })
-          }),
-          /* @__PURE__ */ jsxs("div", {
-            class: "space-y-2 p-4",
-            children: [
-              /* @__PURE__ */ jsx("div", {
-                class: "truncate text-sm",
-                title: asset.path,
-                children: asset.path.split("/").pop()
-              }),
-              /* @__PURE__ */ jsxs("div", {
-                class: "text-muted-foreground flex items-center justify-between text-xs",
-                children: [
-                  /* @__PURE__ */ jsxs("span", {
-                    children: [
-                      (asset.size / 1024).toFixed(2),
-                      " KB"
-                    ]
-                  }),
-                  /* @__PURE__ */ jsx("span", {
-                    class: "bg-foreground/5 rounded-full px-2 py-1",
-                    children: fileExt
-                  })
-                ]
-              })
-            ]
-          })
-        ]
-      }, asset.filePath);
-    })
-  });
-});
-export {
-  Assets
-};
+import { _jsxSorted, _wrapProp, componentQrl, inlinedQrl } from "@qwik.dev/core";
+//#region src/features/Assets/Assets.tsx
+var Assets = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl(({ state }) => {
+	return /* @__PURE__ */ _jsxSorted("div", null, { class: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3" }, state.assets?.map((asset) => {
+		const isImage = asset.path.match(/\.(jpg|jpeg|png|gif|svg|webp)$/i);
+		const fileExt = asset.path.split(".").pop()?.toUpperCase();
+		return /* @__PURE__ */ _jsxSorted("div", null, { class: "border-glass-border bg-card-item-bg hover:bg-card-item-hover-bg overflow-hidden rounded-xl border transition-all duration-200" }, [isImage ? /* @__PURE__ */ _jsxSorted("div", null, { class: "aspect-square overflow-hidden bg-foreground/5" }, /* @__PURE__ */ _jsxSorted("img", {
+			alt: _wrapProp(asset, "path"),
+			src: _wrapProp(asset, "publicPath")
+		}, {
+			width: 176,
+			height: 176,
+			class: "h-full w-full object-cover"
+		}, null, 3, null), 1, "xU_0") : /* @__PURE__ */ _jsxSorted("div", null, { class: "flex aspect-square items-center justify-center bg-foreground/5" }, /* @__PURE__ */ _jsxSorted("span", null, { class: "text-muted-foreground font-mono text-2xl" }, fileExt, 1, null), 1, "xU_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, "xU_2");
+}, "Assets_component_HMhkSfMocCE"));
+//#endregion
+export { Assets };