@qwik.dev/devtools 0.3.0-beta.3 → 2.0.0-beta.45

package/dist/ui/packages/devtools/ui/src/features/Performance/components/StatCard.qwik.mjs

@@ -1,21 +1,9 @@
-import { componentQrl, inlinedQrl, _jsxSorted, _wrapProp } from "@qwik.dev/core";
-const StatCard = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((_rawProps) => {
-  return /* @__PURE__ */ _jsxSorted("div", null, {
-    class: "border-border bg-card-item-bg hover:bg-card-item-hover-bg flex items-center gap-4 rounded-xl border p-5 transition-all duration-200"
-  }, /* @__PURE__ */ _jsxSorted("div", null, {
-    class: "flex-1"
-  }, [
-    /* @__PURE__ */ _jsxSorted("div", null, {
-      class: "text-muted-foreground text-xs font-medium"
-    }, _wrapProp(_rawProps, "label"), 1, null),
-    /* @__PURE__ */ _jsxSorted("div", null, {
-      class: "mt-1 text-3xl font-semibold"
-    }, _wrapProp(_rawProps), 1, null),
-    _rawProps.subtitle && /* @__PURE__ */ _jsxSorted("div", null, {
-      class: "text-muted-foreground mt-1 text-xs"
-    }, _wrapProp(_rawProps, "subtitle"), 1, "RV_0")
-  ], 1, null), 1, "RV_1");
+import { _jsxSorted, _wrapProp, componentQrl, inlinedQrl } from "@qwik.dev/core";
+var StatCard = /*#__PURE__*/ componentQrl(/*#__PURE__*/ inlinedQrl((_rawProps) => {
+	return /*#__PURE__*/ _jsxSorted("div", null, { class: "border-border bg-card-item-bg hover:bg-card-item-hover-bg flex items-center gap-4 rounded-xl border p-5 transition-all duration-200" }, /*#__PURE__*/ _jsxSorted("div", null, { class: "flex-1" }, [
+		/*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground text-xs font-medium" }, _wrapProp(_rawProps, "label"), 1, null),
+		/*#__PURE__*/ _jsxSorted("div", null, { class: "mt-1 text-3xl font-semibold" }, _wrapProp(_rawProps), 1, null),
+		_rawProps.subtitle && /*#__PURE__*/ _jsxSorted("div", null, { class: "text-muted-foreground mt-1 text-xs" }, _wrapProp(_rawProps, "subtitle"), 1, "J2_0")
+	], 1, null), 1, "J2_1");
 }, "StatCard_component_Uisqt5fvHhk"));
-export {
-  StatCard
-};
+export { StatCard };

package/dist/ui/packages/devtools/ui/src/features/Performance/computePerfViewModel.qwik.mjs

@@ -1,118 +1,111 @@
 import { groupCsrBySsr, parseComponentAndEventName } from "./transformPerformanceData.qwik.mjs";
 function getCallsFromCsr(item) {
-  return typeof item.renderCount === "number" ? item.renderCount : 1;
+	return typeof item.renderCount === "number" ? item.renderCount : 1;
 }
 function computeEventRows(csrItems) {
-  const byEvent = /* @__PURE__ */ new Map();
-  for (const item of csrItems) {
-    const eventName = item.eventName || "render";
-    const prev = byEvent.get(eventName) || {
-      time: 0,
-      calls: 0
-    };
-    prev.time += item.duration || 0;
-    prev.calls += getCallsFromCsr(item);
-    byEvent.set(eventName, prev);
-  }
-  return [
-    ...byEvent.entries()
-  ].map(([eventName, v]) => ({
-    eventName,
-    time: v.time,
-    calls: v.calls
-  })).sort((a, b) => b.time - a.time);
+	const byEvent = /* @__PURE__ */ new Map();
+	for (const item of csrItems) {
+		const eventName = item.eventName || "render";
+		const prev = byEvent.get(eventName) || {
+			time: 0,
+			calls: 0
+		};
+		prev.time += item.duration || 0;
+		prev.calls += getCallsFromCsr(item);
+		byEvent.set(eventName, prev);
+	}
+	return [...byEvent.entries()].map(([eventName, v]) => ({
+		eventName,
+		time: v.time,
+		calls: v.calls
+	})).sort((a, b) => b.time - a.time);
 }
 function computeComponentVmFromCsr(componentName, csrItems, ssr) {
-  let totalTime = 0;
-  let calls = 0;
-  for (const item of csrItems) {
-    totalTime += item.duration || 0;
-    calls += getCallsFromCsr(item);
-  }
-  const avgTime = calls > 0 ? totalTime / calls : 0;
-  return {
-    componentName,
-    totalTime,
-    calls,
-    avgTime,
-    ssr,
-    csrItems
-  };
+	let totalTime = 0;
+	let calls = 0;
+	for (const item of csrItems) {
+		totalTime += item.duration || 0;
+		calls += getCallsFromCsr(item);
+	}
+	const avgTime = calls > 0 ? totalTime / calls : 0;
+	return {
+		componentName,
+		totalTime,
+		calls,
+		avgTime,
+		ssr,
+		csrItems
+	};
 }
+/** Build component view-models when SSR entries are available. */
 function groupComponentsBySsr(safe) {
-  const grouped = groupCsrBySsr(safe);
-  const result = [];
-  for (const raw of safe.ssr) {
-    const ssrItem = {
-      ...raw,
-      phase: "ssr"
-    };
-    const componentName = parseComponentAndEventName(ssrItem.component).componentName;
-    const csrItems = grouped.get(raw) || [];
-    result.push(computeComponentVmFromCsr(componentName, csrItems, ssrItem));
-  }
-  return result;
+	const grouped = groupCsrBySsr(safe);
+	const result = [];
+	for (const raw of safe.ssr) {
+		const ssrItem = {
+			...raw,
+			phase: "ssr"
+		};
+		const componentName = parseComponentAndEventName(ssrItem.component).componentName;
+		const csrItems = grouped.get(raw) || [];
+		result.push(computeComponentVmFromCsr(componentName, csrItems, ssrItem));
+	}
+	return result;
 }
+/** Build component view-models from CSR-only data, grouped by component name. */
 function groupComponentsByName(csrRaw) {
-  const byName = /* @__PURE__ */ new Map();
-  for (const entry of csrRaw) {
-    const csrItem = {
-      ...entry,
-      phase: "csr"
-    };
-    const parsed = parseComponentAndEventName(csrItem.component);
-    const list = byName.get(parsed.componentName) || [];
-    list.push({
-      ...csrItem,
-      ...parsed
-    });
-    byName.set(parsed.componentName, list);
-  }
-  const result = [];
-  for (const [componentName, csrItems] of byName.entries()) {
-    result.push(computeComponentVmFromCsr(componentName, csrItems));
-  }
-  return result;
+	const byName = /* @__PURE__ */ new Map();
+	for (const entry of csrRaw) {
+		const csrItem = {
+			...entry,
+			phase: "csr"
+		};
+		const parsed = parseComponentAndEventName(csrItem.component);
+		const list = byName.get(parsed.componentName) || [];
+		list.push({
+			...csrItem,
+			...parsed
+		});
+		byName.set(parsed.componentName, list);
+	}
+	const result = [];
+	for (const [componentName, csrItems] of byName.entries()) result.push(computeComponentVmFromCsr(componentName, csrItems));
+	return result;
 }
 function computeOverview(components) {
-  let totalRenderTime = 0;
-  let totalCalls = 0;
-  for (const c of components) {
-    totalRenderTime += c.totalTime;
-    totalCalls += c.calls;
-  }
-  const avgTime = totalCalls > 0 ? totalRenderTime / totalCalls : 0;
-  const slowest = components.filter((c) => c.calls > 0).reduce((acc, cur) => {
-    if (!acc) {
-      return cur;
-    }
-    return cur.avgTime > acc.avgTime ? cur : acc;
-  }, void 0);
-  return {
-    totalRenderTime,
-    totalCalls,
-    avgTime,
-    slowestComponent: slowest ? {
-      componentName: slowest.componentName,
-      avgTime: slowest.avgTime,
-      totalTime: slowest.totalTime,
-      calls: slowest.calls
-    } : void 0
-  };
+	let totalRenderTime = 0;
+	let totalCalls = 0;
+	for (const c of components) {
+		totalRenderTime += c.totalTime;
+		totalCalls += c.calls;
+	}
+	const avgTime = totalCalls > 0 ? totalRenderTime / totalCalls : 0;
+	const slowest = components.filter((c) => c.calls > 0).reduce((acc, cur) => {
+		if (!acc) return cur;
+		return cur.avgTime > acc.avgTime ? cur : acc;
+	}, void 0);
+	return {
+		totalRenderTime,
+		totalCalls,
+		avgTime,
+		slowestComponent: slowest ? {
+			componentName: slowest.componentName,
+			avgTime: slowest.avgTime,
+			totalTime: slowest.totalTime,
+			calls: slowest.calls
+		} : void 0
+	};
 }
 function computePerfViewModel(perf) {
-  const safe = perf || {
-    ssr: [],
-    csr: []
-  };
-  const components = safe.ssr?.length ? groupComponentsBySsr(safe) : safe.csr?.length ? groupComponentsByName(safe.csr) : [];
-  components.sort((a, b) => b.totalTime - a.totalTime);
-  return {
-    overview: computeOverview(components),
-    components
-  };
+	const safe = perf || {
+		ssr: [],
+		csr: []
+	};
+	const components = safe.ssr?.length ? groupComponentsBySsr(safe) : safe.csr?.length ? groupComponentsByName(safe.csr) : [];
+	components.sort((a, b) => b.totalTime - a.totalTime);
+	return {
+		overview: computeOverview(components),
+		components
+	};
 }
-export {
-  computeEventRows,
-  computePerfViewModel
-};
+export { computeEventRows, computePerfViewModel };

package/dist/ui/packages/devtools/ui/src/features/Performance/transformPerformanceData.qwik.mjs

@@ -1,36 +1,23 @@
 function parseComponentAndEventName(component) {
-  const componentName = (component?.split("_component_")[0] ?? component) || "";
-  const rest = component.includes("_component_") ? component.split("_component_")[1] ?? "" : "";
-  const parts = rest.split("_").filter(Boolean);
-  const eventName = parts.find((p) => /^use[A-Z_]/.test(p) || /^on[A-Z_]/.test(p));
-  return {
-    componentName,
-    eventName
-  };
+	return {
+		componentName: (component?.split("_component_")[0] ?? component) || "",
+		eventName: (component.includes("_component_") ? component.split("_component_")[1] ?? "" : "").split("_").filter(Boolean).find((p) => /^use[A-Z_]/.test(p) || /^on[A-Z_]/.test(p))
+	};
 }
 function groupCsrBySsr(data) {
-  const ssrByName = /* @__PURE__ */ new Map();
-  for (const ssrItem of data.ssr) {
-    ssrByName.set(parseComponentAndEventName(ssrItem.component).componentName, ssrItem);
-  }
-  const result = /* @__PURE__ */ new WeakMap();
-  for (const ssrItem of data.ssr) {
-    result.set(ssrItem, []);
-  }
-  for (const csrItem of data.csr) {
-    const parsed = parseComponentAndEventName(csrItem.component);
-    const ssrItem = ssrByName.get(parsed.componentName);
-    if (!ssrItem) {
-      continue;
-    }
-    result.get(ssrItem).push({
-      ...csrItem,
-      ...parsed
-    });
-  }
-  return result;
+	const ssrByName = /* @__PURE__ */ new Map();
+	for (const ssrItem of data.ssr) ssrByName.set(parseComponentAndEventName(ssrItem.component).componentName, ssrItem);
+	const result = /* @__PURE__ */ new WeakMap();
+	for (const ssrItem of data.ssr) result.set(ssrItem, []);
+	for (const csrItem of data.csr) {
+		const parsed = parseComponentAndEventName(csrItem.component);
+		const ssrItem = ssrByName.get(parsed.componentName);
+		if (!ssrItem) continue;
+		result.get(ssrItem).push({
+			...csrItem,
+			...parsed
+		});
+	}
+	return result;
 }
-export {
-  groupCsrBySsr,
-  parseComponentAndEventName
-};
+export { groupCsrBySsr, parseComponentAndEventName };

package/dist/ui/packages/devtools/ui/src/features/Performance/utils/formatMs.qwik.mjs

@@ -1,15 +1,7 @@
 function formatMs(ms) {
-  if (!Number.isFinite(ms)) {
-    return "-";
-  }
-  if (ms >= 1e3) {
-    return `${(ms / 1e3).toFixed(2)}s`;
-  }
-  if (ms >= 10) {
-    return `${ms.toFixed(0)}ms`;
-  }
-  return `${ms.toFixed(2)}ms`;
+	if (!Number.isFinite(ms)) return "-";
+	if (ms >= 1e3) return `${(ms / 1e3).toFixed(2)}s`;
+	if (ms >= 10) return `${ms.toFixed(0)}ms`;
+	return `${ms.toFixed(2)}ms`;
 }
-export {
-  formatMs
-};
+export { formatMs };