@flareapp/vue 2.10.0 → 2.12.0

package/README.md

@@ -87,6 +87,18 @@ are mounted. A component with an async `setup()`, or one inside a `<Suspense>` b
 after its profiled ancestor's span has closed, so it appears after its parent in the waterfall. If the
 whole trace closed by then, the span is dropped rather than attached to a finished trace.
 
+### Self time
+
+Every component span carries `flare.component.self_time_ns`: the span's duration minus the time its own
+profiled children account for. Children that overlap in time are counted once, so the value never goes
+below zero.
+
+A child that mounts after its parent's span closed is not subtracted. Its work happened outside the
+parent's window, so the parent keeps its full duration.
+
+A layout is the usual example. `vue-router` resolves the first route after the layout mounted, so the page
+component's work falls outside the layout's window.
+
 ### Naming with Inertia
 
 Inertia names navigation spans after the page component from its page object, so a root reads `Products/Show`.

package/dist/{FlareErrorBoundary-CO0ZV9lZ.mjs → FlareErrorBoundary-C0uUTn2h.mjs}

@@ -8,7 +8,6 @@ const { registerDefaultFlare, resolveFlare } = createFlareResolver({ packageName
 
 //#endregion
 //#region src/constants.ts
-/** Injected at build time via tsdown --env.PACKAGE_VERSION (reads package.json version). */
 const PACKAGE_VERSION = typeof process !== "undefined" && typeof process.env?.PACKAGE_VERSION !== "undefined" ? process.env.PACKAGE_VERSION : "?";
 const MAX_HIERARCHY_DEPTH = 50;
 const DEFAULT_PROPS_DENYLIST = /password|passwd|pwd|token|secret|authorization|\bauth\b|bearer|oauth|credentials?|cookie|api[-_]?key|private[-_]?key|session|csrf|xsrf|\bpin\b|\bssn\b|card[-_]?number|\bcvv\b/i;
@@ -105,10 +104,6 @@ function buildComponentHierarchy(instance) {
 
 //#endregion
 //#region src/serializeProps.ts
-/**
-* JSON-safe, redacted, size-bounded copy of a Vue component's props for the report payload. Delegates
-* to core safeClone (display mode) so the cycle / BigInt / throwing-getter safety is shared with core.
-*/
 function serializeProps(value, maxDepth, denylist = DEFAULT_PROPS_DENYLIST) {
 	return safeClone(value, {
 		mode: "display",
@@ -140,10 +135,6 @@ function buildComponentHierarchyFrames(instance, options) {
 
 //#endregion
 //#region src/getErrorOrigin.ts
-/**
-* Vue's `info` is a human-readable string in dev (e.g. "render function") but a numeric/short code
-* in production. INFO_TO_ORIGIN maps both forms to a stable origin category.
-*/
 function getErrorOrigin(info) {
 	return INFO_TO_ORIGIN[info] ?? "unknown";
 }
@@ -151,7 +142,6 @@ function getErrorOrigin(info) {
 //#endregion
 //#region src/getRouteContext.ts
 const ROUTE_PARAMS_DEPTH = 2;
-/** vue-router allows a symbol route name; neither shape survives JSON, so convert both to a string. */
 function routeNameOf(value) {
 	if (typeof value === "string") return value;
 	if (typeof value === "symbol") return value.toString();
@@ -168,12 +158,6 @@ function recordOrEmpty(value) {
 	if (!value || typeof value !== "object") return {};
 	return value;
 }
-/**
-* `router` is typed `unknown` because vue-router is an optional peer (importing it would force every
-* consumer to install it, and the runtime shape may differ across v4.x patches). The chained
-* type-guards read defensively so a missing or shimmed router yields `null` rather than throwing
-* inside an error handler.
-*/
 function getRouteContext(router, options = {}) {
 	if (!router || typeof router !== "object" || !("currentRoute" in router)) return null;
 	const currentRouteRef = router.currentRoute;
@@ -202,11 +186,9 @@ const tagger = createIdentityTagger({
 	sdkVersion: PACKAGE_VERSION,
 	frameworkName: FrameworkName.Vue
 });
-/** Web path: SDK identity only; the framework version (app.version) is only known at install time. */
 function registerVueSdkInfo(flare) {
 	tagger.registerSdkIdentity(flare);
 }
-/** Both paths tag the framework; never touches sdkInfo (would clobber an injected SDK name). */
 function tagVueFramework(flare, appVersion) {
 	tagger.tagFramework(flare, appVersion);
 }
@@ -214,8 +196,6 @@ function tagVueFramework(flare, appVersion) {
 //#endregion
 //#region src/profileVueComponents.ts
 const PROFILE = Symbol("flareComponentProfile");
-/** Only matched components store a marker, so unmatched ones, and functional components, which get
-*  no lifecycle hooks at all, need no code of their own. */
 function nearestMarker(instance) {
 	for (let node = instance.parent; node; node = node.parent) {
 		const state = node[PROFILE];
@@ -223,14 +203,6 @@ function nearestMarker(instance) {
 	}
 	return null;
 }
-/**
-* Record one `browser_component` span per matched component mount. `beforeMount` reserves the span id
-* and captures the start; `mounted` records it. Vue runs `beforeMount` top-down and `mounted` bottom-up,
-* so a parent's span encloses its SYNCHRONOUS descendants in time. Async components and anything under
-* `<Suspense>` are outside that contract: their span can start after the parent's ended, or be dropped
-* entirely when the root closed in the meantime. Nesting by parent id holds while the trace is the
-* same; a trace change re-homes a descendant to the live root instead of its dead-trace ancestor.
-*/
 function createComponentProfilerMixin(matches) {
 	return {
 		beforeMount() {
@@ -278,13 +250,10 @@ function createComponentProfilerMixin(matches) {
 //#endregion
 //#region src/traceVueRouter.ts
 const NAVIGATION_CANCELLED = 8;
-/** Internal, wired through `flareVue({ router })`. Opens a held navigation root per route change,
-*  settled when the navigation confirms. */
 function traceVueRouter(router) {
 	if (!isVueRouter(router)) return () => {};
 	return instrumentOnce(router, (track) => install(router, track));
 }
-/** Guards only what the integration calls unconditionally; `resolve` and `onError` stay optional. */
 function isVueRouter(router) {
 	if (typeof router !== "object" || router === null) return false;
 	return "beforeEach" in router && typeof router.beforeEach === "function" && "afterEach" in router && typeof router.afterEach === "function";

package/dist/{FlareErrorBoundary-BndkpJFI.cjs → FlareErrorBoundary-LL-1P3x9.cjs}

@@ -8,7 +8,6 @@ const { registerDefaultFlare, resolveFlare } = (0, _flareapp_js_browser.createFl
 
 //#endregion
 //#region src/constants.ts
-/** Injected at build time via tsdown --env.PACKAGE_VERSION (reads package.json version). */
 const PACKAGE_VERSION = typeof process !== "undefined" && typeof process.env?.PACKAGE_VERSION !== "undefined" ? process.env.PACKAGE_VERSION : "?";
 const MAX_HIERARCHY_DEPTH = 50;
 const DEFAULT_PROPS_DENYLIST = /password|passwd|pwd|token|secret|authorization|\bauth\b|bearer|oauth|credentials?|cookie|api[-_]?key|private[-_]?key|session|csrf|xsrf|\bpin\b|\bssn\b|card[-_]?number|\bcvv\b/i;
@@ -105,10 +104,6 @@ function buildComponentHierarchy(instance) {
 
 //#endregion
 //#region src/serializeProps.ts
-/**
-* JSON-safe, redacted, size-bounded copy of a Vue component's props for the report payload. Delegates
-* to core safeClone (display mode) so the cycle / BigInt / throwing-getter safety is shared with core.
-*/
 function serializeProps(value, maxDepth, denylist = DEFAULT_PROPS_DENYLIST) {
 	return (0, _flareapp_core.safeClone)(value, {
 		mode: "display",
@@ -140,10 +135,6 @@ function buildComponentHierarchyFrames(instance, options) {
 
 //#endregion
 //#region src/getErrorOrigin.ts
-/**
-* Vue's `info` is a human-readable string in dev (e.g. "render function") but a numeric/short code
-* in production. INFO_TO_ORIGIN maps both forms to a stable origin category.
-*/
 function getErrorOrigin(info) {
 	return INFO_TO_ORIGIN[info] ?? "unknown";
 }
@@ -151,7 +142,6 @@ function getErrorOrigin(info) {
 //#endregion
 //#region src/getRouteContext.ts
 const ROUTE_PARAMS_DEPTH = 2;
-/** vue-router allows a symbol route name; neither shape survives JSON, so convert both to a string. */
 function routeNameOf(value) {
 	if (typeof value === "string") return value;
 	if (typeof value === "symbol") return value.toString();
@@ -168,12 +158,6 @@ function recordOrEmpty(value) {
 	if (!value || typeof value !== "object") return {};
 	return value;
 }
-/**
-* `router` is typed `unknown` because vue-router is an optional peer (importing it would force every
-* consumer to install it, and the runtime shape may differ across v4.x patches). The chained
-* type-guards read defensively so a missing or shimmed router yields `null` rather than throwing
-* inside an error handler.
-*/
 function getRouteContext(router, options = {}) {
 	if (!router || typeof router !== "object" || !("currentRoute" in router)) return null;
 	const currentRouteRef = router.currentRoute;
@@ -202,11 +186,9 @@ const tagger = (0, _flareapp_core.createIdentityTagger)({
 	sdkVersion: PACKAGE_VERSION,
 	frameworkName: _flareapp_core.FrameworkName.Vue
 });
-/** Web path: SDK identity only; the framework version (app.version) is only known at install time. */
 function registerVueSdkInfo(flare) {
 	tagger.registerSdkIdentity(flare);
 }
-/** Both paths tag the framework; never touches sdkInfo (would clobber an injected SDK name). */
 function tagVueFramework(flare, appVersion) {
 	tagger.tagFramework(flare, appVersion);
 }
@@ -214,8 +196,6 @@ function tagVueFramework(flare, appVersion) {
 //#endregion
 //#region src/profileVueComponents.ts
 const PROFILE = Symbol("flareComponentProfile");
-/** Only matched components store a marker, so unmatched ones, and functional components, which get
-*  no lifecycle hooks at all, need no code of their own. */
 function nearestMarker(instance) {
 	for (let node = instance.parent; node; node = node.parent) {
 		const state = node[PROFILE];
@@ -223,14 +203,6 @@ function nearestMarker(instance) {
 	}
 	return null;
 }
-/**
-* Record one `browser_component` span per matched component mount. `beforeMount` reserves the span id
-* and captures the start; `mounted` records it. Vue runs `beforeMount` top-down and `mounted` bottom-up,
-* so a parent's span encloses its SYNCHRONOUS descendants in time. Async components and anything under
-* `<Suspense>` are outside that contract: their span can start after the parent's ended, or be dropped
-* entirely when the root closed in the meantime. Nesting by parent id holds while the trace is the
-* same; a trace change re-homes a descendant to the live root instead of its dead-trace ancestor.
-*/
 function createComponentProfilerMixin(matches) {
 	return {
 		beforeMount() {
@@ -278,13 +250,10 @@ function createComponentProfilerMixin(matches) {
 //#endregion
 //#region src/traceVueRouter.ts
 const NAVIGATION_CANCELLED = 8;
-/** Internal, wired through `flareVue({ router })`. Opens a held navigation root per route change,
-*  settled when the navigation confirms. */
 function traceVueRouter(router) {
 	if (!isVueRouter(router)) return () => {};
 	return (0, _flareapp_js_browser.instrumentOnce)(router, (track) => install(router, track));
 }
-/** Guards only what the integration calls unconditionally; `resolve` and `onError` stay optional. */
 function isVueRouter(router) {
 	if (typeof router !== "object" || router === null) return false;
 	return "beforeEach" in router && typeof router.beforeEach === "function" && "afterEach" in router && typeof router.afterEach === "function";

package/dist/{constants-BFiYPDOl.d.cts → constants-D3YW5iYm.d.cts}

@@ -50,9 +50,9 @@ type FlareVueOptions = {
   flare?: Flare; /** A vue-router Router instance. When set, enables navigation/pageload performance tracing. */
   router?: unknown;
   /**
-   * Record a span per component mount. An array matches component names exactly (string) or by
-   * `test()` (RegExp). `true` profiles every named component, which is a debugging aid: a real page
-   * will hit `maxSpansPerTrace` and bury the useful spans. Requires `enableTracing`.
+   * Records a span per component mount. An array matches component names exactly (string) or by
+   * `test()` (RegExp). `true` profiles every named component — useful for debugging, but a real
+   * page will hit `maxSpansPerTrace` and bury the useful spans. Requires `enableTracing`.
    */
   profileComponents?: ProfileComponentsOption;
   captureWarnings?: boolean;

package/dist/{constants-CFWxnFRO.d.mts → constants-y6kJnEiP.d.mts}

@@ -50,9 +50,9 @@ type FlareVueOptions = {
   flare?: Flare; /** A vue-router Router instance. When set, enables navigation/pageload performance tracing. */
   router?: unknown;
   /**
-   * Record a span per component mount. An array matches component names exactly (string) or by
-   * `test()` (RegExp). `true` profiles every named component, which is a debugging aid: a real page
-   * will hit `maxSpansPerTrace` and bury the useful spans. Requires `enableTracing`.
+   * Records a span per component mount. An array matches component names exactly (string) or by
+   * `test()` (RegExp). `true` profiles every named component — useful for debugging, but a real
+   * page will hit `maxSpansPerTrace` and bury the useful spans. Requires `enableTracing`.
    */
   profileComponents?: ProfileComponentsOption;
   captureWarnings?: boolean;

package/dist/index.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const require_FlareErrorBoundary = require('./FlareErrorBoundary-BndkpJFI.cjs');
+const require_FlareErrorBoundary = require('./FlareErrorBoundary-LL-1P3x9.cjs');
 let _flareapp_js = require("@flareapp/js");
 
 //#region src/index.ts

package/dist/index.d.cts

@@ -1,2 +1,2 @@
-import { a as ErrorOrigin, c as FlareVueContext, d as RouteContext, f as RouteParamValue, i as ComponentHierarchyFrame, l as FlareVueOptions, n as flareVue, o as FlareErrorBoundaryFallbackProps, p as RouteQueryValue, r as FlareErrorBoundary, s as FlareErrorBoundaryHookParams, t as DEFAULT_PROPS_DENYLIST, u as FlareVueWarningContext } from "./constants-BFiYPDOl.cjs";
+import { a as ErrorOrigin, c as FlareVueContext, d as RouteContext, f as RouteParamValue, i as ComponentHierarchyFrame, l as FlareVueOptions, n as flareVue, o as FlareErrorBoundaryFallbackProps, p as RouteQueryValue, r as FlareErrorBoundary, s as FlareErrorBoundaryHookParams, t as DEFAULT_PROPS_DENYLIST, u as FlareVueWarningContext } from "./constants-D3YW5iYm.cjs";
 export { type ComponentHierarchyFrame, DEFAULT_PROPS_DENYLIST, type ErrorOrigin, FlareErrorBoundary, type FlareErrorBoundaryFallbackProps, type FlareErrorBoundaryHookParams, type FlareVueContext, type FlareVueOptions, type FlareVueWarningContext, type RouteContext, type RouteParamValue, type RouteQueryValue, flareVue };

package/dist/index.d.mts

@@ -1,2 +1,2 @@
-import { a as ErrorOrigin, c as FlareVueContext, d as RouteContext, f as RouteParamValue, i as ComponentHierarchyFrame, l as FlareVueOptions, n as flareVue, o as FlareErrorBoundaryFallbackProps, p as RouteQueryValue, r as FlareErrorBoundary, s as FlareErrorBoundaryHookParams, t as DEFAULT_PROPS_DENYLIST, u as FlareVueWarningContext } from "./constants-CFWxnFRO.mjs";
+import { a as ErrorOrigin, c as FlareVueContext, d as RouteContext, f as RouteParamValue, i as ComponentHierarchyFrame, l as FlareVueOptions, n as flareVue, o as FlareErrorBoundaryFallbackProps, p as RouteQueryValue, r as FlareErrorBoundary, s as FlareErrorBoundaryHookParams, t as DEFAULT_PROPS_DENYLIST, u as FlareVueWarningContext } from "./constants-y6kJnEiP.mjs";
 export { type ComponentHierarchyFrame, DEFAULT_PROPS_DENYLIST, type ErrorOrigin, FlareErrorBoundary, type FlareErrorBoundaryFallbackProps, type FlareErrorBoundaryHookParams, type FlareVueContext, type FlareVueOptions, type FlareVueWarningContext, type RouteContext, type RouteParamValue, type RouteQueryValue, flareVue };

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { i as registerDefaultFlare, n as flareVue, r as DEFAULT_PROPS_DENYLIST, t as FlareErrorBoundary } from "./FlareErrorBoundary-CO0ZV9lZ.mjs";
+import { i as registerDefaultFlare, n as flareVue, r as DEFAULT_PROPS_DENYLIST, t as FlareErrorBoundary } from "./FlareErrorBoundary-C0uUTn2h.mjs";
 import { flare } from "@flareapp/js";
 
 //#region src/index.ts

package/dist/inject.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const require_FlareErrorBoundary = require('./FlareErrorBoundary-BndkpJFI.cjs');
+const require_FlareErrorBoundary = require('./FlareErrorBoundary-LL-1P3x9.cjs');
 
 exports.DEFAULT_PROPS_DENYLIST = require_FlareErrorBoundary.DEFAULT_PROPS_DENYLIST;
 exports.FlareErrorBoundary = require_FlareErrorBoundary.FlareErrorBoundary;

package/dist/inject.d.cts

@@ -1,2 +1,2 @@
-import { a as ErrorOrigin, c as FlareVueContext, d as RouteContext, f as RouteParamValue, i as ComponentHierarchyFrame, l as FlareVueOptions, n as flareVue, o as FlareErrorBoundaryFallbackProps, p as RouteQueryValue, r as FlareErrorBoundary, s as FlareErrorBoundaryHookParams, t as DEFAULT_PROPS_DENYLIST, u as FlareVueWarningContext } from "./constants-BFiYPDOl.cjs";
+import { a as ErrorOrigin, c as FlareVueContext, d as RouteContext, f as RouteParamValue, i as ComponentHierarchyFrame, l as FlareVueOptions, n as flareVue, o as FlareErrorBoundaryFallbackProps, p as RouteQueryValue, r as FlareErrorBoundary, s as FlareErrorBoundaryHookParams, t as DEFAULT_PROPS_DENYLIST, u as FlareVueWarningContext } from "./constants-D3YW5iYm.cjs";
 export { type ComponentHierarchyFrame, DEFAULT_PROPS_DENYLIST, type ErrorOrigin, FlareErrorBoundary, type FlareErrorBoundaryFallbackProps, type FlareErrorBoundaryHookParams, type FlareVueContext, type FlareVueOptions, type FlareVueWarningContext, type RouteContext, type RouteParamValue, type RouteQueryValue, flareVue };

package/dist/inject.d.mts

@@ -1,2 +1,2 @@
-import { a as ErrorOrigin, c as FlareVueContext, d as RouteContext, f as RouteParamValue, i as ComponentHierarchyFrame, l as FlareVueOptions, n as flareVue, o as FlareErrorBoundaryFallbackProps, p as RouteQueryValue, r as FlareErrorBoundary, s as FlareErrorBoundaryHookParams, t as DEFAULT_PROPS_DENYLIST, u as FlareVueWarningContext } from "./constants-CFWxnFRO.mjs";
+import { a as ErrorOrigin, c as FlareVueContext, d as RouteContext, f as RouteParamValue, i as ComponentHierarchyFrame, l as FlareVueOptions, n as flareVue, o as FlareErrorBoundaryFallbackProps, p as RouteQueryValue, r as FlareErrorBoundary, s as FlareErrorBoundaryHookParams, t as DEFAULT_PROPS_DENYLIST, u as FlareVueWarningContext } from "./constants-y6kJnEiP.mjs";
 export { type ComponentHierarchyFrame, DEFAULT_PROPS_DENYLIST, type ErrorOrigin, FlareErrorBoundary, type FlareErrorBoundaryFallbackProps, type FlareErrorBoundaryHookParams, type FlareVueContext, type FlareVueOptions, type FlareVueWarningContext, type RouteContext, type RouteParamValue, type RouteQueryValue, flareVue };

package/dist/inject.mjs

@@ -1,3 +1,3 @@
-import { n as flareVue, r as DEFAULT_PROPS_DENYLIST, t as FlareErrorBoundary } from "./FlareErrorBoundary-CO0ZV9lZ.mjs";
+import { n as flareVue, r as DEFAULT_PROPS_DENYLIST, t as FlareErrorBoundary } from "./FlareErrorBoundary-C0uUTn2h.mjs";
 
 export { DEFAULT_PROPS_DENYLIST, FlareErrorBoundary, flareVue };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@flareapp/vue",
-    "version": "2.10.0",
+    "version": "2.12.0",
     "description": "Vue client for flareapp.io",
     "homepage": "https://flareapp.io",
     "bugs": "https://github.com/spatie/flare-client-js/issues",
@@ -62,7 +62,7 @@
         "verify:inject": "node scripts/verify-inject-no-root.mjs"
     },
     "dependencies": {
-        "@flareapp/core": "2.10.0"
+        "@flareapp/core": "2.12.0"
     },
     "devDependencies": {
         "@flareapp/electron": "file:../electron",
@@ -77,7 +77,7 @@
         "vue-router": "^5.0.0"
     },
     "peerDependencies": {
-        "@flareapp/js": "^2.10.0",
+        "@flareapp/js": "^2.12.0",
         "vue": "^3.0.0",
         "vue-router": "^4.0.0 || ^5.0.0"
     },