one 1.2.74 → 1.2.75

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.
Files changed (55) hide show
  1. package/dist/cjs/cli/build.js.map +1 -1
  2. package/dist/cjs/cli/build.native.js.map +1 -1
  3. package/dist/cjs/devtools/registry.js.map +1 -1
  4. package/dist/cjs/devtools/registry.native.js.map +1 -1
  5. package/dist/cjs/router/router.cjs +33 -8
  6. package/dist/cjs/router/router.js +24 -5
  7. package/dist/cjs/router/router.js.map +1 -1
  8. package/dist/cjs/router/router.native.js +37 -12
  9. package/dist/cjs/router/router.native.js.map +1 -1
  10. package/dist/cjs/useLoader.cjs +1 -0
  11. package/dist/cjs/useLoader.js +1 -0
  12. package/dist/cjs/useLoader.js.map +1 -1
  13. package/dist/cjs/useLoader.native.js +1 -0
  14. package/dist/cjs/useLoader.native.js.map +1 -1
  15. package/dist/cjs/vite/DevHead.cjs +80 -61
  16. package/dist/cjs/vite/DevHead.js +80 -61
  17. package/dist/cjs/vite/DevHead.js.map +1 -1
  18. package/dist/cjs/vite/DevHead.native.js +80 -61
  19. package/dist/cjs/vite/DevHead.native.js.map +1 -1
  20. package/dist/esm/cli/build.js.map +1 -1
  21. package/dist/esm/cli/build.mjs.map +1 -1
  22. package/dist/esm/cli/build.native.js.map +1 -1
  23. package/dist/esm/devtools/registry.js.map +1 -1
  24. package/dist/esm/devtools/registry.mjs.map +1 -1
  25. package/dist/esm/devtools/registry.native.js.map +1 -1
  26. package/dist/esm/router/router.js +24 -5
  27. package/dist/esm/router/router.js.map +1 -1
  28. package/dist/esm/router/router.mjs +33 -8
  29. package/dist/esm/router/router.mjs.map +1 -1
  30. package/dist/esm/router/router.native.js +37 -12
  31. package/dist/esm/router/router.native.js.map +1 -1
  32. package/dist/esm/useLoader.js +1 -0
  33. package/dist/esm/useLoader.js.map +1 -1
  34. package/dist/esm/useLoader.mjs +1 -0
  35. package/dist/esm/useLoader.mjs.map +1 -1
  36. package/dist/esm/useLoader.native.js +1 -0
  37. package/dist/esm/useLoader.native.js.map +1 -1
  38. package/dist/esm/vite/DevHead.js +80 -61
  39. package/dist/esm/vite/DevHead.js.map +1 -1
  40. package/dist/esm/vite/DevHead.mjs +80 -61
  41. package/dist/esm/vite/DevHead.mjs.map +1 -1
  42. package/dist/esm/vite/DevHead.native.js +80 -61
  43. package/dist/esm/vite/DevHead.native.js.map +1 -1
  44. package/package.json +9 -9
  45. package/src/cli/build.ts +10 -3
  46. package/src/devtools/registry.ts +11 -0
  47. package/src/router/router.ts +31 -0
  48. package/src/useLoader.ts +1 -0
  49. package/src/vite/DevHead.tsx +80 -61
  50. package/types/cli/build.d.ts.map +1 -1
  51. package/types/devtools/registry.d.ts +10 -0
  52. package/types/devtools/registry.d.ts.map +1 -1
  53. package/types/router/router.d.ts.map +1 -1
  54. package/types/useLoader.d.ts.map +1 -1
  55. package/types/vite/DevHead.d.ts.map +1 -1
