@vue/devtools-kit 8.0.1 → 8.0.2

package/dist/index.cjs

@@ -24,10 +24,14 @@ var __toESM = (mod, isNodeMode, target$21) => (target$21 = mod != null ? __creat
 }) : target$21, mod));
 
 //#endregion
-const __vue_devtools_shared = __toESM(require("@vue/devtools-shared"));
-const perfect_debounce = __toESM(require("perfect-debounce"));
-const hookable = __toESM(require("hookable"));
-const birpc = __toESM(require("birpc"));
+let __vue_devtools_shared = require("@vue/devtools-shared");
+__vue_devtools_shared = __toESM(__vue_devtools_shared);
+let perfect_debounce = require("perfect-debounce");
+perfect_debounce = __toESM(perfect_debounce);
+let hookable = require("hookable");
+hookable = __toESM(hookable);
+let birpc = require("birpc");
+birpc = __toESM(birpc);
 
 //#region src/compat/index.ts
 function onLegacyDevToolsPluginApiAvailable(cb) {
@@ -127,8 +131,7 @@ function returnError(cb) {
 }
 function getComponentInstance(appRecord, instanceId) {
 	instanceId = instanceId || `${appRecord.id}:root`;
-	const instance = appRecord.instanceMap.get(instanceId);
-	return instance || appRecord.instanceMap.get(":root");
+	return appRecord.instanceMap.get(instanceId) || appRecord.instanceMap.get(":root");
 }
 function ensurePropertyExists(obj, key, skipObjCheck = false) {
 	return skipObjCheck ? key in obj : typeof obj === "object" && obj !== null ? key in obj : false;
@@ -317,8 +320,7 @@ function highlight(instance) {
 	const bounds = getComponentBoundingRect(instance);
 	if (!bounds.width && !bounds.height) return;
 	const name = getInstanceName(instance);
-	const container = getContainerElement();
-	container ? update({
+	getContainerElement() ? update({
 		bounds,
 		name
 	}) : create({
@@ -337,12 +339,10 @@ function inspectFn(e) {
 		const instance = target$21.__vueParentComponent;
 		if (instance) {
 			inspectInstance = instance;
-			const el = instance.vnode.el;
-			if (el) {
+			if (instance.vnode.el) {
 				const bounds = getComponentBoundingRect(instance);
 				const name = getInstanceName(instance);
-				const container = getContainerElement();
-				container ? update({
+				getContainerElement() ? update({
 					bounds,
 					name
 				}) : create({
@@ -515,7 +515,9 @@ const Fragment = Symbol.for("v-fgt");
 //#endregion
 //#region src/core/component/state/editor.ts
 var StateEditor = class {
-	refEditor = new RefStateEditor();
+	constructor() {
+		this.refEditor = new RefStateEditor();
+	}
 	set(object, path, value, cb) {
 		const sections = Array.isArray(path) ? path : path.split(".");
 		while (sections.length > 1) {
@@ -733,12 +735,10 @@ function getInspector(id, app) {
 	return devtoolsInspector.find((inspector) => inspector.options.id === id && (app ? inspector.descriptor.app === app : true));
 }
 function getInspectorActions(id) {
-	const inspector = getInspector(id);
-	return inspector?.options.actions;
+	return getInspector(id)?.options.actions;
 }
 function getInspectorNodeActions(id) {
-	const inspector = getInspector(id);
-	return inspector?.options.nodeActions;
+	return getInspector(id)?.options.nodeActions;
 }
 
 //#endregion
@@ -842,13 +842,12 @@ function createDevToolsCtxHooks() {
 		addTimelineLayer(options, plugin.descriptor);
 	});
 	hooks$1.hook(DevToolsContextHookKeys.TIMELINE_EVENT_ADDED, ({ options, plugin }) => {
-		const internalLayerIds = [
+		if (devtoolsState.highPerfModeEnabled || !devtoolsState.timelineLayersState?.[plugin.descriptor.id] && ![
 			"performance",
 			"component-event",
 			"keyboard",
 			"mouse"
-		];
-		if (devtoolsState.highPerfModeEnabled || !devtoolsState.timelineLayersState?.[plugin.descriptor.id] && !internalLayerIds.includes(options.layerId)) return;
+		].includes(options.layerId)) return;
 		hooks$1.callHookWith(async (callbacks) => {
 			await Promise.all(callbacks.map((cb) => cb(options)));
 		}, DevToolsMessagingHookKeys.SEND_TIMELINE_EVENT_TO_CLIENT);
@@ -857,16 +856,13 @@ function createDevToolsCtxHooks() {
 		const appRecord = app.__VUE_DEVTOOLS_NEXT_APP_RECORD__;
 		if (!appRecord) return null;
 		const appId = appRecord.id.toString();
-		const instances = [...appRecord.instanceMap].filter(([key]) => key.split(":")[0] === appId).map(([, instance]) => instance);
-		return instances;
+		return [...appRecord.instanceMap].filter(([key]) => key.split(":")[0] === appId).map(([, instance]) => instance);
 	});
 	hooks$1.hook(DevToolsContextHookKeys.GET_COMPONENT_BOUNDS, async ({ instance }) => {
-		const bounds = getComponentBoundingRect(instance);
-		return bounds;
+		return getComponentBoundingRect(instance);
 	});
 	hooks$1.hook(DevToolsContextHookKeys.GET_COMPONENT_NAME, ({ instance }) => {
-		const name = getInstanceName(instance);
-		return name;
+		return getInstanceName(instance);
 	});
 	hooks$1.hook(DevToolsContextHookKeys.COMPONENT_HIGHLIGHT, ({ uid }) => {
 		const instance = activeAppRecord.value.instanceMap.get(uid);
@@ -1075,8 +1071,7 @@ function getPluginLocalKey(pluginId) {
 	return `__VUE_DEVTOOLS_NEXT_PLUGIN_SETTINGS__${pluginId}__`;
 }
 function getPluginSettingsOptions(pluginId) {
-	const item = devtoolsPluginBuffer.find((item$1) => item$1[0].id === pluginId && !!item$1[0]?.settings)?.[0] ?? null;
-	return item?.settings ?? null;
+	return (devtoolsPluginBuffer.find((item) => item[0].id === pluginId && !!item[0]?.settings)?.[0] ?? null)?.settings ?? null;
 }
 function getPluginSettings(pluginId, fallbackValue) {
 	const localKey = getPluginLocalKey(pluginId);
@@ -1092,8 +1087,7 @@ function getPluginSettings(pluginId, fallbackValue) {
 }
 function initPluginSettings(pluginId, settings) {
 	const localKey = getPluginLocalKey(pluginId);
-	const localSettings = localStorage.getItem(localKey);
-	if (!localSettings) localStorage.setItem(localKey, JSON.stringify(_getSettings(settings)));
+	if (!localStorage.getItem(localKey)) localStorage.setItem(localKey, JSON.stringify(_getSettings(settings)));
 }
 function setPluginSettings(pluginId, key, value) {
 	const localKey = getPluginLocalKey(pluginId);
@@ -1251,8 +1245,6 @@ const hook = {
 //#endregion
 //#region src/api/v6/index.ts
 var DevToolsV6PluginAPI = class {
-	plugin;
-	hooks;
 	constructor({ plugin, ctx }) {
 		this.hooks = ctx.hooks;
 		this.plugin = plugin;
@@ -1653,11 +1645,10 @@ function processSetupState(instance) {
 				editable: isState && !info.readonly
 			};
 		}
-		const type = isOtherType ? "setup (other)" : "setup";
 		return {
 			key,
 			value,
-			type,
+			type: isOtherType ? "setup (other)" : "setup",
 			...result
 		};
 	});
@@ -1778,7 +1769,6 @@ function getInstanceState(params) {
 //#endregion
 //#region src/core/component/tree/filter.ts
 var ComponentFilter = class {
-	filter;
 	constructor(filter) {
 		this.filter = filter || "";
 	}
@@ -1800,12 +1790,8 @@ function createComponentFilter(filterText) {
 //#endregion
 //#region src/core/component/tree/walker.ts
 var ComponentWalker = class {
-	maxDepth;
-	recursively;
-	componentFilter;
-	api;
-	captureIds = /* @__PURE__ */ new Map();
 	constructor(options) {
+		this.captureIds = /* @__PURE__ */ new Map();
 		const { filterText = "", maxDepth, recursively, api } = options;
 		this.componentFilter = createComponentFilter(filterText);
 		this.maxDepth = maxDepth;
@@ -1877,8 +1863,7 @@ var ComponentWalker = class {
 				if (node) treeNode.children.push(node);
 			}
 		}
-		const rootElements = getRootElementsFromComponentInstance(instance);
-		const firstElement = rootElements[0];
+		const firstElement = getRootElementsFromComponentInstance(instance)[0];
 		if (firstElement?.parentElement) {
 			const parentInstance = instance.parent;
 			const parentRootElements = parentInstance ? getRootElementsFromComponentInstance(parentInstance) : [];
@@ -2199,15 +2184,12 @@ function createComponentsDevToolsPlugin(app) {
 		api.on.getInspectorTree(async (payload) => {
 			if (payload.app === app && payload.inspectorId === INSPECTOR_ID) {
 				const instance = getComponentInstance(activeAppRecord.value, payload.instanceId);
-				if (instance) {
-					const walker$1 = new ComponentWalker({
-						filterText: payload.filter,
-						maxDepth: 100,
-						recursively: false,
-						api
-					});
-					payload.rootNodes = await walker$1.getComponentTree(instance);
-				}
+				if (instance) payload.rootNodes = await new ComponentWalker({
+					filterText: payload.filter,
+					maxDepth: 100,
+					recursively: false,
+					api
+				}).getComponentTree(instance);
 			}
 		});
 		api.on.getInspectorState(async (payload) => {
@@ -4169,15 +4151,13 @@ function initDevTools() {
 		callDevToolsPluginSetupFn([pluginDescriptor, setupFn], app);
 	});
 	onLegacyDevToolsPluginApiAvailable(() => {
-		const normalizedPluginBuffer = devtoolsPluginBuffer.filter(([item]) => item.id !== "components");
-		normalizedPluginBuffer.forEach(([pluginDescriptor, setupFn]) => {
+		devtoolsPluginBuffer.filter(([item]) => item.id !== "components").forEach(([pluginDescriptor, setupFn]) => {
 			_devtoolsHook.emit(DevToolsHooks.SETUP_DEVTOOLS_PLUGIN, pluginDescriptor, setupFn, { target: "legacy" });
 		});
 	});
 	hook.on.vueAppInit(async (app, version, types) => {
-		const appRecord = createAppRecord(app, types);
 		const normalizedAppRecord = {
-			...appRecord,
+			...createAppRecord(app, types),
 			app,
 			version
 		};
@@ -4257,7 +4237,7 @@ function reviveMap(val) {
 	return result;
 }
 function revive(val) {
-	if (val === UNDEFINED) return void 0;
+	if (val === UNDEFINED) return;
 	else if (val === INFINITY) return Number.POSITIVE_INFINITY;
 	else if (val === NEGATIVE_INFINITY) return Number.NEGATIVE_INFINITY;
 	else if (val === NAN) return NaN;
@@ -4306,10 +4286,8 @@ function formatInspectorStateValue(value, quotes = false, options) {
 	const type = getInspectorStateValueType(value, false);
 	if (type !== "custom" && value?._custom) value = value._custom.value;
 	if (result = internalStateTokenToString(value)) return result;
-	else if (type === "custom") {
-		const nestedName = value._custom.value?._custom && formatInspectorStateValue(value._custom.value, quotes, options);
-		return nestedName || value._custom.displayText || value._custom.display;
-	} else if (type === "array") return `Array[${value.length}]`;
+	else if (type === "custom") return value._custom.value?._custom && formatInspectorStateValue(value._custom.value, quotes, options) || value._custom.displayText || value._custom.display;
+	else if (type === "array") return `Array[${value.length}]`;
 	else if (type === "plain-object") return `Object${Object.keys(value).length ? "" : " (empty)"}`;
 	else if (type?.includes("native")) return escape(specialTypeRE.exec(value)?.[2]);
 	else if (typeof value === "string") {
@@ -4450,7 +4428,6 @@ function find(record, predicate) {
 		const value = valuesNotNever[i];
 		if (predicate(value)) return value;
 	}
-	return void 0;
 }
 function forEach(record, run) {
 	Object.entries(record).forEach(([key, value]) => run(value, key));
@@ -4463,7 +4440,6 @@ function findArr(record, predicate) {
 		const value = record[i];
 		if (predicate(value)) return value;
 	}
-	return void 0;
 }
 
 //#endregion
@@ -4521,14 +4497,12 @@ const parsePath = (string) => {
 	let segment = "";
 	for (let i = 0; i < string.length; i++) {
 		let char = string.charAt(i);
-		const isEscapedDot = char === "\\" && string.charAt(i + 1) === ".";
-		if (isEscapedDot) {
+		if (char === "\\" && string.charAt(i + 1) === ".") {
 			segment += ".";
 			i++;
 			continue;
 		}
-		const isEndOfSegment = char === ".";
-		if (isEndOfSegment) {
+		if (char === ".") {
 			result.push(segment);
 			segment = "";
 			continue;
@@ -4602,14 +4576,10 @@ function compositeTransformation(isApplicable, annotation, transform, untransfor
 	};
 }
 const symbolRule = compositeTransformation((s, superJson) => {
-	if (isSymbol(s)) {
-		const isRegistered = !!superJson.symbolRegistry.getIdentifier(s);
-		return isRegistered;
-	}
+	if (isSymbol(s)) return !!superJson.symbolRegistry.getIdentifier(s);
 	return false;
 }, (s, superJson) => {
-	const identifier = superJson.symbolRegistry.getIdentifier(s);
-	return ["symbol", identifier];
+	return ["symbol", superJson.symbolRegistry.getIdentifier(s)];
 }, (v) => v.description, (_, a, superJson) => {
 	const value = superJson.symbolRegistry.getValue(a[1]);
 	if (!value) throw new Error("Trying to deserialize unknown symbol");
@@ -4635,15 +4605,11 @@ const typedArrayRule = compositeTransformation(isTypedArray, (v) => ["typed-arra
 	return new ctor(v);
 });
 function isInstanceOfRegisteredClass(potentialClass, superJson) {
-	if (potentialClass?.constructor) {
-		const isRegistered = !!superJson.classRegistry.getIdentifier(potentialClass.constructor);
-		return isRegistered;
-	}
+	if (potentialClass?.constructor) return !!superJson.classRegistry.getIdentifier(potentialClass.constructor);
 	return false;
 }
 const classRule = compositeTransformation(isInstanceOfRegisteredClass, (clazz, superJson) => {
-	const identifier = superJson.classRegistry.getIdentifier(clazz.constructor);
-	return ["class", identifier];
+	return ["class", superJson.classRegistry.getIdentifier(clazz.constructor)];
 }, (clazz, superJson) => {
 	const allowedProps = superJson.classRegistry.getAllowedProps(clazz.constructor);
 	if (!allowedProps) return { ...clazz };
@@ -4660,11 +4626,9 @@ const classRule = compositeTransformation(isInstanceOfRegisteredClass, (clazz, s
 const customRule = compositeTransformation((value, superJson) => {
 	return !!superJson.customTransformerRegistry.findApplicable(value);
 }, (value, superJson) => {
-	const transformer = superJson.customTransformerRegistry.findApplicable(value);
-	return ["custom", transformer.name];
+	return ["custom", superJson.customTransformerRegistry.findApplicable(value).name];
 }, (value, superJson) => {
-	const transformer = superJson.customTransformerRegistry.findApplicable(value);
-	return transformer.serialize(value);
+	return superJson.customTransformerRegistry.findApplicable(value).serialize(value);
 }, (v, a, superJson) => {
 	const transformer = superJson.customTransformerRegistry.findByName(a[1]);
 	if (!transformer) throw new Error("Trying to deserialize unknown custom value");
@@ -4687,7 +4651,6 @@ const transformValue = (value, superJson) => {
 		value: applicableSimpleRule.transform(value, superJson),
 		type: applicableSimpleRule.annotation
 	};
-	return void 0;
 };
 const simpleRulesByAnnotation = {};
 simpleRules.forEach((rule) => {
@@ -4759,8 +4722,7 @@ const setDeep = (object, path, mapper) => {
 			const row = +key;
 			parent = getNthKey(parent, row);
 		} else if (isMap(parent)) {
-			const isEnd = i === path.length - 2;
-			if (isEnd) break;
+			if (i === path.length - 2) break;
 			const row = +key;
 			const type = +path[++i] === 0 ? "key" : "value";
 			const keyOfRow = getNthKey(parent, row);
@@ -4788,8 +4750,7 @@ const setDeep = (object, path, mapper) => {
 	if (isMap(parent)) {
 		const row = +path[path.length - 2];
 		const keyToRow = getNthKey(parent, row);
-		const type = +lastKey === 0 ? "key" : "value";
-		switch (type) {
+		switch (+lastKey === 0 ? "key" : "value") {
 			case "key": {
 				const newKey = mapper(keyToRow);
 				parent.set(newKey, parent.get(keyToRow));
@@ -5276,8 +5237,7 @@ function createIframeServerChannel() {
 	};
 	return {
 		post: (data) => {
-			const iframe = getIframeServerContext();
-			iframe?.contentWindow?.postMessage(SuperJSON.stringify({
+			getIframeServerContext()?.contentWindow?.postMessage(SuperJSON.stringify({
 				event: __DEVTOOLS_KIT_IFRAME_MESSAGING_EVENT_KEY,
 				data
 			}), "*");
@@ -5479,11 +5439,10 @@ function getDateDetails(val) {
 	} };
 }
 function getMapDetails(val) {
-	const list = Object.fromEntries(val);
 	return { _custom: {
 		type: "map",
 		displayText: "Map",
-		value: list,
+		value: Object.fromEntries(val),
 		readOnly: true,
 		fields: { abstract: true }
 	} };
@@ -5605,8 +5564,7 @@ function tryGetRefValue(ref) {
 }
 function getObjectDetails(object) {
 	const info = getSetupStateType(object);
-	const isState = info.ref || info.computed || info.reactive;
-	if (isState) {
+	if (info.ref || info.computed || info.reactive) {
 		const stateTypeName = info.computed ? "Computed" : info.ref ? "Ref" : info.reactive ? "Reactive" : null;
 		const value = toRaw(info.reactive ? object : tryGetRefValue(object));
 		const raw = ensurePropertyExists(object, "effect") ? object.effect?.raw?.toString() || object.effect?.fn?.toString() : null;
@@ -5788,8 +5746,7 @@ function stringifyStrictCircularAutoChunks(data, replacer = null, space = null)
 }
 function parseCircularAutoChunks(data, reviver$1 = null) {
 	if (Array.isArray(data)) data = data.join("");
-	const hasCircular = /^\s/.test(data);
-	if (!hasCircular) return arguments.length === 1 ? JSON.parse(data) : JSON.parse(data, reviver$1);
+	if (!/^\s/.test(data)) return arguments.length === 1 ? JSON.parse(data) : JSON.parse(data, reviver$1);
 	else {
 		const list = JSON.parse(data);
 		decode(list, reviver$1);

package/dist/index.d.cts

@@ -244,8 +244,16 @@ interface DevToolsState {
   perfUniqueGroupId: number;
   timelineLayersState: Record<string, boolean>;
 }
-declare const callStateUpdatedHook: (state: DevToolsState) => Promise<void>;
-declare const callConnectedUpdatedHook: (state: DevToolsState, oldState: DevToolsState) => Promise<void>;
+declare const callStateUpdatedHook: ((state: DevToolsState) => Promise<void>) & {
+  cancel: () => void;
+  flush: () => Promise<void> | undefined;
+  isPending: () => boolean;
+};
+declare const callConnectedUpdatedHook: ((state: DevToolsState, oldState: DevToolsState) => Promise<void>) & {
+  cancel: () => void;
+  flush: () => Promise<void> | undefined;
+  isPending: () => boolean;
+};
 declare const devtoolsAppRecords: DevToolsAppRecords[] & {
   value: DevToolsAppRecords[];
 };
@@ -554,7 +562,11 @@ interface DevToolsKitInspector {
   appRecord: unknown;
 }
 declare const devtoolsInspector: DevToolsKitInspector[];
-declare const callInspectorUpdatedHook: () => Promise<void>;
+declare const callInspectorUpdatedHook: (() => Promise<void>) & {
+  cancel: () => void;
+  flush: () => Promise<void> | undefined;
+  isPending: () => boolean;
+};
 declare function addInspector(inspector: CustomInspectorOptions, descriptor: PluginDescriptor): void;
 declare function getActiveInspectors(): {
   id: string;

package/dist/index.d.ts

@@ -244,8 +244,16 @@ interface DevToolsState {
   perfUniqueGroupId: number;
   timelineLayersState: Record<string, boolean>;
 }
-declare const callStateUpdatedHook: (state: DevToolsState) => Promise<void>;
-declare const callConnectedUpdatedHook: (state: DevToolsState, oldState: DevToolsState) => Promise<void>;
+declare const callStateUpdatedHook: ((state: DevToolsState) => Promise<void>) & {
+  cancel: () => void;
+  flush: () => Promise<void> | undefined;
+  isPending: () => boolean;
+};
+declare const callConnectedUpdatedHook: ((state: DevToolsState, oldState: DevToolsState) => Promise<void>) & {
+  cancel: () => void;
+  flush: () => Promise<void> | undefined;
+  isPending: () => boolean;
+};
 declare const devtoolsAppRecords: DevToolsAppRecords[] & {
   value: DevToolsAppRecords[];
 };
@@ -554,7 +562,11 @@ interface DevToolsKitInspector {
   appRecord: unknown;
 }
 declare const devtoolsInspector: DevToolsKitInspector[];
-declare const callInspectorUpdatedHook: () => Promise<void>;
+declare const callInspectorUpdatedHook: (() => Promise<void>) & {
+  cancel: () => void;
+  flush: () => Promise<void> | undefined;
+  isPending: () => boolean;
+};
 declare function addInspector(inspector: CustomInspectorOptions, descriptor: PluginDescriptor): void;
 declare function getActiveInspectors(): {
   id: string;

package/dist/index.js

@@ -127,8 +127,7 @@ function returnError(cb) {
 }
 function getComponentInstance(appRecord, instanceId) {
 	instanceId = instanceId || `${appRecord.id}:root`;
-	const instance = appRecord.instanceMap.get(instanceId);
-	return instance || appRecord.instanceMap.get(":root");
+	return appRecord.instanceMap.get(instanceId) || appRecord.instanceMap.get(":root");
 }
 function ensurePropertyExists(obj, key, skipObjCheck = false) {
 	return skipObjCheck ? key in obj : typeof obj === "object" && obj !== null ? key in obj : false;
@@ -317,8 +316,7 @@ function highlight(instance) {
 	const bounds = getComponentBoundingRect(instance);
 	if (!bounds.width && !bounds.height) return;
 	const name = getInstanceName(instance);
-	const container = getContainerElement();
-	container ? update({
+	getContainerElement() ? update({
 		bounds,
 		name
 	}) : create({
@@ -337,12 +335,10 @@ function inspectFn(e) {
 		const instance = target$1.__vueParentComponent;
 		if (instance) {
 			inspectInstance = instance;
-			const el = instance.vnode.el;
-			if (el) {
+			if (instance.vnode.el) {
 				const bounds = getComponentBoundingRect(instance);
 				const name = getInstanceName(instance);
-				const container = getContainerElement();
-				container ? update({
+				getContainerElement() ? update({
 					bounds,
 					name
 				}) : create({
@@ -515,7 +511,9 @@ const Fragment = Symbol.for("v-fgt");
 //#endregion
 //#region src/core/component/state/editor.ts
 var StateEditor = class {
-	refEditor = new RefStateEditor();
+	constructor() {
+		this.refEditor = new RefStateEditor();
+	}
 	set(object, path, value, cb) {
 		const sections = Array.isArray(path) ? path : path.split(".");
 		while (sections.length > 1) {
@@ -733,12 +731,10 @@ function getInspector(id, app) {
 	return devtoolsInspector.find((inspector) => inspector.options.id === id && (app ? inspector.descriptor.app === app : true));
 }
 function getInspectorActions(id) {
-	const inspector = getInspector(id);
-	return inspector?.options.actions;
+	return getInspector(id)?.options.actions;
 }
 function getInspectorNodeActions(id) {
-	const inspector = getInspector(id);
-	return inspector?.options.nodeActions;
+	return getInspector(id)?.options.nodeActions;
 }
 
 //#endregion
@@ -842,13 +838,12 @@ function createDevToolsCtxHooks() {
 		addTimelineLayer(options, plugin.descriptor);
 	});
 	hooks$1.hook(DevToolsContextHookKeys.TIMELINE_EVENT_ADDED, ({ options, plugin }) => {
-		const internalLayerIds = [
+		if (devtoolsState.highPerfModeEnabled || !devtoolsState.timelineLayersState?.[plugin.descriptor.id] && ![
 			"performance",
 			"component-event",
 			"keyboard",
 			"mouse"
-		];
-		if (devtoolsState.highPerfModeEnabled || !devtoolsState.timelineLayersState?.[plugin.descriptor.id] && !internalLayerIds.includes(options.layerId)) return;
+		].includes(options.layerId)) return;
 		hooks$1.callHookWith(async (callbacks) => {
 			await Promise.all(callbacks.map((cb) => cb(options)));
 		}, DevToolsMessagingHookKeys.SEND_TIMELINE_EVENT_TO_CLIENT);
@@ -857,16 +852,13 @@ function createDevToolsCtxHooks() {
 		const appRecord = app.__VUE_DEVTOOLS_NEXT_APP_RECORD__;
 		if (!appRecord) return null;
 		const appId = appRecord.id.toString();
-		const instances = [...appRecord.instanceMap].filter(([key]) => key.split(":")[0] === appId).map(([, instance]) => instance);
-		return instances;
+		return [...appRecord.instanceMap].filter(([key]) => key.split(":")[0] === appId).map(([, instance]) => instance);
 	});
 	hooks$1.hook(DevToolsContextHookKeys.GET_COMPONENT_BOUNDS, async ({ instance }) => {
-		const bounds = getComponentBoundingRect(instance);
-		return bounds;
+		return getComponentBoundingRect(instance);
 	});
 	hooks$1.hook(DevToolsContextHookKeys.GET_COMPONENT_NAME, ({ instance }) => {
-		const name = getInstanceName(instance);
-		return name;
+		return getInstanceName(instance);
 	});
 	hooks$1.hook(DevToolsContextHookKeys.COMPONENT_HIGHLIGHT, ({ uid }) => {
 		const instance = activeAppRecord.value.instanceMap.get(uid);
@@ -1075,8 +1067,7 @@ function getPluginLocalKey(pluginId) {
 	return `__VUE_DEVTOOLS_NEXT_PLUGIN_SETTINGS__${pluginId}__`;
 }
 function getPluginSettingsOptions(pluginId) {
-	const item = devtoolsPluginBuffer.find((item$1) => item$1[0].id === pluginId && !!item$1[0]?.settings)?.[0] ?? null;
-	return item?.settings ?? null;
+	return (devtoolsPluginBuffer.find((item) => item[0].id === pluginId && !!item[0]?.settings)?.[0] ?? null)?.settings ?? null;
 }
 function getPluginSettings(pluginId, fallbackValue) {
 	const localKey = getPluginLocalKey(pluginId);
@@ -1092,8 +1083,7 @@ function getPluginSettings(pluginId, fallbackValue) {
 }
 function initPluginSettings(pluginId, settings) {
 	const localKey = getPluginLocalKey(pluginId);
-	const localSettings = localStorage.getItem(localKey);
-	if (!localSettings) localStorage.setItem(localKey, JSON.stringify(_getSettings(settings)));
+	if (!localStorage.getItem(localKey)) localStorage.setItem(localKey, JSON.stringify(_getSettings(settings)));
 }
 function setPluginSettings(pluginId, key, value) {
 	const localKey = getPluginLocalKey(pluginId);
@@ -1251,8 +1241,6 @@ const hook = {
 //#endregion
 //#region src/api/v6/index.ts
 var DevToolsV6PluginAPI = class {
-	plugin;
-	hooks;
 	constructor({ plugin, ctx }) {
 		this.hooks = ctx.hooks;
 		this.plugin = plugin;
@@ -1653,11 +1641,10 @@ function processSetupState(instance) {
 				editable: isState && !info.readonly
 			};
 		}
-		const type = isOtherType ? "setup (other)" : "setup";
 		return {
 			key,
 			value,
-			type,
+			type: isOtherType ? "setup (other)" : "setup",
 			...result
 		};
 	});
@@ -1778,7 +1765,6 @@ function getInstanceState(params) {
 //#endregion
 //#region src/core/component/tree/filter.ts
 var ComponentFilter = class {
-	filter;
 	constructor(filter) {
 		this.filter = filter || "";
 	}
@@ -1800,12 +1786,8 @@ function createComponentFilter(filterText) {
 //#endregion
 //#region src/core/component/tree/walker.ts
 var ComponentWalker = class {
-	maxDepth;
-	recursively;
-	componentFilter;
-	api;
-	captureIds = /* @__PURE__ */ new Map();
 	constructor(options) {
+		this.captureIds = /* @__PURE__ */ new Map();
 		const { filterText = "", maxDepth, recursively, api } = options;
 		this.componentFilter = createComponentFilter(filterText);
 		this.maxDepth = maxDepth;
@@ -1877,8 +1859,7 @@ var ComponentWalker = class {
 				if (node) treeNode.children.push(node);
 			}
 		}
-		const rootElements = getRootElementsFromComponentInstance(instance);
-		const firstElement = rootElements[0];
+		const firstElement = getRootElementsFromComponentInstance(instance)[0];
 		if (firstElement?.parentElement) {
 			const parentInstance = instance.parent;
 			const parentRootElements = parentInstance ? getRootElementsFromComponentInstance(parentInstance) : [];
@@ -2199,15 +2180,12 @@ function createComponentsDevToolsPlugin(app) {
 		api.on.getInspectorTree(async (payload) => {
 			if (payload.app === app && payload.inspectorId === INSPECTOR_ID) {
 				const instance = getComponentInstance(activeAppRecord.value, payload.instanceId);
-				if (instance) {
-					const walker$1 = new ComponentWalker({
-						filterText: payload.filter,
-						maxDepth: 100,
-						recursively: false,
-						api
-					});
-					payload.rootNodes = await walker$1.getComponentTree(instance);
-				}
+				if (instance) payload.rootNodes = await new ComponentWalker({
+					filterText: payload.filter,
+					maxDepth: 100,
+					recursively: false,
+					api
+				}).getComponentTree(instance);
 			}
 		});
 		api.on.getInspectorState(async (payload) => {
@@ -4169,15 +4147,13 @@ function initDevTools() {
 		callDevToolsPluginSetupFn([pluginDescriptor, setupFn], app);
 	});
 	onLegacyDevToolsPluginApiAvailable(() => {
-		const normalizedPluginBuffer = devtoolsPluginBuffer.filter(([item]) => item.id !== "components");
-		normalizedPluginBuffer.forEach(([pluginDescriptor, setupFn]) => {
+		devtoolsPluginBuffer.filter(([item]) => item.id !== "components").forEach(([pluginDescriptor, setupFn]) => {
 			_devtoolsHook.emit(DevToolsHooks.SETUP_DEVTOOLS_PLUGIN, pluginDescriptor, setupFn, { target: "legacy" });
 		});
 	});
 	hook.on.vueAppInit(async (app, version, types) => {
-		const appRecord = createAppRecord(app, types);
 		const normalizedAppRecord = {
-			...appRecord,
+			...createAppRecord(app, types),
 			app,
 			version
 		};
@@ -4257,7 +4233,7 @@ function reviveMap(val) {
 	return result;
 }
 function revive(val) {
-	if (val === UNDEFINED) return void 0;
+	if (val === UNDEFINED) return;
 	else if (val === INFINITY) return Number.POSITIVE_INFINITY;
 	else if (val === NEGATIVE_INFINITY) return Number.NEGATIVE_INFINITY;
 	else if (val === NAN) return NaN;
@@ -4306,10 +4282,8 @@ function formatInspectorStateValue(value, quotes = false, options) {
 	const type = getInspectorStateValueType(value, false);
 	if (type !== "custom" && value?._custom) value = value._custom.value;
 	if (result = internalStateTokenToString(value)) return result;
-	else if (type === "custom") {
-		const nestedName = value._custom.value?._custom && formatInspectorStateValue(value._custom.value, quotes, options);
-		return nestedName || value._custom.displayText || value._custom.display;
-	} else if (type === "array") return `Array[${value.length}]`;
+	else if (type === "custom") return value._custom.value?._custom && formatInspectorStateValue(value._custom.value, quotes, options) || value._custom.displayText || value._custom.display;
+	else if (type === "array") return `Array[${value.length}]`;
 	else if (type === "plain-object") return `Object${Object.keys(value).length ? "" : " (empty)"}`;
 	else if (type?.includes("native")) return escape(specialTypeRE.exec(value)?.[2]);
 	else if (typeof value === "string") {
@@ -4450,7 +4424,6 @@ function find(record, predicate) {
 		const value = valuesNotNever[i];
 		if (predicate(value)) return value;
 	}
-	return void 0;
 }
 function forEach(record, run) {
 	Object.entries(record).forEach(([key, value]) => run(value, key));
@@ -4463,7 +4436,6 @@ function findArr(record, predicate) {
 		const value = record[i];
 		if (predicate(value)) return value;
 	}
-	return void 0;
 }
 
 //#endregion
@@ -4521,14 +4493,12 @@ const parsePath = (string) => {
 	let segment = "";
 	for (let i = 0; i < string.length; i++) {
 		let char = string.charAt(i);
-		const isEscapedDot = char === "\\" && string.charAt(i + 1) === ".";
-		if (isEscapedDot) {
+		if (char === "\\" && string.charAt(i + 1) === ".") {
 			segment += ".";
 			i++;
 			continue;
 		}
-		const isEndOfSegment = char === ".";
-		if (isEndOfSegment) {
+		if (char === ".") {
 			result.push(segment);
 			segment = "";
 			continue;
@@ -4602,14 +4572,10 @@ function compositeTransformation(isApplicable, annotation, transform, untransfor
 	};
 }
 const symbolRule = compositeTransformation((s, superJson) => {
-	if (isSymbol(s)) {
-		const isRegistered = !!superJson.symbolRegistry.getIdentifier(s);
-		return isRegistered;
-	}
+	if (isSymbol(s)) return !!superJson.symbolRegistry.getIdentifier(s);
 	return false;
 }, (s, superJson) => {
-	const identifier = superJson.symbolRegistry.getIdentifier(s);
-	return ["symbol", identifier];
+	return ["symbol", superJson.symbolRegistry.getIdentifier(s)];
 }, (v) => v.description, (_, a, superJson) => {
 	const value = superJson.symbolRegistry.getValue(a[1]);
 	if (!value) throw new Error("Trying to deserialize unknown symbol");
@@ -4635,15 +4601,11 @@ const typedArrayRule = compositeTransformation(isTypedArray, (v) => ["typed-arra
 	return new ctor(v);
 });
 function isInstanceOfRegisteredClass(potentialClass, superJson) {
-	if (potentialClass?.constructor) {
-		const isRegistered = !!superJson.classRegistry.getIdentifier(potentialClass.constructor);
-		return isRegistered;
-	}
+	if (potentialClass?.constructor) return !!superJson.classRegistry.getIdentifier(potentialClass.constructor);
 	return false;
 }
 const classRule = compositeTransformation(isInstanceOfRegisteredClass, (clazz, superJson) => {
-	const identifier = superJson.classRegistry.getIdentifier(clazz.constructor);
-	return ["class", identifier];
+	return ["class", superJson.classRegistry.getIdentifier(clazz.constructor)];
 }, (clazz, superJson) => {
 	const allowedProps = superJson.classRegistry.getAllowedProps(clazz.constructor);
 	if (!allowedProps) return { ...clazz };
@@ -4660,11 +4622,9 @@ const classRule = compositeTransformation(isInstanceOfRegisteredClass, (clazz, s
 const customRule = compositeTransformation((value, superJson) => {
 	return !!superJson.customTransformerRegistry.findApplicable(value);
 }, (value, superJson) => {
-	const transformer = superJson.customTransformerRegistry.findApplicable(value);
-	return ["custom", transformer.name];
+	return ["custom", superJson.customTransformerRegistry.findApplicable(value).name];
 }, (value, superJson) => {
-	const transformer = superJson.customTransformerRegistry.findApplicable(value);
-	return transformer.serialize(value);
+	return superJson.customTransformerRegistry.findApplicable(value).serialize(value);
 }, (v, a, superJson) => {
 	const transformer = superJson.customTransformerRegistry.findByName(a[1]);
 	if (!transformer) throw new Error("Trying to deserialize unknown custom value");
@@ -4687,7 +4647,6 @@ const transformValue = (value, superJson) => {
 		value: applicableSimpleRule.transform(value, superJson),
 		type: applicableSimpleRule.annotation
 	};
-	return void 0;
 };
 const simpleRulesByAnnotation = {};
 simpleRules.forEach((rule) => {
@@ -4759,8 +4718,7 @@ const setDeep = (object, path, mapper) => {
 			const row = +key;
 			parent = getNthKey(parent, row);
 		} else if (isMap(parent)) {
-			const isEnd = i === path.length - 2;
-			if (isEnd) break;
+			if (i === path.length - 2) break;
 			const row = +key;
 			const type = +path[++i] === 0 ? "key" : "value";
 			const keyOfRow = getNthKey(parent, row);
@@ -4788,8 +4746,7 @@ const setDeep = (object, path, mapper) => {
 	if (isMap(parent)) {
 		const row = +path[path.length - 2];
 		const keyToRow = getNthKey(parent, row);
-		const type = +lastKey === 0 ? "key" : "value";
-		switch (type) {
+		switch (+lastKey === 0 ? "key" : "value") {
 			case "key": {
 				const newKey = mapper(keyToRow);
 				parent.set(newKey, parent.get(keyToRow));
@@ -5276,8 +5233,7 @@ function createIframeServerChannel() {
 	};
 	return {
 		post: (data) => {
-			const iframe = getIframeServerContext();
-			iframe?.contentWindow?.postMessage(SuperJSON.stringify({
+			getIframeServerContext()?.contentWindow?.postMessage(SuperJSON.stringify({
 				event: __DEVTOOLS_KIT_IFRAME_MESSAGING_EVENT_KEY,
 				data
 			}), "*");
@@ -5479,11 +5435,10 @@ function getDateDetails(val) {
 	} };
 }
 function getMapDetails(val) {
-	const list = Object.fromEntries(val);
 	return { _custom: {
 		type: "map",
 		displayText: "Map",
-		value: list,
+		value: Object.fromEntries(val),
 		readOnly: true,
 		fields: { abstract: true }
 	} };
@@ -5605,8 +5560,7 @@ function tryGetRefValue(ref) {
 }
 function getObjectDetails(object) {
 	const info = getSetupStateType(object);
-	const isState = info.ref || info.computed || info.reactive;
-	if (isState) {
+	if (info.ref || info.computed || info.reactive) {
 		const stateTypeName = info.computed ? "Computed" : info.ref ? "Ref" : info.reactive ? "Reactive" : null;
 		const value = toRaw(info.reactive ? object : tryGetRefValue(object));
 		const raw = ensurePropertyExists(object, "effect") ? object.effect?.raw?.toString() || object.effect?.fn?.toString() : null;
@@ -5788,8 +5742,7 @@ function stringifyStrictCircularAutoChunks(data, replacer = null, space = null)
 }
 function parseCircularAutoChunks(data, reviver$1 = null) {
 	if (Array.isArray(data)) data = data.join("");
-	const hasCircular = /^\s/.test(data);
-	if (!hasCircular) return arguments.length === 1 ? JSON.parse(data) : JSON.parse(data, reviver$1);
+	if (!/^\s/.test(data)) return arguments.length === 1 ? JSON.parse(data) : JSON.parse(data, reviver$1);
 	else {
 		const list = JSON.parse(data);
 		decode(list, reviver$1);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vue/devtools-kit",
   "type": "module",
-  "version": "8.0.1",
+  "version": "8.0.2",
   "author": "webfansplz",
   "license": "MIT",
   "repository": {
@@ -26,14 +26,14 @@
     "birpc": "^2.5.0",
     "hookable": "^5.5.3",
     "mitt": "^3.0.1",
-    "perfect-debounce": "^1.0.0",
+    "perfect-debounce": "^2.0.0",
     "speakingurl": "^14.0.1",
     "superjson": "^2.2.2",
-    "@vue/devtools-shared": "^8.0.1"
+    "@vue/devtools-shared": "^8.0.2"
   },
   "devDependencies": {
     "@types/speakingurl": "^13.0.6",
-    "vue": "^3.5.18",
+    "vue": "^3.5.21",
     "vue-router": "^4.5.1"
   },
   "scripts": {