@xiaou66/vite-plugin-vue-mcp-next 1.3.3 → 1.3.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import { h as RuntimeClientOptions } from '../types-DAx3jHdz.cjs';
1
+ import { h as RuntimeClientOptions } from '../types-BKXdHkwk.cjs';
2
2
  import 'hookable';
3
3
  import 'vite';
4
4
 
@@ -1,4 +1,4 @@
1
- import { h as RuntimeClientOptions } from '../types-DAx3jHdz.js';
1
+ import { h as RuntimeClientOptions } from '../types-BKXdHkwk.js';
2
2
  import 'hookable';
3
3
  import 'vite';
4
4
 
@@ -115,153 +115,165 @@ var DEFAULT_OPTIONS = {
115
115
  import { nanoid } from "nanoid";
116
116
 
117
117
  // src/shared/serialization.ts
118
- var RPC_CIRCULAR_VALUE = "[Circular]";
119
- var RPC_UNREADABLE_VALUE = "[Unreadable]";
120
- function toRpcSafeValue(value) {
121
- return toRpcSafeChildValue(value, createRpcSafeContext(), false);
118
+ var DEFAULT_PREVIEW_OPTIONS = {
119
+ maxDepth: 2,
120
+ maxKeys: 20,
121
+ maxArrayItems: 20,
122
+ maxStringLength: 1e3,
123
+ maxTotalNodes: 200
124
+ };
125
+ var CIRCULAR_VALUE = "[Circular]";
126
+ var TRUNCATED_VALUE = "[Truncated]";
127
+ var UNREADABLE_VALUE = "[Unreadable]";
128
+ function createBoundedPreview(value, options = {}) {
129
+ return previewValue(
130
+ value,
131
+ {
132
+ options: { ...DEFAULT_PREVIEW_OPTIONS, ...options },
133
+ seen: /* @__PURE__ */ new WeakSet(),
134
+ visited: 0
135
+ },
136
+ 0,
137
+ false
138
+ );
122
139
  }
123
140
  function safeStringify(value) {
124
141
  if (typeof value === "string") {
125
- return value;
142
+ return truncateString(value, DEFAULT_PREVIEW_OPTIONS.maxStringLength);
126
143
  }
127
- const safeValue = toRpcSafeValue(value);
128
- return safeValue === void 0 ? "undefined" : JSON.stringify(safeValue);
129
- }
130
- function createRpcSafeContext() {
131
- return {
132
- cache: /* @__PURE__ */ new WeakMap(),
133
- seen: /* @__PURE__ */ new WeakSet()
134
- };
144
+ const preview = createBoundedPreview(value);
145
+ if (preview === void 0) {
146
+ return "undefined";
147
+ }
148
+ return JSON.stringify(preview);
135
149
  }
136
- function toRpcSafeChildValue(value, context, arrayItem) {
150
+ function previewValue(value, context, depth, arrayItem) {
137
151
  if (value === null) {
138
152
  return null;
139
153
  }
140
154
  switch (typeof value) {
141
155
  case "string":
142
- case "boolean":
143
- return value;
156
+ return truncateString(value, context.options.maxStringLength);
144
157
  case "number":
145
158
  return Number.isFinite(value) ? value : String(value);
159
+ case "boolean":
160
+ return value;
146
161
  case "bigint":
147
162
  return value.toString();
148
163
  case "symbol":
149
- return toSymbolPlaceholder(value);
150
- case "undefined":
164
+ return value.description ? `[Symbol(${value.description})]` : "[Symbol]";
151
165
  case "function":
166
+ return functionLabel(value);
167
+ case "undefined":
152
168
  return arrayItem ? null : void 0;
153
169
  case "object":
154
- return toRpcSafeObject(value, context);
170
+ return previewObject(value, context, depth);
155
171
  default:
156
172
  return arrayItem ? null : void 0;
157
173
  }
158
174
  }
159
- function toRpcSafeObject(value, context) {
175
+ function previewObject(value, context, depth) {
160
176
  if (context.seen.has(value)) {
161
- return RPC_CIRCULAR_VALUE;
177
+ return CIRCULAR_VALUE;
162
178
  }
163
- const cached = context.cache.get(value);
164
- if (cached) {
165
- return cached;
179
+ if (context.visited >= context.options.maxTotalNodes) {
180
+ return TRUNCATED_VALUE;
166
181
  }
182
+ if (depth >= context.options.maxDepth) {
183
+ return objectLabel(value);
184
+ }
185
+ context.visited += 1;
167
186
  context.seen.add(value);
168
- try {
169
- let safeValue;
170
- if (value instanceof Date) {
171
- safeValue = toSafeDate(value);
172
- } else if (value instanceof Error) {
173
- safeValue = toSafeError(value, context);
174
- } else if (Array.isArray(value)) {
175
- safeValue = toSafeArray(value, context);
176
- } else {
177
- safeValue = toSafeRecord(value, context);
178
- }
179
- context.cache.set(value, safeValue);
180
- return safeValue;
181
- } finally {
182
- context.seen.delete(value);
187
+ if (value instanceof Date) {
188
+ return Number.isNaN(value.getTime()) ? "Invalid Date" : value.toISOString();
189
+ }
190
+ if (value instanceof Error) {
191
+ return previewError(value, context, depth);
192
+ }
193
+ if (Array.isArray(value)) {
194
+ return previewArray(value, context, depth);
195
+ }
196
+ if (isElementLike(value)) {
197
+ return elementLabel(value);
183
198
  }
199
+ return previewRecord(value, context, depth);
184
200
  }
185
- function toSafeArray(values, context) {
186
- return values.map((item) => toRpcSafeChildValue(item, context, true) ?? null);
201
+ function previewArray(values, context, depth) {
202
+ const result = values.slice(0, context.options.maxArrayItems).map((item) => previewValue(item, context, depth + 1, true) ?? null);
203
+ if (values.length > context.options.maxArrayItems) {
204
+ result.push(TRUNCATED_VALUE);
205
+ }
206
+ return result;
187
207
  }
188
- function toSafeRecord(value, context) {
189
- const keys = getEnumerableKeys(value);
208
+ function previewRecord(value, context, depth) {
209
+ const keys = enumerableKeys(value);
190
210
  if (!keys) {
191
- return RPC_UNREADABLE_VALUE;
192
- }
193
- if (keys.length === 0 && !isPlainRecord(value)) {
194
- return toObjectSummary(value);
211
+ return UNREADABLE_VALUE;
195
212
  }
196
213
  const result = {};
197
- keys.forEach((key) => {
198
- if (key === "toJSON") {
199
- return;
200
- }
201
- const field = readObjectField(value, key);
202
- if (!field.ok) {
203
- result[key] = RPC_UNREADABLE_VALUE;
204
- return;
205
- }
206
- const safeValue = toRpcSafeChildValue(field.value, context, false);
207
- if (safeValue !== void 0) {
208
- result[key] = safeValue;
209
- }
214
+ const limitedKeys = keys.filter((key) => key !== "toJSON");
215
+ limitedKeys.slice(0, context.options.maxKeys).forEach((key) => {
216
+ const field = readField(value, key);
217
+ result[key] = field.ok ? previewValue(field.value, context, depth + 1, false) ?? null : UNREADABLE_VALUE;
210
218
  });
219
+ if (limitedKeys.length > context.options.maxKeys) {
220
+ result[TRUNCATED_VALUE] = `${String(limitedKeys.length - context.options.maxKeys)} keys omitted`;
221
+ }
211
222
  return result;
212
223
  }
213
- function toSafeError(error, context) {
224
+ function previewError(error, context, depth) {
214
225
  const result = {
215
226
  name: error.name,
216
- message: error.message
227
+ message: truncateString(error.message, context.options.maxStringLength)
217
228
  };
218
- const stack = readObjectField(error, "stack");
229
+ const stack = readField(error, "stack");
219
230
  if (stack.ok && typeof stack.value === "string") {
220
- result.stack = stack.value;
231
+ result.stack = truncateString(stack.value, context.options.maxStringLength);
221
232
  }
222
- if ("cause" in error) {
223
- const cause = readObjectField(error, "cause");
224
- result.cause = cause.ok ? toRpcSafeChildValue(cause.value, context, false) ?? null : RPC_UNREADABLE_VALUE;
233
+ const cause = readField(error, "cause");
234
+ if (cause.ok && cause.value !== void 0) {
235
+ result.cause = previewValue(cause.value, context, depth + 1, false) ?? null;
225
236
  }
226
237
  return result;
227
238
  }
228
- function toSafeDate(value) {
229
- return Number.isNaN(value.getTime()) ? "Invalid Date" : value.toISOString();
230
- }
231
- function getEnumerableKeys(value) {
239
+ function enumerableKeys(value) {
232
240
  try {
233
241
  return Object.keys(value);
234
242
  } catch {
235
243
  return void 0;
236
244
  }
237
245
  }
238
- function readObjectField(value, key) {
246
+ function readField(value, key) {
239
247
  try {
240
- return {
241
- ok: true,
242
- value: value[key]
243
- };
248
+ return { ok: true, value: value[key] };
244
249
  } catch {
245
250
  return { ok: false };
246
251
  }
247
252
  }
248
- function isPlainRecord(value) {
249
- try {
250
- const prototype = Object.getPrototypeOf(value);
251
- return prototype === Object.prototype || prototype === null;
252
- } catch {
253
- return false;
253
+ function truncateString(value, maxLength) {
254
+ if (value.length <= maxLength) {
255
+ return value;
254
256
  }
257
+ return `${value.slice(0, maxLength)}${TRUNCATED_VALUE}`;
255
258
  }
256
- function toObjectSummary(value) {
257
- try {
258
- return Object.prototype.toString.call(value);
259
- } catch {
260
- return "[Object]";
259
+ function functionLabel(value) {
260
+ return value.name ? `[Function:${value.name}]` : "[Function]";
261
+ }
262
+ function objectLabel(value) {
263
+ if (Array.isArray(value)) {
264
+ return `[Array(${String(value.length)})]`;
261
265
  }
266
+ return "[Object]";
262
267
  }
263
- function toSymbolPlaceholder(value) {
264
- return value.description ? `[Symbol(${value.description})]` : "[Symbol]";
268
+ function isElementLike(value) {
269
+ const node = value;
270
+ return node.nodeType === 1 && typeof node.nodeName === "string";
271
+ }
272
+ function elementLabel(value) {
273
+ const name = value.nodeName.toLowerCase();
274
+ const id = value.id ? `#${value.id}` : "";
275
+ const className = typeof value.className === "string" && value.className ? `.${value.className.trim().replace(/\s+/g, ".")}` : "";
276
+ return `[Element:${name}${id}${className}]`;
265
277
  }
266
278
 
267
279
  // src/runtime/consoleHook.ts
@@ -274,14 +286,13 @@ function installConsoleHook(options) {
274
286
  debug: console.debug
275
287
  };
276
288
  const emit = (level, args) => {
277
- const serializedArgs = serializeConsoleArgs(args);
278
289
  options.send({
279
290
  id: nanoid(),
280
291
  pageId: options.pageId,
281
292
  source: "hook",
282
293
  level,
283
- message: serializedArgs.join(" "),
284
- args: serializedArgs,
294
+ message: args.map((arg) => safeStringify(arg)).join(" "),
295
+ args: args.map((arg) => createBoundedPreview(arg)),
285
296
  timestamp: Date.now()
286
297
  });
287
298
  };
@@ -308,9 +319,6 @@ function installConsoleHook(options) {
308
319
  window.removeEventListener("error", onError);
309
320
  };
310
321
  }
311
- function serializeConsoleArgs(args) {
312
- return args.map((arg) => safeStringify(arg));
313
- }
314
322
 
315
323
  // src/runtime/elementRegistry.ts
316
324
  import { nanoid as nanoid2 } from "nanoid";
@@ -374,7 +382,7 @@ function installElementPicker(options) {
374
382
  window.addEventListener(
375
383
  "click",
376
384
  (event) => {
377
- if (!active || !isElementLike(event.target)) {
385
+ if (!active || !isElementLike2(event.target)) {
378
386
  return;
379
387
  }
380
388
  event.preventDefault();
@@ -456,7 +464,7 @@ function showToast(message, durationMs) {
456
464
  toast.remove();
457
465
  }, durationMs);
458
466
  }
459
- function isElementLike(value) {
467
+ function isElementLike2(value) {
460
468
  return Boolean(
461
469
  value && typeof value === "object" && "getAttribute" in value && "getBoundingClientRect" in value
462
470
  );
@@ -1623,6 +1631,7 @@ import {
1623
1631
  devtoolsRouterInfo,
1624
1632
  devtoolsState,
1625
1633
  getInspector,
1634
+ stringify,
1626
1635
  toggleHighPerfMode
1627
1636
  } from "@vue/devtools-kit";
1628
1637
  import { createRPCClient } from "vite-dev-rpc";
@@ -2131,6 +2140,18 @@ function createRuntimeDevtoolsRpc(getRpc) {
2131
2140
  var PINIA_INSPECTOR_ID = "pinia";
2132
2141
  var COMPONENTS_INSPECTOR_ID = "components";
2133
2142
  var COMPONENT_HIGHLIGHT_DURATION = 5e3;
2143
+ var INSPECTOR_TREE_MAX_DEPTH = 20;
2144
+ var INSPECTOR_TREE_MAX_NODES = 500;
2145
+ var INSPECTOR_TREE_MAX_CHILDREN = 200;
2146
+ var INSPECTOR_TREE_MAX_TAGS = 20;
2147
+ var INSPECTOR_NODE_FIELDS = [
2148
+ "id",
2149
+ "label",
2150
+ "name",
2151
+ "inactive",
2152
+ "isFragment",
2153
+ "autoOpen"
2154
+ ];
2134
2155
  var highlightComponentTimeout;
2135
2156
  function initializeVueDevtoolsHook() {
2136
2157
  devtools.init();
@@ -2150,14 +2171,64 @@ function installVueBridge(hot) {
2150
2171
  );
2151
2172
  rpcRef.current = rpc;
2152
2173
  }
2153
- function toVueRpcPayload(value) {
2154
- return toRpcSafeValue(value);
2174
+ function projectInspectorTreeList(value) {
2175
+ if (!Array.isArray(value)) {
2176
+ return [];
2177
+ }
2178
+ const budget = { visited: 0 };
2179
+ return value.map((node) => projectInspectorNode(node, budget, 0));
2180
+ }
2181
+ function projectInspectorNode(value, budget, depth) {
2182
+ if (!value || typeof value !== "object") {
2183
+ return value;
2184
+ }
2185
+ if (budget.visited >= INSPECTOR_TREE_MAX_NODES || depth >= INSPECTOR_TREE_MAX_DEPTH) {
2186
+ return "[Truncated]";
2187
+ }
2188
+ budget.visited += 1;
2189
+ const result = {};
2190
+ INSPECTOR_NODE_FIELDS.forEach((field) => {
2191
+ const valueField = readInspectorField(value, field);
2192
+ if (valueField.ok && isInspectorPrimitive(valueField.value)) {
2193
+ result[field] = valueField.value;
2194
+ }
2195
+ });
2196
+ const tags = readInspectorField(value, "tags");
2197
+ if (tags.ok && Array.isArray(tags.value)) {
2198
+ result.tags = tags.value.slice(0, INSPECTOR_TREE_MAX_TAGS).map(projectInspectorTag);
2199
+ }
2200
+ const children = readInspectorField(value, "children");
2201
+ if (children.ok && Array.isArray(children.value)) {
2202
+ const projectedChildren = children.value.slice(0, INSPECTOR_TREE_MAX_CHILDREN).map((child) => projectInspectorNode(child, budget, depth + 1));
2203
+ if (children.value.length > INSPECTOR_TREE_MAX_CHILDREN) {
2204
+ projectedChildren.push("[Truncated]");
2205
+ }
2206
+ result.children = projectedChildren;
2207
+ }
2208
+ return result;
2209
+ }
2210
+ function projectInspectorTag(value) {
2211
+ if (!value || typeof value !== "object") {
2212
+ return value;
2213
+ }
2214
+ const result = {};
2215
+ Object.keys(value).filter((key) => key !== "toJSON").slice(0, 8).forEach((key) => {
2216
+ const field = readInspectorField(value, key);
2217
+ if (field.ok && isInspectorPrimitive(field.value)) {
2218
+ result[key] = field.value;
2219
+ }
2220
+ });
2221
+ return result;
2155
2222
  }
2156
- function toVueRpcJsonPayload(value) {
2157
- return JSON.stringify(toRpcSafeValue(value) ?? null);
2223
+ function readInspectorField(value, key) {
2224
+ try {
2225
+ return { ok: true, value: value[key] };
2226
+ } catch {
2227
+ return { ok: false };
2228
+ }
2158
2229
  }
2159
- function toVueRpcPrettyJsonPayload(value) {
2160
- return JSON.stringify(toRpcSafeValue(value), null, 2);
2230
+ function isInspectorPrimitive(value) {
2231
+ return typeof value === "string" || typeof value === "number" || typeof value === "boolean" || value === null;
2161
2232
  }
2162
2233
  function createClientVueRuntimeRpc(getRpc) {
2163
2234
  return {
@@ -2169,7 +2240,7 @@ function createClientVueRuntimeRpc(getRpc) {
2169
2240
  });
2170
2241
  getRpc().onInspectorTreeUpdated(
2171
2242
  query.event,
2172
- toVueRpcPayload(inspectorTree[0])
2243
+ projectInspectorNode(inspectorTree[0], { visited: 0 }, 0)
2173
2244
  );
2174
2245
  },
2175
2246
  onInspectorTreeUpdated: () => void 0,
@@ -2178,7 +2249,7 @@ function createClientVueRuntimeRpc(getRpc) {
2178
2249
  if (!targetNode) {
2179
2250
  getRpc().onInspectorStateUpdated(
2180
2251
  query.event,
2181
- toVueRpcPayload(createMissingComponentError(query.componentName))
2252
+ createMissingComponentError(query.componentName)
2182
2253
  );
2183
2254
  return;
2184
2255
  }
@@ -2186,10 +2257,7 @@ function createClientVueRuntimeRpc(getRpc) {
2186
2257
  inspectorId: COMPONENTS_INSPECTOR_ID,
2187
2258
  nodeId: targetNode.id
2188
2259
  });
2189
- getRpc().onInspectorStateUpdated(
2190
- query.event,
2191
- toVueRpcJsonPayload(inspectorState)
2192
- );
2260
+ getRpc().onInspectorStateUpdated(query.event, stringify(inspectorState));
2193
2261
  },
2194
2262
  onInspectorStateUpdated: () => void 0,
2195
2263
  async editComponentState(query) {
@@ -2226,7 +2294,7 @@ function createClientVueRuntimeRpc(getRpc) {
2226
2294
  getRouterInfo(query) {
2227
2295
  getRpc().onRouterInfoUpdated(
2228
2296
  query.event,
2229
- toVueRpcPrettyJsonPayload(devtoolsRouterInfo)
2297
+ JSON.stringify(devtoolsRouterInfo, null, 2)
2230
2298
  );
2231
2299
  },
2232
2300
  onRouterInfoUpdated: () => void 0,
@@ -2237,7 +2305,10 @@ function createClientVueRuntimeRpc(getRpc) {
2237
2305
  filter: ""
2238
2306
  })
2239
2307
  );
2240
- getRpc().onPiniaTreeUpdated(query.event, toVueRpcPayload(inspectorTree));
2308
+ getRpc().onPiniaTreeUpdated(
2309
+ query.event,
2310
+ projectInspectorTreeList(inspectorTree)
2311
+ );
2241
2312
  },
2242
2313
  onPiniaTreeUpdated: () => void 0,
2243
2314
  async getPiniaState(query) {
@@ -2252,7 +2323,7 @@ function createClientVueRuntimeRpc(getRpc) {
2252
2323
  }
2253
2324
  return devtools.ctx.api.getInspectorState(payload);
2254
2325
  });
2255
- getRpc().onPiniaInfoUpdated(query.event, toVueRpcJsonPayload(result));
2326
+ getRpc().onPiniaInfoUpdated(query.event, stringify(result));
2256
2327
  },
2257
2328
  onPiniaInfoUpdated: () => void 0,
2258
2329
  async recordPerformance(query) {
@@ -2260,7 +2331,7 @@ function createClientVueRuntimeRpc(getRpc) {
2260
2331
  if (!collector) {
2261
2332
  getRpc().onPerformanceRecorded(
2262
2333
  query.event,
2263
- toVueRpcPayload(createPerformanceUnavailableError())
2334
+ createPerformanceUnavailableError()
2264
2335
  );
2265
2336
  return;
2266
2337
  }
@@ -2270,11 +2341,11 @@ function createClientVueRuntimeRpc(getRpc) {
2270
2341
  includeMemory: query.includeMemory,
2271
2342
  includeStacks: query.includeStacks
2272
2343
  });
2273
- getRpc().onPerformanceRecorded(query.event, toVueRpcPayload(report));
2344
+ getRpc().onPerformanceRecorded(query.event, report);
2274
2345
  } catch (error) {
2275
2346
  getRpc().onPerformanceRecorded(
2276
2347
  query.event,
2277
- toVueRpcPayload(createPerformanceError(error))
2348
+ createPerformanceError(error)
2278
2349
  );
2279
2350
  }
2280
2351
  },
@@ -2284,7 +2355,7 @@ function createClientVueRuntimeRpc(getRpc) {
2284
2355
  if (!collector) {
2285
2356
  getRpc().onPerformanceRecordingStarted(
2286
2357
  query.event,
2287
- toVueRpcPayload(createPerformanceUnavailableError())
2358
+ createPerformanceUnavailableError()
2288
2359
  );
2289
2360
  return;
2290
2361
  }
@@ -2293,19 +2364,16 @@ function createClientVueRuntimeRpc(getRpc) {
2293
2364
  includeMemory: query.includeMemory,
2294
2365
  includeStacks: query.includeStacks
2295
2366
  });
2296
- getRpc().onPerformanceRecordingStarted(
2297
- query.event,
2298
- toVueRpcPayload({
2299
- ok: true,
2300
- recordingId,
2301
- startedAt: Date.now(),
2302
- source: "hook"
2303
- })
2304
- );
2367
+ getRpc().onPerformanceRecordingStarted(query.event, {
2368
+ ok: true,
2369
+ recordingId,
2370
+ startedAt: Date.now(),
2371
+ source: "hook"
2372
+ });
2305
2373
  } catch (error) {
2306
2374
  getRpc().onPerformanceRecordingStarted(
2307
2375
  query.event,
2308
- toVueRpcPayload(createPerformanceError(error))
2376
+ createPerformanceError(error)
2309
2377
  );
2310
2378
  }
2311
2379
  },
@@ -2315,20 +2383,17 @@ function createClientVueRuntimeRpc(getRpc) {
2315
2383
  if (!collector) {
2316
2384
  getRpc().onPerformanceRecordingStopped(
2317
2385
  query.event,
2318
- toVueRpcPayload(createPerformanceUnavailableError())
2386
+ createPerformanceUnavailableError()
2319
2387
  );
2320
2388
  return;
2321
2389
  }
2322
2390
  try {
2323
2391
  const report = collector.stop(query.recordingId);
2324
- getRpc().onPerformanceRecordingStopped(
2325
- query.event,
2326
- toVueRpcPayload(report)
2327
- );
2392
+ getRpc().onPerformanceRecordingStopped(query.event, report);
2328
2393
  } catch (error) {
2329
2394
  getRpc().onPerformanceRecordingStopped(
2330
2395
  query.event,
2331
- toVueRpcPayload(createPerformanceError(error))
2396
+ createPerformanceError(error)
2332
2397
  );
2333
2398
  }
2334
2399
  },