package/dist/esm/vite/DevHead.js CHANGED
@@ -5,7 +5,8 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
5
5
  try {
6
6
  var host = null;
7
7
  var shadow = null;
8
- var spotlight = null;
8
+ var spotlightDialog = null;
9
+ var panelDialog = null;
9
10
  var panel = null;
10
11
  var activeTab = 'seo';
11
12
  var isDragging = false;
@@ -30,19 +31,29 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
30
31
  var css = \`
31
32
  * { box-sizing: border-box; margin: 0; padding: 0; }
32
33
 
34
+ dialog {
35
+ border: none;
36
+ padding: 0;
37
+ background: transparent;
38
+ max-width: none;
39
+ max-height: none;
40
+ overflow: visible;
41
+ }
42
+ dialog::backdrop {
43
+ background: transparent;
44
+ }
45
+ #spotlight-dialog::backdrop {
46
+ background: rgba(0,0,0,0.3);
47
+ backdrop-filter: blur(8px);
48
+ }
49
+
33
50
  .spotlight {
34
- position: fixed;
35
- inset: 0;
36
- z-index: 100000;
37
- display: none;
51
+ display: flex;
38
52
  align-items: center;
39
53
  justify-content: center;
40
- backdrop-filter: blur(8px);
41
- background: rgba(0,0,0,0.4);
42
- opacity: 0;
43
- transition: opacity 0.12s ease-out;
54
+ position: fixed;
55
+ inset: 0;
44
56
  }
45
- .spotlight.visible { display: flex; opacity: 1; }
46
57
 
47
58
  .spotlight-box {
48
59
  background: #1a1a1a;
@@ -51,11 +62,7 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
51
62
  max-width: 90vw;
52
63
  overflow: hidden;
53
64
  box-shadow: 0 16px 48px rgba(0,0,0,0.5);
54
- transform: scale(0.96);
55
- opacity: 0;
56
- transition: transform 0.12s ease-out, opacity 0.12s ease-out;
57
65
  }
58
- .spotlight.visible .spotlight-box { transform: scale(1); opacity: 1; }
59
66
 
60
67
  .spotlight-header {
61
68
  display: flex;
@@ -90,22 +97,29 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
90
97
  margin-left: auto;
91
98
  }
92
99
 
93
- .panel {
100
+ .panel-dialog {
94
101
  position: fixed;
102
+ margin: 0;
103
+ inset: unset;
104
+ z-index: 2147483647;
105
+ }
106
+ .panel-dialog::backdrop {
107
+ display: none;
108
+ }
109
+
110
+ .panel {
95
111
  width: 420px;
96
112
  max-width: calc(100vw - 40px);
97
113
  max-height: calc(100vh - 40px);
98
114
  background: #161616;
99
115
  border-radius: 10px;
100
- box-shadow: 0 8px 32px rgba(0,0,0,0.4);
101
- z-index: 99998;
102
- display: none;
116
+ box-shadow: 0 12px 40px rgba(0,0,0,0.4);
117
+ display: flex;
103
118
  flex-direction: column;
104
119
  overflow: hidden;
105
120
  font: 13px system-ui, sans-serif;
106
121
  color: #ccc;
107
122
  }
108
- .panel.visible { display: flex; }
109
123
 
110
124
  .panel-header {
111
125
  display: flex;
@@ -225,7 +239,7 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
225
239
  .issue-icon { font-size: 10px; }
226
240
  \`;
227
241
 
228
- shadow.innerHTML = '<style>' + css + '</style><div class="spotlight" id="spotlight"><div class="spotlight-box" id="spotlight-box"></div></div><div class="panel" id="panel"></div>';
242
+ shadow.innerHTML = '<style>' + css + '</style><dialog id="spotlight-dialog"><div class="spotlight"><div class="spotlight-box" id="spotlight-box"></div></div></dialog><dialog class="panel-dialog" id="panel-dialog"><div class="panel" id="panel"></div></dialog>';
229
243
  document.body.appendChild(host);
230
244
 
231
245
  setupSpotlight();
@@ -247,7 +261,8 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
247
261
  // our element was removed (likely by React hydration), re-create it
248
262
  host = null;
249
263
  shadow = null;
250
- spotlight = null;
264
+ spotlightDialog = null;
265
+ panelDialog = null;
251
266
  panel = null;
252
267
  setTimeout(createHost, 0);
253
268
  return;
@@ -260,7 +275,7 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
260
275
  }
261
276
 
262
277
  function setupSpotlight() {
263
- spotlight = shadow.getElementById('spotlight');
278
+ spotlightDialog = shadow.getElementById('spotlight-dialog');
264
279
  var box = shadow.getElementById('spotlight-box');
265
280
 
266
281
  var items = [
@@ -284,12 +299,14 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
284
299
  }
285
300
  });
286
301
 
287
- spotlight.addEventListener('click', function(e) {
288
- if (e.target === spotlight) hideSpotlight();
302
+ // close on backdrop click
303
+ spotlightDialog.addEventListener('click', function(e) {
304
+ if (e.target === spotlightDialog) spotlightDialog.close();
289
305
  });
290
306
  }
291
307
 
292
308
  function setupPanel() {
309
+ panelDialog = shadow.getElementById('panel-dialog');
293
310
  panel = shadow.getElementById('panel');
294
311
  panel.innerHTML = '<div class="panel-header" id="panel-header">' + LOGO_SVG + '<span class="panel-title">DevTools</span><button class="panel-close" id="panel-close">\xD7</button></div><div class="tabs" id="tabs"><button class="tab active" data-tab="seo">SEO</button><button class="tab" data-tab="route">Route</button><button class="tab" data-tab="loader">Loader</button><button class="tab" data-tab="errors">Errors</button></div><div class="content" id="content"></div>';
295
312
 
@@ -314,7 +331,7 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
314
331
  header.addEventListener('mousedown', function(e) {
315
332
  if (e.target.closest('.panel-close')) return;
316
333
  isDragging = true;
317
- var rect = panel.getBoundingClientRect();
334
+ var rect = panelDialog.getBoundingClientRect();
318
335
  dragOffset.x = e.clientX - rect.left;
319
336
  dragOffset.y = e.clientY - rect.top;
320
337
  // Store current position before resetting snap state
@@ -330,8 +347,8 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
330
347
  var snapDist = 20;
331
348
  var w = window.innerWidth;
332
349
  var h = window.innerHeight;
333
- var pw = panel.offsetWidth;
334
- var ph = panel.offsetHeight;
350
+ var pw = panelDialog.offsetWidth;
351
+ var ph = panelDialog.offsetHeight;
335
352
  var pad = 10;
336
353
 
337
354
  var snapH = null;
@@ -346,27 +363,27 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
346
363
 
347
364
  // Apply horizontal positioning
348
365
  if (snapH === 'left') {
349
- panel.style.left = pad + 'px';
350
- panel.style.right = 'auto';
366
+ panelDialog.style.left = pad + 'px';
367
+ panelDialog.style.right = 'auto';
351
368
  } else if (snapH === 'right') {
352
- panel.style.left = 'auto';
353
- panel.style.right = pad + 'px';
369
+ panelDialog.style.left = 'auto';
370
+ panelDialog.style.right = pad + 'px';
354
371
  } else {
355
- panel.style.left = x + 'px';
356
- panel.style.right = 'auto';
372
+ panelDialog.style.left = x + 'px';
373
+ panelDialog.style.right = 'auto';
357
374
  panelPos.x = x;
358
375
  }
359
376
 
360
377
  // Apply vertical positioning
361
378
  if (snapV === 'top') {
362
- panel.style.top = pad + 'px';
363
- panel.style.bottom = 'auto';
379
+ panelDialog.style.top = pad + 'px';
380
+ panelDialog.style.bottom = 'auto';
364
381
  } else if (snapV === 'bottom') {
365
- panel.style.top = 'auto';
366
- panel.style.bottom = pad + 'px';
382
+ panelDialog.style.top = 'auto';
383
+ panelDialog.style.bottom = pad + 'px';
367
384
  } else {
368
- panel.style.top = y + 'px';
369
- panel.style.bottom = 'auto';
385
+ panelDialog.style.top = y + 'px';
386
+ panelDialog.style.bottom = 'auto';
370
387
  panelPos.y = y;
371
388
  }
372
389
  });
@@ -394,24 +411,26 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
394
411
  showPanel();
395
412
  }
396
413
  } else if (e.code === 'Escape') {
397
- if (spotlight && spotlight.classList.contains('visible')) hideSpotlight();
398
- else if (panel && panel.classList.contains('visible')) hidePanel();
414
+ // dialogs handle escape natively, but we need to handle the case where escape is pressed
415
+ // when only one is open
416
+ if (spotlightDialog && spotlightDialog.open) spotlightDialog.close();
417
+ else if (panelDialog && panelDialog.open) panelDialog.close();
399
418
  }
400
419
  });
401
420
  }
402
421
 
403
422
  function toggleSpotlight() {
404
- if (spotlight && spotlight.classList.contains('visible')) hideSpotlight();
423
+ if (spotlightDialog && spotlightDialog.open) hideSpotlight();
405
424
  else showSpotlight();
406
425
  }
407
426
 
408
427
  function showSpotlight() {
409
428
  if (!host) createHost();
410
- spotlight.classList.add('visible');
429
+ spotlightDialog.showModal();
411
430
  }
412
431
 
413
432
  function hideSpotlight() {
414
- spotlight.classList.remove('visible');
433
+ spotlightDialog.close();
415
434
  }
416
435
 
417
436
  function showPanel() {
@@ -419,33 +438,33 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
419
438
  var pad = 10;
420
439
  // Apply horizontal positioning based on snap state
421
440
  if (snappedEdge.h === 'left') {
422
- panel.style.left = pad + 'px';
423
- panel.style.right = 'auto';
441
+ panelDialog.style.left = pad + 'px';
442
+ panelDialog.style.right = 'auto';
424
443
  } else if (snappedEdge.h === 'right') {
425
- panel.style.left = 'auto';
426
- panel.style.right = pad + 'px';
444
+ panelDialog.style.left = 'auto';
445
+ panelDialog.style.right = pad + 'px';
427
446
  } else {
428
- panel.style.left = panelPos.x + 'px';
429
- panel.style.right = 'auto';
447
+ panelDialog.style.left = panelPos.x + 'px';
448
+ panelDialog.style.right = 'auto';
430
449
  }
431
450
  // Apply vertical positioning based on snap state
432
451
  if (snappedEdge.v === 'top') {
433
- panel.style.top = pad + 'px';
434
- panel.style.bottom = 'auto';
452
+ panelDialog.style.top = pad + 'px';
453
+ panelDialog.style.bottom = 'auto';
435
454
  } else if (snappedEdge.v === 'bottom') {
436
- panel.style.top = 'auto';
437
- panel.style.bottom = pad + 'px';
455
+ panelDialog.style.top = 'auto';
456
+ panelDialog.style.bottom = pad + 'px';
438
457
  } else {
439
- panel.style.top = panelPos.y + 'px';
440
- panel.style.bottom = 'auto';
458
+ panelDialog.style.top = panelPos.y + 'px';
459
+ panelDialog.style.bottom = 'auto';
441
460
  }
442
- panel.classList.add('visible');
461
+ panelDialog.show();
443
462
  updateTabs();
444
463
  updateContent();
445
464
  }
446
465
 
447
466
  function hidePanel() {
448
- panel.classList.remove('visible');
467
+ panelDialog.close();
449
468
  }
450
469
 
451
470
  function updateTabs() {
@@ -619,19 +638,19 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
619
638
 
620
639
  // Listen for events
621
640
  window.addEventListener('one-loader-timing', function() {
622
- if (panel && panel.classList.contains('visible') && activeTab === 'loader') updateContent();
641
+ if (panelDialog && panelDialog.open && activeTab === 'loader') updateContent();
623
642
  });
624
643
  window.addEventListener('one-error', function(e) {
625
644
  var devtools = window.__oneDevtools = window.__oneDevtools || {};
626
645
  devtools.errorHistory = devtools.errorHistory || [];
627
646
  devtools.errorHistory.unshift(e.detail);
628
647
  if (devtools.errorHistory.length > 20) devtools.errorHistory = devtools.errorHistory.slice(0, 20);
629
- if (panel && panel.classList.contains('visible') && activeTab === 'errors') updateContent();
648
+ if (panelDialog && panelDialog.open && activeTab === 'errors') updateContent();
630
649
  });
631
650
 
632
651
  // Update on navigation
633
652
  function onNavigate() {
634
- if (panel && panel.classList.contains('visible')) updateContent();
653
+ if (panelDialog && panelDialog.open) updateContent();
635
654
  }
636
655
  window.addEventListener('popstate', onNavigate);
637
656
  window.addEventListener('one-hmr-update', onNavigate);
package/dist/esm/vite/DevHead.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/vite/DevHead.tsx"],
4
- "mappings": "AACA,SAAS,4BAA4B;AAq3B/B,mBACE,KADF;AAl3BN,MAAM,mBACJ,qVAGI,oBACJ,yeAGI,uBACJ,qKAII,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA+oBtB,0BAA0B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgNzB,SAAS,UAAU;AAIxB,SAAI,QAAQ,IAAI,aAAa,gBAEzB,iCACE;AAAA,wBAAC,UAAK,KAAI,WAAU,MAAM,sBAAsB,IAAG,SAAQ;AAAA,IAC3D;AAAA,MAAC;AAAA;AAAA,QACC,KAAI;AAAA,QACJ,MAAM;AAAA,QACN,gBAAY;AAAA,QACZ,0BAAwB;AAAA;AAAA,IAC1B;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,0BAAwB;AAAA,QACxB,yBAAyB,EAAE,QAAQ,iBAAiB;AAAA;AAAA,IACtD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,0BAAwB;AAAA,QACxB,yBAAyB,EAAE,QAAQ,kBAAkB;AAAA;AAAA,IACvD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,0BAAwB;AAAA,QACxB,yBAAyB,EAAE,QAAQ,qBAAqB;AAAA;AAAA,IAC1D;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,0BAAwB;AAAA,QACxB,yBAAyB,EAAE,QAAQ,oBAAoB;AAAA;AAAA,IACzD;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,0BAAwB;AAAA,QACxB,yBAAyB,EAAE,QAAQ,wBAAwB;AAAA;AAAA,IAC7D;AAAA,KACF,IAGG;AACT;",
4
+ "mappings": "AACA,SAAS,4BAA4B;AAw4B/B,mBACE,KADF;AAr4BN,MAAM,mBACJ,qVAGI,oBACJ,yeAGI,uBACJ,qKAII,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAkqBtB,0BAA0B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgNzB,SAAS,UAAU;AAIxB,SAAI,QAAQ,IAAI,aAAa,gBAEzB,iCACE;AAAA,wBAAC,UAAK,KAAI,WAAU,MAAM,sBAAsB,IAAG,SAAQ;AAAA,IAC3D;AAAA,MAAC;AAAA;AAAA,QACC,KAAI;AAAA,QACJ,MAAM;AAAA,QACN,gBAAY;AAAA,QACZ,0BAAwB;AAAA;AAAA,IAC1B;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,0BAAwB;AAAA,QACxB,yBAAyB,EAAE,QAAQ,iBAAiB;AAAA;AAAA,IACtD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,0BAAwB;AAAA,QACxB,yBAAyB,EAAE,QAAQ,kBAAkB;AAAA;AAAA,IACvD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,0BAAwB;AAAA,QACxB,yBAAyB,EAAE,QAAQ,qBAAqB;AAAA;AAAA,IAC1D;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,0BAAwB;AAAA,QACxB,yBAAyB,EAAE,QAAQ,oBAAoB;AAAA;AAAA,IACzD;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,0BAAwB;AAAA,QACxB,yBAAyB,EAAE,QAAQ,wBAAwB;AAAA;AAAA,IAC7D;AAAA,KACF,IAGG;AACT;",
5
5
  "names": []
6
6
  }
package/dist/esm/vite/DevHead.mjs CHANGED
@@ -8,7 +8,8 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
8
8
  try {
9
9
  var host = null;
10
10
  var shadow = null;
11
- var spotlight = null;
11
+ var spotlightDialog = null;
12
+ var panelDialog = null;
12
13
  var panel = null;
13
14
  var activeTab = 'seo';
14
15
  var isDragging = false;
@@ -33,19 +34,29 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
33
34
  var css = \`
34
35
  * { box-sizing: border-box; margin: 0; padding: 0; }
35
36
 
37
+ dialog {
38
+ border: none;
39
+ padding: 0;
40
+ background: transparent;
41
+ max-width: none;
42
+ max-height: none;
43
+ overflow: visible;
44
+ }
45
+ dialog::backdrop {
46
+ background: transparent;
47
+ }
48
+ #spotlight-dialog::backdrop {
49
+ background: rgba(0,0,0,0.3);
50
+ backdrop-filter: blur(8px);
51
+ }
52
+
36
53
  .spotlight {
37
- position: fixed;
38
- inset: 0;
39
- z-index: 100000;
40
- display: none;
54
+ display: flex;
41
55
  align-items: center;
42
56
  justify-content: center;
43
- backdrop-filter: blur(8px);
44
- background: rgba(0,0,0,0.4);
45
- opacity: 0;
46
- transition: opacity 0.12s ease-out;
57
+ position: fixed;
58
+ inset: 0;
47
59
  }
48
- .spotlight.visible { display: flex; opacity: 1; }
49
60
 
50
61
  .spotlight-box {
51
62
  background: #1a1a1a;
@@ -54,11 +65,7 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
54
65
  max-width: 90vw;
55
66
  overflow: hidden;
56
67
  box-shadow: 0 16px 48px rgba(0,0,0,0.5);
57
- transform: scale(0.96);
58
- opacity: 0;
59
- transition: transform 0.12s ease-out, opacity 0.12s ease-out;
60
68
  }
61
- .spotlight.visible .spotlight-box { transform: scale(1); opacity: 1; }
62
69
 
63
70
  .spotlight-header {
64
71
  display: flex;
@@ -93,22 +100,29 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
93
100
  margin-left: auto;
94
101
  }
95
102
 
96
- .panel {
103
+ .panel-dialog {
97
104
  position: fixed;
105
+ margin: 0;
106
+ inset: unset;
107
+ z-index: 2147483647;
108
+ }
109
+ .panel-dialog::backdrop {
110
+ display: none;
111
+ }
112
+
113
+ .panel {
98
114
  width: 420px;
99
115
  max-width: calc(100vw - 40px);
100
116
  max-height: calc(100vh - 40px);
101
117
  background: #161616;
102
118
  border-radius: 10px;
103
- box-shadow: 0 8px 32px rgba(0,0,0,0.4);
104
- z-index: 99998;
105
- display: none;
119
+ box-shadow: 0 12px 40px rgba(0,0,0,0.4);
120
+ display: flex;
106
121
  flex-direction: column;
107
122
  overflow: hidden;
108
123
  font: 13px system-ui, sans-serif;
109
124
  color: #ccc;
110
125
  }
111
- .panel.visible { display: flex; }
112
126
 
113
127
  .panel-header {
114
128
  display: flex;
@@ -228,7 +242,7 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
228
242
  .issue-icon { font-size: 10px; }
229
243
  \`;
230
244
 
231
- shadow.innerHTML = '<style>' + css + '</style><div class="spotlight" id="spotlight"><div class="spotlight-box" id="spotlight-box"></div></div><div class="panel" id="panel"></div>';
245
+ shadow.innerHTML = '<style>' + css + '</style><dialog id="spotlight-dialog"><div class="spotlight"><div class="spotlight-box" id="spotlight-box"></div></div></dialog><dialog class="panel-dialog" id="panel-dialog"><div class="panel" id="panel"></div></dialog>';
232
246
  document.body.appendChild(host);
233
247
 
234
248
  setupSpotlight();
@@ -250,7 +264,8 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
250
264
  // our element was removed (likely by React hydration), re-create it
251
265
  host = null;
252
266
  shadow = null;
253
- spotlight = null;
267
+ spotlightDialog = null;
268
+ panelDialog = null;
254
269
  panel = null;
255
270
  setTimeout(createHost, 0);
256
271
  return;
@@ -263,7 +278,7 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
263
278
  }
264
279
 
265
280
  function setupSpotlight() {
266
- spotlight = shadow.getElementById('spotlight');
281
+ spotlightDialog = shadow.getElementById('spotlight-dialog');
267
282
  var box = shadow.getElementById('spotlight-box');
268
283
 
269
284
  var items = [
@@ -287,12 +302,14 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
287
302
  }
288
303
  });
289
304
 
290
- spotlight.addEventListener('click', function(e) {
291
- if (e.target === spotlight) hideSpotlight();
305
+ // close on backdrop click
306
+ spotlightDialog.addEventListener('click', function(e) {
307
+ if (e.target === spotlightDialog) spotlightDialog.close();
292
308
  });
293
309
  }
294
310
 
295
311
  function setupPanel() {
312
+ panelDialog = shadow.getElementById('panel-dialog');
296
313
  panel = shadow.getElementById('panel');
297
314
  panel.innerHTML = '<div class="panel-header" id="panel-header">' + LOGO_SVG + '<span class="panel-title">DevTools</span><button class="panel-close" id="panel-close">\xD7</button></div><div class="tabs" id="tabs"><button class="tab active" data-tab="seo">SEO</button><button class="tab" data-tab="route">Route</button><button class="tab" data-tab="loader">Loader</button><button class="tab" data-tab="errors">Errors</button></div><div class="content" id="content"></div>';
298
315
 
@@ -317,7 +334,7 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
317
334
  header.addEventListener('mousedown', function(e) {
318
335
  if (e.target.closest('.panel-close')) return;
319
336
  isDragging = true;
320
- var rect = panel.getBoundingClientRect();
337
+ var rect = panelDialog.getBoundingClientRect();
321
338
  dragOffset.x = e.clientX - rect.left;
322
339
  dragOffset.y = e.clientY - rect.top;
323
340
  // Store current position before resetting snap state
@@ -333,8 +350,8 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
333
350
  var snapDist = 20;
334
351
  var w = window.innerWidth;
335
352
  var h = window.innerHeight;
336
- var pw = panel.offsetWidth;
337
- var ph = panel.offsetHeight;
353
+ var pw = panelDialog.offsetWidth;
354
+ var ph = panelDialog.offsetHeight;
338
355
  var pad = 10;
339
356
 
340
357
  var snapH = null;
@@ -349,27 +366,27 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
349
366
 
350
367
  // Apply horizontal positioning
351
368
  if (snapH === 'left') {
352
- panel.style.left = pad + 'px';
353
- panel.style.right = 'auto';
369
+ panelDialog.style.left = pad + 'px';
370
+ panelDialog.style.right = 'auto';
354
371
  } else if (snapH === 'right') {
355
- panel.style.left = 'auto';
356
- panel.style.right = pad + 'px';
372
+ panelDialog.style.left = 'auto';
373
+ panelDialog.style.right = pad + 'px';
357
374
  } else {
358
- panel.style.left = x + 'px';
359
- panel.style.right = 'auto';
375
+ panelDialog.style.left = x + 'px';
376
+ panelDialog.style.right = 'auto';
360
377
  panelPos.x = x;
361
378
  }
362
379
 
363
380
  // Apply vertical positioning
364
381
  if (snapV === 'top') {
365
- panel.style.top = pad + 'px';
366
- panel.style.bottom = 'auto';
382
+ panelDialog.style.top = pad + 'px';
383
+ panelDialog.style.bottom = 'auto';
367
384
  } else if (snapV === 'bottom') {
368
- panel.style.top = 'auto';
369
- panel.style.bottom = pad + 'px';
385
+ panelDialog.style.top = 'auto';
386
+ panelDialog.style.bottom = pad + 'px';
370
387
  } else {
371
- panel.style.top = y + 'px';
372
- panel.style.bottom = 'auto';
388
+ panelDialog.style.top = y + 'px';
389
+ panelDialog.style.bottom = 'auto';
373
390
  panelPos.y = y;
374
391
  }
375
392
  });
@@ -397,24 +414,26 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
397
414
  showPanel();
398
415
  }
399
416
  } else if (e.code === 'Escape') {
400
- if (spotlight && spotlight.classList.contains('visible')) hideSpotlight();
401
- else if (panel && panel.classList.contains('visible')) hidePanel();
417
+ // dialogs handle escape natively, but we need to handle the case where escape is pressed
418
+ // when only one is open
419
+ if (spotlightDialog && spotlightDialog.open) spotlightDialog.close();
420
+ else if (panelDialog && panelDialog.open) panelDialog.close();
402
421
  }
403
422
  });
404
423
  }
405
424
 
406
425
  function toggleSpotlight() {
407
- if (spotlight && spotlight.classList.contains('visible')) hideSpotlight();
426
+ if (spotlightDialog && spotlightDialog.open) hideSpotlight();
408
427
  else showSpotlight();
409
428
  }
410
429
 
411
430
  function showSpotlight() {
412
431
  if (!host) createHost();
413
- spotlight.classList.add('visible');
432
+ spotlightDialog.showModal();
414
433
  }
415
434
 
416
435
  function hideSpotlight() {
417
- spotlight.classList.remove('visible');
436
+ spotlightDialog.close();
418
437
  }
419
438
 
420
439
  function showPanel() {
@@ -422,33 +441,33 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
422
441
  var pad = 10;
423
442
  // Apply horizontal positioning based on snap state
424
443
  if (snappedEdge.h === 'left') {
425
- panel.style.left = pad + 'px';
426
- panel.style.right = 'auto';
444
+ panelDialog.style.left = pad + 'px';
445
+ panelDialog.style.right = 'auto';
427
446
  } else if (snappedEdge.h === 'right') {
428
- panel.style.left = 'auto';
429
- panel.style.right = pad + 'px';
447
+ panelDialog.style.left = 'auto';
448
+ panelDialog.style.right = pad + 'px';
430
449
  } else {
431
- panel.style.left = panelPos.x + 'px';
432
- panel.style.right = 'auto';
450
+ panelDialog.style.left = panelPos.x + 'px';
451
+ panelDialog.style.right = 'auto';
433
452
  }
434
453
  // Apply vertical positioning based on snap state
435
454
  if (snappedEdge.v === 'top') {
436
- panel.style.top = pad + 'px';
437
- panel.style.bottom = 'auto';
455
+ panelDialog.style.top = pad + 'px';
456
+ panelDialog.style.bottom = 'auto';
438
457
  } else if (snappedEdge.v === 'bottom') {
439
- panel.style.top = 'auto';
440
- panel.style.bottom = pad + 'px';
458
+ panelDialog.style.top = 'auto';
459
+ panelDialog.style.bottom = pad + 'px';
441
460
  } else {
442
- panel.style.top = panelPos.y + 'px';
443
- panel.style.bottom = 'auto';
461
+ panelDialog.style.top = panelPos.y + 'px';
462
+ panelDialog.style.bottom = 'auto';
444
463
  }
445
- panel.classList.add('visible');
464
+ panelDialog.show();
446
465
  updateTabs();
447
466
  updateContent();
448
467
  }
449
468
 
450
469
  function hidePanel() {
451
- panel.classList.remove('visible');
470
+ panelDialog.close();
452
471
  }
453
472
 
454
473
  function updateTabs() {
@@ -622,19 +641,19 @@ const ROUTE_HMR_SCRIPT = 'import { createHotContext } from "/@vite/client"; cons
622
641
 
623
642
  // Listen for events
624
643
  window.addEventListener('one-loader-timing', function() {
625
- if (panel && panel.classList.contains('visible') && activeTab === 'loader') updateContent();
644
+ if (panelDialog && panelDialog.open && activeTab === 'loader') updateContent();
626
645
  });
627
646
  window.addEventListener('one-error', function(e) {
628
647
  var devtools = window.__oneDevtools = window.__oneDevtools || {};
629
648
  devtools.errorHistory = devtools.errorHistory || [];
630
649
  devtools.errorHistory.unshift(e.detail);
631
650
  if (devtools.errorHistory.length > 20) devtools.errorHistory = devtools.errorHistory.slice(0, 20);
632
- if (panel && panel.classList.contains('visible') && activeTab === 'errors') updateContent();
651
+ if (panelDialog && panelDialog.open && activeTab === 'errors') updateContent();
633
652
  });
634
653
 
635
654
  // Update on navigation
636
655
  function onNavigate() {
637
- if (panel && panel.classList.contains('visible')) updateContent();
656
+ if (panelDialog && panelDialog.open) updateContent();
638
657
  }
639
658
  window.addEventListener('popstate', onNavigate);
640
659
  window.addEventListener('one-hmr-update', onNavigate);