@vue/devtools-kit 7.6.2 → 7.6.4

package/dist/index.cjs

@@ -33,9 +33,9 @@ var __toESM = (mod, isNodeMode, target22) => (target22 = mod != null ? __create(
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// ../../node_modules/.pnpm/tsup@8.3.0_@microsoft+api-extractor@7.43.0_@types+node@20.16.14__@swc+core@1.5.29_jiti@2.0.0__utvtwgyeu6xd57udthcnogp47u/node_modules/tsup/assets/cjs_shims.js
+// ../../node_modules/.pnpm/tsup@8.3.5_@microsoft+api-extractor@7.43.0_@types+node@22.9.0__@swc+core@1.5.29_jiti@2.0.0_po_lnt5yfvawfblpk67opvcdwbq7u/node_modules/tsup/assets/cjs_shims.js
 var init_cjs_shims = __esm({
-  "../../node_modules/.pnpm/tsup@8.3.0_@microsoft+api-extractor@7.43.0_@types+node@20.16.14__@swc+core@1.5.29_jiti@2.0.0__utvtwgyeu6xd57udthcnogp47u/node_modules/tsup/assets/cjs_shims.js"() {
+  "../../node_modules/.pnpm/tsup@8.3.5_@microsoft+api-extractor@7.43.0_@types+node@22.9.0__@swc+core@1.5.29_jiti@2.0.0_po_lnt5yfvawfblpk67opvcdwbq7u/node_modules/tsup/assets/cjs_shims.js"() {
     "use strict";
   }
 });
@@ -1954,10 +1954,15 @@ async function editComponentState(payload, stateEditor2) {
     return;
   const targetPath = path.slice();
   let target22;
-  if (instance.devtoolsRawSetupState && Object.keys(instance.devtoolsRawSetupState).includes(path[0]))
+  if (Object.keys(instance.props).includes(path[0])) {
+    target22 = instance.props;
+  } else if (instance.devtoolsRawSetupState && Object.keys(instance.devtoolsRawSetupState).includes(path[0])) {
     target22 = instance.devtoolsRawSetupState;
-  if (instance.data && Object.keys(instance.data).includes(path[0]))
+  } else if (instance.data && Object.keys(instance.data).includes(path[0])) {
     target22 = instance.data;
+  } else {
+    target22 = instance.proxy;
+  }
   if (target22 && targetPath) {
     if (state.type === "object" && type === "reactive") {
     }
@@ -2176,6 +2181,8 @@ function update(options) {
 }
 function highlight(instance) {
   const bounds = getComponentBoundingRect(instance);
+  if (!bounds.width && !bounds.height)
+    return;
   const name = getInstanceName(instance);
   const container = getContainerElement();
   container ? update({ bounds, name }) : create({ bounds, name });
@@ -3122,6 +3129,9 @@ var DevToolsV6PluginAPI = class {
   // component inspector
   notifyComponentUpdate(instance) {
     var _a25;
+    if (devtoolsState.highPerfModeEnabled) {
+      return;
+    }
     const inspector = getActiveInspectors().find((i) => i.packageName === this.plugin.descriptor.packageName);
     if (inspector == null ? void 0 : inspector.id) {
       if (instance) {
@@ -3146,9 +3156,15 @@ var DevToolsV6PluginAPI = class {
     }
   }
   sendInspectorTree(inspectorId) {
+    if (devtoolsState.highPerfModeEnabled) {
+      return;
+    }
     this.hooks.callHook("sendInspectorTree" /* SEND_INSPECTOR_TREE */, { inspectorId, plugin: this.plugin });
   }
   sendInspectorState(inspectorId) {
+    if (devtoolsState.highPerfModeEnabled) {
+      return;
+    }
     this.hooks.callHook("sendInspectorState" /* SEND_INSPECTOR_STATE */, { inspectorId, plugin: this.plugin });
   }
   selectInspectorNode(inspectorId, nodeId) {
@@ -3159,12 +3175,18 @@ var DevToolsV6PluginAPI = class {
   }
   // timeline
   now() {
+    if (devtoolsState.highPerfModeEnabled) {
+      return 0;
+    }
     return Date.now();
   }
   addTimelineLayer(options) {
     this.hooks.callHook("timelineLayerAdded" /* TIMELINE_LAYER_ADDED */, { options, plugin: this.plugin });
   }
   addTimelineEvent(options) {
+    if (devtoolsState.highPerfModeEnabled) {
+      return;
+    }
     this.hooks.callHook("timelineEventAdded" /* TIMELINE_EVENT_ADDED */, { options, plugin: this.plugin });
   }
   // settings
@@ -3408,15 +3430,17 @@ function resolveMergedOptions(instance) {
   return options;
 }
 function processProps(instance) {
+  var _a25;
   const props = [];
-  const propDefinitions = instance.type.props;
-  for (const key in instance.props) {
+  const propDefinitions = (_a25 = instance == null ? void 0 : instance.type) == null ? void 0 : _a25.props;
+  for (const key in instance == null ? void 0 : instance.props) {
     const propDefinition = propDefinitions ? propDefinitions[key] : null;
     const camelizeKey = (0, import_devtools_shared11.camelize)(key);
     props.push({
       type: "props",
       key: camelizeKey,
       value: returnError(() => instance.props[key]),
+      editable: true,
       meta: propDefinition ? {
         type: propDefinition.type ? getPropType(propDefinition.type) : "any",
         required: !!propDefinition.required,
@@ -3430,7 +3454,7 @@ function processProps(instance) {
 }
 function processState(instance) {
   const type = instance.type;
-  const props = type.props;
+  const props = type == null ? void 0 : type.props;
   const getters = type.vuex && type.vuex.getters;
   const computedDefs = type.computed;
   const data = {
@@ -4229,7 +4253,7 @@ function removeRegisteredPluginApp(app) {
   import_devtools_shared14.target.__VUE_DEVTOOLS_KIT__REGISTERED_PLUGIN_APPS__.delete(app);
 }
 function registerDevToolsPlugin(app) {
-  if (import_devtools_shared14.target.__VUE_DEVTOOLS_KIT__REGISTERED_PLUGIN_APPS__.has(app))
+  if (import_devtools_shared14.target.__VUE_DEVTOOLS_KIT__REGISTERED_PLUGIN_APPS__.has(app) || devtoolsState.highPerfModeEnabled)
     return;
   import_devtools_shared14.target.__VUE_DEVTOOLS_KIT__REGISTERED_PLUGIN_APPS__.add(app);
   devtoolsPluginBuffer.forEach((plugin) => {
@@ -4654,6 +4678,9 @@ function onDevToolsClientConnected(fn) {
 init_cjs_shims();
 function toggleHighPerfMode(state) {
   devtoolsState.highPerfModeEnabled = state != null ? state : !devtoolsState.highPerfModeEnabled;
+  if (!state && activeAppRecord.value) {
+    registerDevToolsPlugin(activeAppRecord.value.app);
+  }
 }
 
 // src/core/component/state/format.ts
@@ -6190,7 +6217,7 @@ function getFunctionDetails(func) {
   return {
     _custom: {
       type: "function",
-      displayText: `<span style="opacity:.5;margin-right:5px;">function</span> <span style="white-space:nowrap;">${escape(name)}${args}</span>`,
+      displayText: `<span style="opacity:.8;margin-right:5px;">function</span> <span style="white-space:nowrap;">${escape(name)}${args}</span>`,
       tooltipText: string.trim() ? `<pre>${string}</pre>` : null
     }
   };

package/dist/index.js

@@ -27,9 +27,9 @@ var __toESM = (mod, isNodeMode, target22) => (target22 = mod != null ? __create(
   mod
 ));
 
-// ../../node_modules/.pnpm/tsup@8.3.0_@microsoft+api-extractor@7.43.0_@types+node@20.16.14__@swc+core@1.5.29_jiti@2.0.0__utvtwgyeu6xd57udthcnogp47u/node_modules/tsup/assets/esm_shims.js
+// ../../node_modules/.pnpm/tsup@8.3.5_@microsoft+api-extractor@7.43.0_@types+node@22.9.0__@swc+core@1.5.29_jiti@2.0.0_po_lnt5yfvawfblpk67opvcdwbq7u/node_modules/tsup/assets/esm_shims.js
 var init_esm_shims = __esm({
-  "../../node_modules/.pnpm/tsup@8.3.0_@microsoft+api-extractor@7.43.0_@types+node@20.16.14__@swc+core@1.5.29_jiti@2.0.0__utvtwgyeu6xd57udthcnogp47u/node_modules/tsup/assets/esm_shims.js"() {
+  "../../node_modules/.pnpm/tsup@8.3.5_@microsoft+api-extractor@7.43.0_@types+node@22.9.0__@swc+core@1.5.29_jiti@2.0.0_po_lnt5yfvawfblpk67opvcdwbq7u/node_modules/tsup/assets/esm_shims.js"() {
     "use strict";
   }
 });
@@ -1863,10 +1863,15 @@ async function editComponentState(payload, stateEditor2) {
     return;
   const targetPath = path.slice();
   let target22;
-  if (instance.devtoolsRawSetupState && Object.keys(instance.devtoolsRawSetupState).includes(path[0]))
+  if (Object.keys(instance.props).includes(path[0])) {
+    target22 = instance.props;
+  } else if (instance.devtoolsRawSetupState && Object.keys(instance.devtoolsRawSetupState).includes(path[0])) {
     target22 = instance.devtoolsRawSetupState;
-  if (instance.data && Object.keys(instance.data).includes(path[0]))
+  } else if (instance.data && Object.keys(instance.data).includes(path[0])) {
     target22 = instance.data;
+  } else {
+    target22 = instance.proxy;
+  }
   if (target22 && targetPath) {
     if (state.type === "object" && type === "reactive") {
     }
@@ -2085,6 +2090,8 @@ function update(options) {
 }
 function highlight(instance) {
   const bounds = getComponentBoundingRect(instance);
+  if (!bounds.width && !bounds.height)
+    return;
   const name = getInstanceName(instance);
   const container = getContainerElement();
   container ? update({ bounds, name }) : create({ bounds, name });
@@ -3031,6 +3038,9 @@ var DevToolsV6PluginAPI = class {
   // component inspector
   notifyComponentUpdate(instance) {
     var _a25;
+    if (devtoolsState.highPerfModeEnabled) {
+      return;
+    }
     const inspector = getActiveInspectors().find((i) => i.packageName === this.plugin.descriptor.packageName);
     if (inspector == null ? void 0 : inspector.id) {
       if (instance) {
@@ -3055,9 +3065,15 @@ var DevToolsV6PluginAPI = class {
     }
   }
   sendInspectorTree(inspectorId) {
+    if (devtoolsState.highPerfModeEnabled) {
+      return;
+    }
     this.hooks.callHook("sendInspectorTree" /* SEND_INSPECTOR_TREE */, { inspectorId, plugin: this.plugin });
   }
   sendInspectorState(inspectorId) {
+    if (devtoolsState.highPerfModeEnabled) {
+      return;
+    }
     this.hooks.callHook("sendInspectorState" /* SEND_INSPECTOR_STATE */, { inspectorId, plugin: this.plugin });
   }
   selectInspectorNode(inspectorId, nodeId) {
@@ -3068,12 +3084,18 @@ var DevToolsV6PluginAPI = class {
   }
   // timeline
   now() {
+    if (devtoolsState.highPerfModeEnabled) {
+      return 0;
+    }
     return Date.now();
   }
   addTimelineLayer(options) {
     this.hooks.callHook("timelineLayerAdded" /* TIMELINE_LAYER_ADDED */, { options, plugin: this.plugin });
   }
   addTimelineEvent(options) {
+    if (devtoolsState.highPerfModeEnabled) {
+      return;
+    }
     this.hooks.callHook("timelineEventAdded" /* TIMELINE_EVENT_ADDED */, { options, plugin: this.plugin });
   }
   // settings
@@ -3317,15 +3339,17 @@ function resolveMergedOptions(instance) {
   return options;
 }
 function processProps(instance) {
+  var _a25;
   const props = [];
-  const propDefinitions = instance.type.props;
-  for (const key in instance.props) {
+  const propDefinitions = (_a25 = instance == null ? void 0 : instance.type) == null ? void 0 : _a25.props;
+  for (const key in instance == null ? void 0 : instance.props) {
     const propDefinition = propDefinitions ? propDefinitions[key] : null;
     const camelizeKey = camelize(key);
     props.push({
       type: "props",
       key: camelizeKey,
       value: returnError(() => instance.props[key]),
+      editable: true,
       meta: propDefinition ? {
         type: propDefinition.type ? getPropType(propDefinition.type) : "any",
         required: !!propDefinition.required,
@@ -3339,7 +3363,7 @@ function processProps(instance) {
 }
 function processState(instance) {
   const type = instance.type;
-  const props = type.props;
+  const props = type == null ? void 0 : type.props;
   const getters = type.vuex && type.vuex.getters;
   const computedDefs = type.computed;
   const data = {
@@ -4138,7 +4162,7 @@ function removeRegisteredPluginApp(app) {
   target8.__VUE_DEVTOOLS_KIT__REGISTERED_PLUGIN_APPS__.delete(app);
 }
 function registerDevToolsPlugin(app) {
-  if (target8.__VUE_DEVTOOLS_KIT__REGISTERED_PLUGIN_APPS__.has(app))
+  if (target8.__VUE_DEVTOOLS_KIT__REGISTERED_PLUGIN_APPS__.has(app) || devtoolsState.highPerfModeEnabled)
     return;
   target8.__VUE_DEVTOOLS_KIT__REGISTERED_PLUGIN_APPS__.add(app);
   devtoolsPluginBuffer.forEach((plugin) => {
@@ -4563,6 +4587,9 @@ function onDevToolsClientConnected(fn) {
 init_esm_shims();
 function toggleHighPerfMode(state) {
   devtoolsState.highPerfModeEnabled = state != null ? state : !devtoolsState.highPerfModeEnabled;
+  if (!state && activeAppRecord.value) {
+    registerDevToolsPlugin(activeAppRecord.value.app);
+  }
 }
 
 // src/core/component/state/format.ts
@@ -6099,7 +6126,7 @@ function getFunctionDetails(func) {
   return {
     _custom: {
       type: "function",
-      displayText: `<span style="opacity:.5;margin-right:5px;">function</span> <span style="white-space:nowrap;">${escape(name)}${args}</span>`,
+      displayText: `<span style="opacity:.8;margin-right:5px;">function</span> <span style="white-space:nowrap;">${escape(name)}${args}</span>`,
       tooltipText: string.trim() ? `<pre>${string}</pre>` : null
     }
   };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vue/devtools-kit",
   "type": "module",
-  "version": "7.6.2",
+  "version": "7.6.4",
   "author": "webfansplz",
   "license": "MIT",
   "repository": {
@@ -29,7 +29,7 @@
     "perfect-debounce": "^1.0.0",
     "speakingurl": "^14.0.1",
     "superjson": "^2.2.1",
-    "@vue/devtools-shared": "^7.6.2"
+    "@vue/devtools-shared": "^7.6.4"
   },
   "devDependencies": {
     "@types/speakingurl": "^13.0.6",