@svelte-devtools/vite-plugin 0.1.1 → 0.1.3

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 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,MAAM,CAAC;AAUnC,MAAM,WAAW,qBAAqB;IACpC,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;CACzB;AAqBD;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,OAAO,GAAE,qBAA0B,GAAG,MAAM,CA0G1E"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,MAAM,CAAC;AAcnC,MAAM,WAAW,qBAAqB;IACpC,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;CACzB;AAqBD;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,OAAO,GAAE,qBAA0B,GAAG,MAAM,CA0G1E"}
package/dist/index.js CHANGED
@@ -2,7 +2,11 @@ import { existsSync, readFileSync } from 'fs';
2
2
  import { resolve } from 'path';
3
3
  import { fileURLToPath } from 'url';
4
4
  const __dirname = fileURLToPath(new URL('.', import.meta.url));
5
- const overlayPath = resolve(__dirname, 'overlay.js');
5
+ // npm install: overlay.js is copied alongside dist/index.js
6
+ // monorepo dev: TypeScript source is loaded from src/, overlay lives in ../../overlay/dist/
7
+ const overlayPath = existsSync(resolve(__dirname, 'overlay.js'))
8
+ ? resolve(__dirname, 'overlay.js')
9
+ : resolve(__dirname, '..', '..', 'overlay', 'dist', 'overlay.js');
6
10
  const VIRTUAL_ID = 'virtual:svelte-devtools';
7
11
  const RESOLVED_ID = '\0virtual:svelte-devtools';
8
12
  const OVERLAY_VIRTUAL_ID = 'virtual:svelte-devtools-overlay';
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
package/dist/overlay.js CHANGED
@@ -3149,13 +3149,6 @@ function from_namespace(content, flags2, ns = "svg") {
3149
3149
  function from_svg(content, flags2) {
3150
3150
  return /* @__PURE__ */ from_namespace(content, flags2, "svg");
3151
3151
  }
3152
- function text(value = "") {
3153
- {
3154
- var t = create_text(value + "");
3155
- assign_nodes(t, t);
3156
- return t;
3157
- }
3158
- }
3159
3152
  function comment() {
3160
3153
  var frag = document.createDocumentFragment();
3161
3154
  var start = document.createComment("");
@@ -3173,12 +3166,12 @@ function append(anchor, dom) {
3173
3166
  dom
3174
3167
  );
3175
3168
  }
3176
- function set_text(text2, value) {
3169
+ function set_text(text, value) {
3177
3170
  var str = value == null ? "" : typeof value === "object" ? `${value}` : value;
3178
3171
  if (str !== /** @type {any} */
3179
- (text2[TEXT_CACHE] ?? (text2[TEXT_CACHE] = text2.nodeValue))) {
3180
- text2[TEXT_CACHE] = str;
3181
- text2.nodeValue = `${str}`;
3172
+ (text[TEXT_CACHE] ?? (text[TEXT_CACHE] = text.nodeValue))) {
3173
+ text[TEXT_CACHE] = str;
3174
+ text.nodeValue = `${str}`;
3182
3175
  }
3183
3176
  }
3184
3177
  function mount(component, options) {
@@ -4244,17 +4237,20 @@ const CSS = `
4244
4237
  /* ── Toggle button ── */
4245
4238
  .sdt-toggle {
4246
4239
  position: absolute;
4247
- bottom: 20px;
4248
- right: 20px;
4249
- width: 46px;
4250
- height: 46px;
4251
- border-radius: 50%;
4240
+ bottom: max(20px, calc(env(safe-area-inset-bottom) + 8px));
4241
+ left: 0;
4242
+ right: 0;
4243
+ margin: 0 auto;
4244
+ width: fit-content;
4245
+ height: 36px;
4246
+ padding: 0 16px 0 10px;
4247
+ border-radius: 999px;
4252
4248
  background: white;
4253
4249
  border: none;
4254
4250
  cursor: pointer;
4255
4251
  display: flex;
4256
4252
  align-items: center;
4257
- justify-content: center;
4253
+ gap: 8px;
4258
4254
  pointer-events: auto;
4259
4255
  box-shadow:
4260
4256
  0 0 0 1px rgba(0 0 0 / 0.08),
@@ -4263,14 +4259,19 @@ const CSS = `
4263
4259
  transition: transform 0.15s ease, box-shadow 0.15s ease;
4264
4260
  outline: none;
4265
4261
  color: #1e1e2e;
4262
+ font-family: system-ui, -apple-system, sans-serif;
4263
+ font-size: 13px;
4264
+ font-weight: 600;
4265
+ white-space: nowrap;
4266
+ letter-spacing: 0.01em;
4266
4267
  }
4267
4268
 
4268
4269
  .sdt-toggle:hover {
4269
- transform: scale(1.08);
4270
- box-shadow: 0 6px 24px rgba(0 0 0 / 0.45);
4270
+ transform: scale(1.05);
4271
+ box-shadow: 0 6px 24px rgba(0 0 0 / 0.35);
4271
4272
  }
4272
4273
 
4273
- .sdt-toggle:active { transform: scale(0.96); }
4274
+ .sdt-toggle:active { transform: scale(0.97); }
4274
4275
 
4275
4276
  .sdt-toggle.sdt-toggle--open {
4276
4277
  background: #1e1e2e;
@@ -4293,6 +4294,7 @@ const CSS = `
4293
4294
  left: auto;
4294
4295
  bottom: 0;
4295
4296
  right: 0;
4297
+ max-width: 92dvw;
4296
4298
  animation: sdt-slide-right 0.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
4297
4299
  }
4298
4300
 
@@ -4308,6 +4310,7 @@ const CSS = `
4308
4310
 
4309
4311
  /* ── Panel ── */
4310
4312
  .sdt-panel {
4313
+ container-type: inline-size;
4311
4314
  background: #1e1e2e;
4312
4315
  color: #cdd6f4;
4313
4316
  display: flex;
@@ -4348,13 +4351,14 @@ const CSS = `
4348
4351
  }
4349
4352
 
4350
4353
  .sdt-resize-handle:hover { background: rgba(255 62 0 / 0.15); }
4354
+ .sdt-resize-handle, .sdt-resize-handle--right { touch-action: none; }
4351
4355
 
4352
4356
  /* ── Position toggle ── */
4353
4357
  .sdt-position-toggle {
4354
4358
  background: transparent;
4355
4359
  border: none;
4356
4360
  color: #45475a;
4357
- width: 32px;
4361
+ width: 44px;
4358
4362
  height: 44px;
4359
4363
  cursor: pointer;
4360
4364
  display: flex;
@@ -4448,6 +4452,14 @@ const CSS = `
4448
4452
 
4449
4453
  .sdt-close:hover { color: #cdd6f4; background: #1e1e2e; }
4450
4454
 
4455
+ /* ── Narrow panel: hide text labels, tighten spacing ── */
4456
+ @container (max-width: 480px) {
4457
+ .sdt-logo-text { display: none; }
4458
+ .sdt-tab-label { display: none; }
4459
+ .sdt-logo { padding: 0 10px; }
4460
+ .sdt-tab { padding: 0 10px; }
4461
+ }
4462
+
4451
4463
  /* ── Content area ── */
4452
4464
  .sdt-content {
4453
4465
  flex: 1;
@@ -4455,6 +4467,8 @@ const CSS = `
4455
4467
  min-height: 0;
4456
4468
  scrollbar-width: thin;
4457
4469
  scrollbar-color: #313244 transparent;
4470
+ overscroll-behavior: contain;
4471
+ padding-bottom: env(safe-area-inset-bottom);
4458
4472
  }
4459
4473
 
4460
4474
  /* ── Routes tab ── */
@@ -4573,11 +4587,16 @@ const CSS = `
4573
4587
  border: none;
4574
4588
  color: #45475a;
4575
4589
  font-size: 10px;
4576
- width: 14px;
4590
+ width: 28px;
4591
+ height: 28px;
4592
+ margin: -6px -7px -6px -7px;
4577
4593
  cursor: pointer;
4578
4594
  flex-shrink: 0;
4579
4595
  line-height: 1;
4580
4596
  font-family: inherit;
4597
+ display: flex;
4598
+ align-items: center;
4599
+ justify-content: center;
4581
4600
  }
4582
4601
 
4583
4602
  .sdt-tag-name { color: #f38ba8; font-family: monospace; font-size: 12.5px; }
@@ -4625,12 +4644,17 @@ const CSS = `
4625
4644
  border: none;
4626
4645
  color: #45475a;
4627
4646
  font-size: 10px;
4628
- width: 14px;
4647
+ width: 28px;
4648
+ height: 28px;
4649
+ margin: -6px -7px -6px -7px;
4629
4650
  cursor: pointer;
4630
4651
  flex-shrink: 0;
4631
- line-height: 20px;
4652
+ line-height: 1;
4632
4653
  font-family: monospace;
4633
4654
  padding: 0;
4655
+ display: flex;
4656
+ align-items: center;
4657
+ justify-content: center;
4634
4658
  }
4635
4659
 
4636
4660
  .sdt-json-toggle--summary { width: auto; color: #6c7086; }
@@ -4691,15 +4715,15 @@ const PUBLIC_VERSION = "5";
4691
4715
  if (typeof window !== "undefined") {
4692
4716
  ((_b = window.__svelte ?? (window.__svelte = {})).v ?? (_b.v = /* @__PURE__ */ new Set())).add(PUBLIC_VERSION);
4693
4717
  }
4694
- var root_2$4 = /* @__PURE__ */ from_html(`<div class="sdt-nav-indicator"><span class="sdt-spinner"></span> Navigating to <span class="sdt-mono" style="color:inherit"> </span></div>`);
4695
- var root_4$3 = /* @__PURE__ */ from_html(`<span class="sdt-key"> </span> <code class="sdt-val sdt-val-str"> </code>`, 1);
4718
+ var root_2$3 = /* @__PURE__ */ from_html(`<div class="sdt-nav-indicator"><span class="sdt-spinner"></span> Navigating to <span class="sdt-mono" style="color:inherit"> </span></div>`);
4719
+ var root_4$2 = /* @__PURE__ */ from_html(`<span class="sdt-key"> </span> <code class="sdt-val sdt-val-str"> </code>`, 1);
4696
4720
  var root_3$4 = /* @__PURE__ */ from_html(`<div class="sdt-section"><div class="sdt-section-title">Route Params</div> <div class="sdt-kv"></div></div>`);
4697
4721
  var root_6$2 = /* @__PURE__ */ from_html(`<span class="sdt-key"> </span> <code> </code>`, 1);
4698
- var root_5$3 = /* @__PURE__ */ from_html(`<div class="sdt-section"><div class="sdt-section-title">Page Data</div> <div class="sdt-kv"></div></div>`);
4722
+ var root_5$2 = /* @__PURE__ */ from_html(`<div class="sdt-section"><div class="sdt-section-title">Page Data</div> <div class="sdt-kv"></div></div>`);
4699
4723
  var root_7$2 = /* @__PURE__ */ from_html(`<div class="sdt-section"><div class="sdt-section-title">Page Data</div> <span style="color:#6c7086;font-size:12px">No data returned from load()</span></div>`);
4700
4724
  var root_8$2 = /* @__PURE__ */ from_html(`<div class="sdt-section"><div class="sdt-section-title">Form Action Data</div> <code class="sdt-val" style="font-size:11px"> </code></div>`);
4701
4725
  var root_9$2 = /* @__PURE__ */ from_html(`<div class="sdt-section"><div class="sdt-section-title" style="color:#f38ba8">Page Error</div> <code class="sdt-val sdt-val-err"> </code></div>`);
4702
- var root_1$4 = /* @__PURE__ */ from_html(`<!> <div><div class="sdt-info-row"><span class="sdt-badge">Route</span> <code class="sdt-mono"> </code></div> <div class="sdt-info-row"><span class="sdt-badge">URL</span> <code class="sdt-mono sdt-val-url"> </code></div> <div class="sdt-info-row"><span class="sdt-badge">Status</span> <code> </code></div></div> <!> <!> <!> <!>`, 1);
4726
+ var root_1$5 = /* @__PURE__ */ from_html(`<!> <div><div class="sdt-info-row"><span class="sdt-badge">Route</span> <code class="sdt-mono"> </code></div> <div class="sdt-info-row"><span class="sdt-badge">URL</span> <code class="sdt-mono sdt-val-url"> </code></div> <div class="sdt-info-row"><span class="sdt-badge">Status</span> <code> </code></div></div> <!> <!> <!> <!>`, 1);
4703
4727
  var root_10$2 = /* @__PURE__ */ from_html(`<div class="sdt-empty"><span class="sdt-empty-icon">⟨/⟩</span> <span>No SvelteKit page data detected.</span> <span style="color:#45475a;font-size:11px">Ensure the Vite plugin is installed in a SvelteKit project.</span></div>`);
4704
4728
  var root$5 = /* @__PURE__ */ from_html(`<div class="sdt-routes"><!></div>`);
4705
4729
  function RoutesTab($$anchor, $$props) {
@@ -4739,16 +4763,16 @@ function RoutesTab($$anchor, $$props) {
4739
4763
  var node = child(div);
4740
4764
  {
4741
4765
  var consequent_6 = ($$anchor2) => {
4742
- var fragment = root_1$4();
4766
+ var fragment = root_1$5();
4743
4767
  var node_1 = first_child(fragment);
4744
4768
  {
4745
4769
  var consequent = ($$anchor3) => {
4746
- var div_1 = root_2$4();
4770
+ var div_1 = root_2$3();
4747
4771
  var span = sibling(child(div_1), 2);
4748
- var text2 = child(span);
4772
+ var text = child(span);
4749
4773
  template_effect(() => {
4750
4774
  var _a2, _b2;
4751
- return set_text(text2, ((_b2 = (_a2 = get(navigating).to) == null ? void 0 : _a2.url) == null ? void 0 : _b2.pathname) ?? "…");
4775
+ return set_text(text, ((_b2 = (_a2 = get(navigating).to) == null ? void 0 : _a2.url) == null ? void 0 : _b2.pathname) ?? "…");
4752
4776
  });
4753
4777
  append($$anchor3, div_1);
4754
4778
  };
@@ -4775,7 +4799,7 @@ function RoutesTab($$anchor, $$props) {
4775
4799
  var $$array = /* @__PURE__ */ user_derived(() => to_array(get($$item), 2));
4776
4800
  let k = () => get($$array)[0];
4777
4801
  let v = () => get($$array)[1];
4778
- var fragment_1 = root_4$3();
4802
+ var fragment_1 = root_4$2();
4779
4803
  var span_1 = first_child(fragment_1);
4780
4804
  var text_4 = child(span_1);
4781
4805
  var code_4 = sibling(span_1, 2);
@@ -4796,7 +4820,7 @@ function RoutesTab($$anchor, $$props) {
4796
4820
  var node_3 = sibling(node_2, 2);
4797
4821
  {
4798
4822
  var consequent_2 = ($$anchor3) => {
4799
- var div_8 = root_5$3();
4823
+ var div_8 = root_5$2();
4800
4824
  var div_9 = sibling(child(div_8), 2);
4801
4825
  each(div_9, 21, () => Object.entries(get(page).data), index, ($$anchor4, $$item) => {
4802
4826
  var $$array_1 = /* @__PURE__ */ user_derived(() => to_array(get($$item), 2));
@@ -4879,15 +4903,15 @@ function RoutesTab($$anchor, $$props) {
4879
4903
  append($$anchor, div);
4880
4904
  pop();
4881
4905
  }
4882
- var root_2$3 = /* @__PURE__ */ from_html(`<button class="sdt-dom-node-toggle"> </button>`);
4906
+ var root_2$2 = /* @__PURE__ */ from_html(`<button class="sdt-dom-node-toggle"> </button>`);
4883
4907
  var root_3$3 = /* @__PURE__ */ from_html(`<span class="sdt-dom-node-toggle"></span>`);
4884
- var root_4$2 = /* @__PURE__ */ from_html(`<span class="sdt-component-name"> </span> <span class="sdt-dom-tag-hint"> </span>`, 1);
4885
- var root_5$2 = /* @__PURE__ */ from_html(`<span class="sdt-tag-name"> </span>`);
4908
+ var root_4$1 = /* @__PURE__ */ from_html(`<span class="sdt-component-name"> </span> <span class="sdt-dom-tag-hint"> </span>`, 1);
4909
+ var root_5$1 = /* @__PURE__ */ from_html(`<span class="sdt-tag-name"> </span>`);
4886
4910
  var root_6$1 = /* @__PURE__ */ from_html(`<span class="sdt-attr-id"> </span>`);
4887
4911
  var root_8$1 = /* @__PURE__ */ from_html(`<span class="sdt-dom-overflow"> </span>`);
4888
4912
  var root_7$1 = /* @__PURE__ */ from_html(`<span class="sdt-attr-cls"> </span> <!>`, 1);
4889
4913
  var root_9$1 = /* @__PURE__ */ from_html(`<span class="sdt-json-count"> </span>`);
4890
- var root_1$3 = /* @__PURE__ */ from_html(`<div role="treeitem"><!> <!> <!> <!> <!></div>`);
4914
+ var root_1$4 = /* @__PURE__ */ from_html(`<div role="treeitem"><!> <!> <!> <!> <!></div>`);
4891
4915
  var root_10$1 = /* @__PURE__ */ from_html(`<div class="sdt-empty"><span class="sdt-empty-icon">◈</span> <span>No elements found.</span></div>`);
4892
4916
  var root$4 = /* @__PURE__ */ from_html(`<div class="sdt-components"><!> <!></div>`);
4893
4917
  function ComponentsTab($$anchor, $$props) {
@@ -4938,10 +4962,8 @@ function ComponentsTab($$anchor, $$props) {
4938
4962
  childCount: el.children.length,
4939
4963
  key: `node-${keyCounter++}`
4940
4964
  });
4941
- if (depth < 8) {
4942
- for (const child2 of el.children) {
4943
- walk(child2, depth + 1);
4944
- }
4965
+ for (const child2 of el.children) {
4966
+ walk(child2, depth + 1);
4945
4967
  }
4946
4968
  }
4947
4969
  walk(document.body, 0);
@@ -4990,18 +5012,18 @@ function ComponentsTab($$anchor, $$props) {
4990
5012
  var node_1 = child(div);
4991
5013
  each(node_1, 17, () => get(visibleNodes), index, ($$anchor2, node) => {
4992
5014
  const isCollapsed = /* @__PURE__ */ user_derived(() => get(collapsed).has(get(node).key));
4993
- var div_1 = root_1$3();
5015
+ var div_1 = root_1$4();
4994
5016
  let classes_1;
4995
5017
  set_attribute(div_1, "tabindex", 0);
4996
5018
  let styles;
4997
5019
  var node_2 = child(div_1);
4998
5020
  {
4999
5021
  var consequent = ($$anchor3) => {
5000
- var button = root_2$3();
5001
- var text2 = child(button);
5022
+ var button = root_2$2();
5023
+ var text = child(button);
5002
5024
  template_effect(() => {
5003
5025
  set_attribute(button, "aria-label", get(isCollapsed) ? "Expand" : "Collapse");
5004
- set_text(text2, get(isCollapsed) ? "▸" : "▾");
5026
+ set_text(text, get(isCollapsed) ? "▸" : "▾");
5005
5027
  });
5006
5028
  delegated("click", button, () => toggleCollapse(get(node).key));
5007
5029
  append($$anchor3, button);
@@ -5018,7 +5040,7 @@ function ComponentsTab($$anchor, $$props) {
5018
5040
  var node_3 = sibling(node_2, 2);
5019
5041
  {
5020
5042
  var consequent_1 = ($$anchor3) => {
5021
- var fragment = root_4$2();
5043
+ var fragment = root_4$1();
5022
5044
  var span_1 = first_child(fragment);
5023
5045
  var text_1 = child(span_1);
5024
5046
  var span_2 = sibling(span_1, 2);
@@ -5030,7 +5052,7 @@ function ComponentsTab($$anchor, $$props) {
5030
5052
  append($$anchor3, fragment);
5031
5053
  };
5032
5054
  var alternate_1 = ($$anchor3) => {
5033
- var span_3 = root_5$2();
5055
+ var span_3 = root_5$1();
5034
5056
  var text_3 = child(span_3);
5035
5057
  template_effect(() => set_text(text_3, `<${get(node).tag ?? ""}>`));
5036
5058
  append($$anchor3, span_3);
@@ -5119,10 +5141,10 @@ function ComponentsTab($$anchor, $$props) {
5119
5141
  pop();
5120
5142
  }
5121
5143
  delegate(["keydown", "click"]);
5122
- var root_1$2 = /* @__PURE__ */ from_html(`<button class="sdt-json-toggle"> </button>`);
5123
- var root_2$2 = /* @__PURE__ */ from_html(`<span class="sdt-json-toggle"></span>`);
5144
+ var root_1$3 = /* @__PURE__ */ from_html(`<button class="sdt-json-toggle"> </button>`);
5145
+ var root_2$1 = /* @__PURE__ */ from_html(`<span class="sdt-json-toggle"></span>`);
5124
5146
  var root_3$2 = /* @__PURE__ */ from_html(`<span class="sdt-json-key"> </span> <span class="sdt-json-colon">:</span>`, 1);
5125
- var root_4$1 = /* @__PURE__ */ from_html(`<span> </span>`);
5147
+ var root_4 = /* @__PURE__ */ from_html(`<span> </span>`);
5126
5148
  var root_6 = /* @__PURE__ */ from_html(`<span class="sdt-json-brace"> </span>`);
5127
5149
  var root_7 = /* @__PURE__ */ from_html(`<span class="sdt-json-brace"> </span>`);
5128
5150
  var root_8 = /* @__PURE__ */ from_html(`<button class="sdt-json-toggle sdt-json-toggle--summary"> <span class="sdt-json-count"> </span> </button>`);
@@ -5228,17 +5250,17 @@ function JsonNode_1($$anchor, $$props) {
5228
5250
  var node = child(div);
5229
5251
  {
5230
5252
  var consequent = ($$anchor2) => {
5231
- var button = root_1$2();
5232
- var text2 = child(button);
5253
+ var button = root_1$3();
5254
+ var text = child(button);
5233
5255
  template_effect(() => {
5234
5256
  set_attribute(button, "aria-label", get(expanded) ? "Collapse" : "Expand");
5235
- set_text(text2, get(expanded) ? "▾" : "▸");
5257
+ set_text(text, get(expanded) ? "▾" : "▸");
5236
5258
  });
5237
5259
  delegated("click", button, () => set(expanded, !get(expanded)));
5238
5260
  append($$anchor2, button);
5239
5261
  };
5240
5262
  var alternate = ($$anchor2) => {
5241
- var span = root_2$2();
5263
+ var span = root_2$1();
5242
5264
  append($$anchor2, span);
5243
5265
  };
5244
5266
  if_block(node, ($$render) => {
@@ -5262,7 +5284,7 @@ function JsonNode_1($$anchor, $$props) {
5262
5284
  var node_2 = sibling(node_1, 2);
5263
5285
  {
5264
5286
  var consequent_2 = ($$anchor2) => {
5265
- var span_2 = root_4$1();
5287
+ var span_2 = root_4();
5266
5288
  var text_2 = child(span_2);
5267
5289
  template_effect(
5268
5290
  ($0, $1) => {
@@ -5377,9 +5399,9 @@ function JsonNode_1($$anchor, $$props) {
5377
5399
  pop();
5378
5400
  }
5379
5401
  delegate(["click"]);
5380
- var root_1$1 = /* @__PURE__ */ from_html(`<div class="sdt-state-section-label">Component State</div> <!>`, 1);
5402
+ var root_1$2 = /* @__PURE__ */ from_html(`<div class="sdt-state-section-label">Component State</div> <!>`, 1);
5381
5403
  var root_3$1 = /* @__PURE__ */ from_html(`<div class="sdt-state-section-label">Page Store</div> <!>`, 1);
5382
- var root_5$1 = /* @__PURE__ */ from_html(`<div class="sdt-empty"><span class="sdt-empty-icon"></span> <span>No state data available.</span> <span style="color:#45475a;font-size:11px">SvelteKit page store not detected.</span></div>`);
5404
+ var root_5 = /* @__PURE__ */ from_html(`<div class="sdt-empty"><span class="sdt-empty-icon"></span> <span>No state data available.</span> <span style="color:#45475a;font-size:11px">SvelteKit page store not detected.</span></div>`);
5383
5405
  var root$2 = /* @__PURE__ */ from_html(`<div class="sdt-state"><!> <!> <!></div>`);
5384
5406
  function StateTab($$anchor, $$props) {
5385
5407
  push($$props, true);
@@ -5413,7 +5435,7 @@ function StateTab($$anchor, $$props) {
5413
5435
  var node = child(div);
5414
5436
  {
5415
5437
  var consequent = ($$anchor2) => {
5416
- var fragment = root_1$1();
5438
+ var fragment = root_1$2();
5417
5439
  var node_1 = sibling(first_child(fragment), 2);
5418
5440
  each(node_1, 17, () => get(componentEntries), index, ($$anchor3, $$item) => {
5419
5441
  var $$array = /* @__PURE__ */ user_derived(() => to_array(get($$item), 2));
@@ -5462,7 +5484,7 @@ function StateTab($$anchor, $$props) {
5462
5484
  var node_4 = sibling(node_2, 2);
5463
5485
  {
5464
5486
  var consequent_2 = ($$anchor2) => {
5465
- var div_2 = root_5$1();
5487
+ var div_2 = root_5();
5466
5488
  var span = child(div_2);
5467
5489
  span.textContent = "{}";
5468
5490
  append($$anchor2, div_2);
@@ -5474,10 +5496,10 @@ function StateTab($$anchor, $$props) {
5474
5496
  append($$anchor, div);
5475
5497
  pop();
5476
5498
  }
5477
- var root_2$1 = /* @__PURE__ */ from_html(`<button role="tab"><span class="sdt-tab-icon"> </span> <!></button>`);
5478
- var root_4 = /* @__PURE__ */ from_svg(`<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><rect x="1.5" y="1.5" width="11" height="11" rx="1.5" stroke="currentColor" stroke-width="1.2"></rect><rect x="8" y="1.5" width="4.5" height="11" rx="0.5" fill="currentColor"></rect></svg>`);
5479
- var root_5 = /* @__PURE__ */ from_svg(`<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><rect x="1.5" y="1.5" width="11" height="11" rx="1.5" stroke="currentColor" stroke-width="1.2"></rect><rect x="1.5" y="8" width="11" height="4.5" rx="0.5" fill="currentColor"></rect></svg>`);
5480
- var root$1 = /* @__PURE__ */ from_html(`<div><button aria-label="Resize panel" title="Drag to resize"></button> <div class="sdt-header"><div class="sdt-logo" title="Svelte DevTools"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 512 512"><path d="M416.9 93.1c-41.1-58.9-122.4-76.3-181.2-38.9L132.5 120c-28.2 17.7-47.6 46.5-53.5 79.3-4.9 27.3-.6 55.5 12.3 80-8.8 13.4-14.9 28.5-17.7 44.2-5.9 33.4 1.8 67.8 21.6 95.4 41.2 58.9 122.4 76.3 181.2 38.9L379.6 392c28.2-17.7 47.6-46.5 53.5-79.3 4.9-27.3.6-55.5-12.3-80 8.8-13.4 14.9-28.4 17.7-44.2 5.8-33.4-1.9-67.8-21.6-95.4" style="fill:#ff3e00"></path><path d="M225.6 424.5c-33.3 8.6-68.4-4.4-88-32.6-11.9-16.6-16.5-37.3-13-57.4.6-3.3 1.4-6.5 2.5-9.6l1.9-5.9 5.3 3.9c12.2 9 25.9 15.8 40.4 20.2l3.8 1.2-.4 3.8c-.5 5.4 1 10.9 4.2 15.3 5.9 8.5 16.5 12.4 26.5 9.8 2.2-.6 4.4-1.5 6.3-2.8l103.2-65.8c5.1-3.2 8.6-8.4 9.7-14.4 1.1-6.1-.3-12.3-3.9-17.3-5.9-8.5-16.5-12.4-26.5-9.8-2.2.6-4.4 1.5-6.3 2.8L252 291c-6.5 4.1-13.5 7.2-21 9.2-33.3 8.6-68.4-4.4-88-32.6-11.9-16.6-16.5-37.3-13-57.4 3.5-19.7 15.2-37 32.2-47.7l103.2-65.8c6.5-4.1 13.5-7.2 21-9.2 33.3-8.6 68.4 4.4 88 32.6 11.9 16.6 16.5 37.3 13 57.4-.6 3.3-1.4 6.5-2.5 9.6L383 193l-5.3-3.9c-12.2-9-25.9-15.8-40.4-20.2l-3.8-1.2.4-3.8c.5-5.4-1-10.9-4.2-15.3-5.9-8.5-16.5-12.4-26.5-9.8-2.2.6-4.4 1.5-6.3 2.8l-103.2 65.8c-5.1 3.2-8.6 8.4-9.7 14.4-1.1 6.1.3 12.3 3.9 17.3 5.9 8.5 16.5 12.4 26.5 9.8 2.2-.6 4.4-1.5 6.3-2.8L260 221c6.5-4.1 13.5-7.2 21-9.2 33.3-8.6 68.4 4.4 88 32.6 11.9 16.6 16.5 37.3 13 57.4-3.5 19.7-15.2 37-32.2 47.7l-103.2 65.8c-6.5 4.1-13.6 7.2-21 9.2" style="fill:#fff"></path></svg> <!></div> <div class="sdt-tabs" role="tablist"></div> <button class="sdt-position-toggle"><!></button> <button class="sdt-close" title="Close (⌘⇧D)">✕</button></div> <div class="sdt-content" role="tabpanel"><!></div></div>`);
5499
+ var root_1$1 = /* @__PURE__ */ from_html(`<button role="tab"><span class="sdt-tab-icon"> </span> <span class="sdt-tab-label"> </span></button>`);
5500
+ var root_2 = /* @__PURE__ */ from_svg(`<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><rect x="1.5" y="1.5" width="11" height="11" rx="1.5" stroke="currentColor" stroke-width="1.2"></rect><rect x="8" y="1.5" width="4.5" height="11" rx="0.5" fill="currentColor"></rect></svg>`);
5501
+ var root_3 = /* @__PURE__ */ from_svg(`<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><rect x="1.5" y="1.5" width="11" height="11" rx="1.5" stroke="currentColor" stroke-width="1.2"></rect><rect x="1.5" y="8" width="11" height="4.5" rx="0.5" fill="currentColor"></rect></svg>`);
5502
+ var root$1 = /* @__PURE__ */ from_html(`<div><button aria-label="Resize panel" title="Drag to resize"></button> <div class="sdt-header"><div class="sdt-logo" title="Svelte DevTools"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 512 512"><path d="M416.9 93.1c-41.1-58.9-122.4-76.3-181.2-38.9L132.5 120c-28.2 17.7-47.6 46.5-53.5 79.3-4.9 27.3-.6 55.5 12.3 80-8.8 13.4-14.9 28.5-17.7 44.2-5.9 33.4 1.8 67.8 21.6 95.4 41.2 58.9 122.4 76.3 181.2 38.9L379.6 392c28.2-17.7 47.6-46.5 53.5-79.3 4.9-27.3.6-55.5-12.3-80 8.8-13.4 14.9-28.4 17.7-44.2 5.8-33.4-1.9-67.8-21.6-95.4" style="fill:#ff3e00"></path><path d="M225.6 424.5c-33.3 8.6-68.4-4.4-88-32.6-11.9-16.6-16.5-37.3-13-57.4.6-3.3 1.4-6.5 2.5-9.6l1.9-5.9 5.3 3.9c12.2 9 25.9 15.8 40.4 20.2l3.8 1.2-.4 3.8c-.5 5.4 1 10.9 4.2 15.3 5.9 8.5 16.5 12.4 26.5 9.8 2.2-.6 4.4-1.5 6.3-2.8l103.2-65.8c5.1-3.2 8.6-8.4 9.7-14.4 1.1-6.1-.3-12.3-3.9-17.3-5.9-8.5-16.5-12.4-26.5-9.8-2.2.6-4.4 1.5-6.3 2.8L252 291c-6.5 4.1-13.5 7.2-21 9.2-33.3 8.6-68.4-4.4-88-32.6-11.9-16.6-16.5-37.3-13-57.4 3.5-19.7 15.2-37 32.2-47.7l103.2-65.8c6.5-4.1 13.5-7.2 21-9.2 33.3-8.6 68.4 4.4 88 32.6 11.9 16.6 16.5 37.3 13 57.4-.6 3.3-1.4 6.5-2.5 9.6L383 193l-5.3-3.9c-12.2-9-25.9-15.8-40.4-20.2l-3.8-1.2.4-3.8c.5-5.4-1-10.9-4.2-15.3-5.9-8.5-16.5-12.4-26.5-9.8-2.2.6-4.4 1.5-6.3 2.8l-103.2 65.8c-5.1 3.2-8.6 8.4-9.7 14.4-1.1 6.1.3 12.3 3.9 17.3 5.9 8.5 16.5 12.4 26.5 9.8 2.2-.6 4.4-1.5 6.3-2.8L260 221c6.5-4.1 13.5-7.2 21-9.2 33.3-8.6 68.4 4.4 88 32.6 11.9 16.6 16.5 37.3 13 57.4-3.5 19.7-15.2 37-32.2 47.7l-103.2 65.8c-6.5 4.1-13.6 7.2-21 9.2" style="fill:#fff"></path></svg> <span class="sdt-logo-text">Svelte DevTools</span></div> <div class="sdt-tabs" role="tablist"></div> <button class="sdt-position-toggle"><!></button> <button class="sdt-close" title="Close (⇧⌥D)">✕</button></div> <div class="sdt-content" role="tabpanel"><!></div></div>`);
5481
5503
  function Panel($$anchor, $$props) {
5482
5504
  push($$props, true);
5483
5505
  function storageGet(key) {
@@ -5507,99 +5529,84 @@ function Panel($$anchor, $$props) {
5507
5529
  set(activeTab, id, true);
5508
5530
  storageSet("sdt:tab", id);
5509
5531
  }
5510
- function startResize(e) {
5511
- const startVal = $$props.position === "bottom" ? e.clientY : e.clientX;
5532
+ function startResize(startClientY, startClientX) {
5512
5533
  const startSize = $$props.position === "bottom" ? $$props.height : $$props.width;
5513
- e.preventDefault();
5514
- const onMove = (e2) => {
5515
- const delta = $$props.position === "bottom" ? startVal - e2.clientY : (
5534
+ const onMove = (clientY, clientX) => {
5535
+ const delta = $$props.position === "bottom" ? startClientY - clientY : (
5516
5536
  // drag up → taller
5517
- startVal - e2.clientX
5537
+ startClientX - clientX
5518
5538
  );
5519
5539
  const next = Math.min(900, Math.max(180, startSize + delta));
5520
5540
  $$props.onResize(next);
5521
5541
  };
5522
- const onUp = () => {
5523
- document.removeEventListener("mousemove", onMove);
5524
- document.removeEventListener("mouseup", onUp);
5542
+ const onMouseMove = (e) => onMove(e.clientY, e.clientX);
5543
+ const onTouchMove = (e) => onMove(e.touches[0].clientY, e.touches[0].clientX);
5544
+ const onEnd = () => {
5545
+ document.removeEventListener("mousemove", onMouseMove);
5546
+ document.removeEventListener("mouseup", onEnd);
5547
+ document.removeEventListener("touchmove", onTouchMove);
5548
+ document.removeEventListener("touchend", onEnd);
5525
5549
  };
5526
- document.addEventListener("mousemove", onMove);
5527
- document.addEventListener("mouseup", onUp);
5550
+ document.addEventListener("mousemove", onMouseMove);
5551
+ document.addEventListener("mouseup", onEnd);
5552
+ document.addEventListener("touchmove", onTouchMove, { passive: true });
5553
+ document.addEventListener("touchend", onEnd);
5528
5554
  }
5529
5555
  var div = root$1();
5530
5556
  let classes;
5531
5557
  var button = child(div);
5532
5558
  let classes_1;
5533
5559
  var div_1 = sibling(button, 2);
5534
- var div_2 = child(div_1);
5535
- var node = sibling(child(div_2), 2);
5536
- {
5537
- var consequent = ($$anchor2) => {
5538
- var text$1 = text("Svelte DevTools");
5539
- append($$anchor2, text$1);
5540
- };
5541
- if_block(node, ($$render) => {
5542
- if ($$props.position === "bottom") $$render(consequent);
5543
- });
5544
- }
5545
- var div_3 = sibling(div_2, 2);
5546
- each(div_3, 21, () => tabs, index, ($$anchor2, tab) => {
5547
- var button_1 = root_2$1();
5560
+ var div_2 = sibling(child(div_1), 2);
5561
+ each(div_2, 21, () => tabs, index, ($$anchor2, tab) => {
5562
+ var button_1 = root_1$1();
5548
5563
  let classes_2;
5549
5564
  var span = child(button_1);
5550
- var text_1 = child(span);
5551
- var node_1 = sibling(span, 2);
5552
- {
5553
- var consequent_1 = ($$anchor3) => {
5554
- var text_2 = text();
5555
- template_effect(() => set_text(text_2, get(tab).label));
5556
- append($$anchor3, text_2);
5557
- };
5558
- if_block(node_1, ($$render) => {
5559
- if ($$props.position === "bottom") $$render(consequent_1);
5560
- });
5561
- }
5565
+ var text = child(span);
5566
+ var span_1 = sibling(span, 2);
5567
+ var text_1 = child(span_1);
5562
5568
  template_effect(() => {
5563
5569
  classes_2 = set_class(button_1, 1, "sdt-tab", null, classes_2, { "sdt-tab--active": get(activeTab) === get(tab).id });
5564
5570
  set_attribute(button_1, "aria-selected", get(activeTab) === get(tab).id);
5565
5571
  set_attribute(button_1, "title", get(tab).label);
5566
- set_text(text_1, get(tab).icon);
5572
+ set_text(text, get(tab).icon);
5573
+ set_text(text_1, get(tab).label);
5567
5574
  });
5568
5575
  delegated("click", button_1, () => selectTab(get(tab).id));
5569
5576
  append($$anchor2, button_1);
5570
5577
  });
5571
- var button_2 = sibling(div_3, 2);
5572
- var node_2 = child(button_2);
5578
+ var button_2 = sibling(div_2, 2);
5579
+ var node = child(button_2);
5573
5580
  {
5574
- var consequent_2 = ($$anchor2) => {
5575
- var svg = root_4();
5581
+ var consequent = ($$anchor2) => {
5582
+ var svg = root_2();
5576
5583
  append($$anchor2, svg);
5577
5584
  };
5578
5585
  var alternate = ($$anchor2) => {
5579
- var svg_1 = root_5();
5586
+ var svg_1 = root_3();
5580
5587
  append($$anchor2, svg_1);
5581
5588
  };
5582
- if_block(node_2, ($$render) => {
5583
- if ($$props.position === "bottom") $$render(consequent_2);
5589
+ if_block(node, ($$render) => {
5590
+ if ($$props.position === "bottom") $$render(consequent);
5584
5591
  else $$render(alternate, -1);
5585
5592
  });
5586
5593
  }
5587
5594
  var button_3 = sibling(button_2, 2);
5588
- var div_4 = sibling(div_1, 2);
5589
- var node_3 = child(div_4);
5595
+ var div_3 = sibling(div_1, 2);
5596
+ var node_1 = child(div_3);
5590
5597
  {
5591
- var consequent_3 = ($$anchor2) => {
5598
+ var consequent_1 = ($$anchor2) => {
5592
5599
  RoutesTab($$anchor2, {});
5593
5600
  };
5594
- var consequent_4 = ($$anchor2) => {
5601
+ var consequent_2 = ($$anchor2) => {
5595
5602
  ComponentsTab($$anchor2, {});
5596
5603
  };
5597
5604
  var alternate_1 = ($$anchor2) => {
5598
5605
  StateTab($$anchor2, {});
5599
5606
  };
5600
- if_block(node_3, ($$render) => {
5601
- if (get(activeTab) === "routes") $$render(consequent_3);
5602
- else if (get(activeTab) === "components") $$render(consequent_4, 1);
5607
+ if_block(node_1, ($$render) => {
5608
+ if (get(activeTab) === "routes") $$render(consequent_1);
5609
+ else if (get(activeTab) === "components") $$render(consequent_2, 1);
5603
5610
  else $$render(alternate_1, -1);
5604
5611
  });
5605
5612
  }
@@ -5610,7 +5617,11 @@ function Panel($$anchor, $$props) {
5610
5617
  set_attribute(button_2, "title", $$props.position === "bottom" ? "Move to right" : "Move to bottom");
5611
5618
  set_attribute(button_2, "aria-label", $$props.position === "bottom" ? "Switch to right drawer" : "Switch to bottom drawer");
5612
5619
  });
5613
- delegated("mousedown", button, startResize);
5620
+ delegated("mousedown", button, (e) => {
5621
+ e.preventDefault();
5622
+ startResize(e.clientY, e.clientX);
5623
+ });
5624
+ delegated("touchstart", button, (e) => startResize(e.touches[0].clientY, e.touches[0].clientX));
5614
5625
  delegated("keydown", button, (e) => {
5615
5626
  if ($$props.position === "bottom") {
5616
5627
  if (e.key === "ArrowUp") $$props.onResize(Math.min(900, $$props.height + 20));
@@ -5628,11 +5639,9 @@ function Panel($$anchor, $$props) {
5628
5639
  append($$anchor, div);
5629
5640
  pop();
5630
5641
  }
5631
- delegate(["mousedown", "keydown", "click"]);
5632
- var root_1 = /* @__PURE__ */ from_svg(`<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor"><path d="M3 3l10 10M13 3L3 13" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" fill="none"></path></svg>`);
5633
- var root_2 = /* @__PURE__ */ from_svg(`<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 512 512"><path d="M416.9 93.1c-41.1-58.9-122.4-76.3-181.2-38.9L132.5 120c-28.2 17.7-47.6 46.5-53.5 79.3-4.9 27.3-.6 55.5 12.3 80-8.8 13.4-14.9 28.5-17.7 44.2-5.9 33.4 1.8 67.8 21.6 95.4 41.2 58.9 122.4 76.3 181.2 38.9L379.6 392c28.2-17.7 47.6-46.5 53.5-79.3 4.9-27.3.6-55.5-12.3-80 8.8-13.4 14.9-28.4 17.7-44.2 5.8-33.4-1.9-67.8-21.6-95.4" style="fill:#ff3e00"></path><path d="M225.6 424.5c-33.3 8.6-68.4-4.4-88-32.6-11.9-16.6-16.5-37.3-13-57.4.6-3.3 1.4-6.5 2.5-9.6l1.9-5.9 5.3 3.9c12.2 9 25.9 15.8 40.4 20.2l3.8 1.2-.4 3.8c-.5 5.4 1 10.9 4.2 15.3 5.9 8.5 16.5 12.4 26.5 9.8 2.2-.6 4.4-1.5 6.3-2.8l103.2-65.8c5.1-3.2 8.6-8.4 9.7-14.4 1.1-6.1-.3-12.3-3.9-17.3-5.9-8.5-16.5-12.4-26.5-9.8-2.2.6-4.4 1.5-6.3 2.8L252 291c-6.5 4.1-13.5 7.2-21 9.2-33.3 8.6-68.4-4.4-88-32.6-11.9-16.6-16.5-37.3-13-57.4 3.5-19.7 15.2-37 32.2-47.7l103.2-65.8c6.5-4.1 13.5-7.2 21-9.2 33.3-8.6 68.4 4.4 88 32.6 11.9 16.6 16.5 37.3 13 57.4-.6 3.3-1.4 6.5-2.5 9.6L383 193l-5.3-3.9c-12.2-9-25.9-15.8-40.4-20.2l-3.8-1.2.4-3.8c.5-5.4-1-10.9-4.2-15.3-5.9-8.5-16.5-12.4-26.5-9.8-2.2.6-4.4 1.5-6.3 2.8l-103.2 65.8c-5.1 3.2-8.6 8.4-9.7 14.4-1.1 6.1.3 12.3 3.9 17.3 5.9 8.5 16.5 12.4 26.5 9.8 2.2-.6 4.4-1.5 6.3-2.8L260 221c6.5-4.1 13.5-7.2 21-9.2 33.3-8.6 68.4 4.4 88 32.6 11.9 16.6 16.5 37.3 13 57.4-3.5 19.7-15.2 37-32.2 47.7l-103.2 65.8c-6.5 4.1-13.6 7.2-21 9.2" style="fill:#fff"></path></svg>`);
5634
- var root_3 = /* @__PURE__ */ from_html(`<div><!></div>`);
5635
- var root = /* @__PURE__ */ from_html(`<button aria-label="Toggle Svelte DevTools"><!></button> <!>`, 1);
5642
+ delegate(["mousedown", "touchstart", "keydown", "click"]);
5643
+ var root_1 = /* @__PURE__ */ from_html(`<div><!></div>`);
5644
+ var root = /* @__PURE__ */ from_html(`<button aria-label="Toggle Svelte DevTools"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 512 512"><path d="M416.9 93.1c-41.1-58.9-122.4-76.3-181.2-38.9L132.5 120c-28.2 17.7-47.6 46.5-53.5 79.3-4.9 27.3-.6 55.5 12.3 80-8.8 13.4-14.9 28.5-17.7 44.2-5.9 33.4 1.8 67.8 21.6 95.4 41.2 58.9 122.4 76.3 181.2 38.9L379.6 392c28.2-17.7 47.6-46.5 53.5-79.3 4.9-27.3.6-55.5-12.3-80 8.8-13.4 14.9-28.4 17.7-44.2 5.8-33.4-1.9-67.8-21.6-95.4" style="fill:#ff3e00"></path><path d="M225.6 424.5c-33.3 8.6-68.4-4.4-88-32.6-11.9-16.6-16.5-37.3-13-57.4.6-3.3 1.4-6.5 2.5-9.6l1.9-5.9 5.3 3.9c12.2 9 25.9 15.8 40.4 20.2l3.8 1.2-.4 3.8c-.5 5.4 1 10.9 4.2 15.3 5.9 8.5 16.5 12.4 26.5 9.8 2.2-.6 4.4-1.5 6.3-2.8l103.2-65.8c5.1-3.2 8.6-8.4 9.7-14.4 1.1-6.1-.3-12.3-3.9-17.3-5.9-8.5-16.5-12.4-26.5-9.8-2.2.6-4.4 1.5-6.3 2.8L252 291c-6.5 4.1-13.5 7.2-21 9.2-33.3 8.6-68.4-4.4-88-32.6-11.9-16.6-16.5-37.3-13-57.4 3.5-19.7 15.2-37 32.2-47.7l103.2-65.8c6.5-4.1 13.5-7.2 21-9.2 33.3-8.6 68.4 4.4 88 32.6 11.9 16.6 16.5 37.3 13 57.4-.6 3.3-1.4 6.5-2.5 9.6L383 193l-5.3-3.9c-12.2-9-25.9-15.8-40.4-20.2l-3.8-1.2.4-3.8c.5-5.4-1-10.9-4.2-15.3-5.9-8.5-16.5-12.4-26.5-9.8-2.2.6-4.4 1.5-6.3 2.8l-103.2 65.8c-5.1 3.2-8.6 8.4-9.7 14.4-1.1 6.1.3 12.3 3.9 17.3 5.9 8.5 16.5 12.4 26.5 9.8 2.2-.6 4.4-1.5 6.3-2.8L260 221c6.5-4.1 13.5-7.2 21-9.2 33.3-8.6 68.4 4.4 88 32.6 11.9 16.6 16.5 37.3 13 57.4-3.5 19.7-15.2 37-32.2 47.7l-103.2 65.8c-6.5 4.1-13.6 7.2-21 9.2" style="fill:#fff"></path></svg> <span>Svelte DevTools</span></button> <!>`, 1);
5636
5645
  function Overlay($$anchor, $$props) {
5637
5646
  push($$props, true);
5638
5647
  const MIN_SIZE = 180;
@@ -5668,7 +5677,7 @@ function Overlay($$anchor, $$props) {
5668
5677
  });
5669
5678
  user_effect(() => {
5670
5679
  const handler = (e) => {
5671
- if ((e.metaKey || e.ctrlKey) && e.shiftKey && e.key === "D") {
5680
+ if (e.shiftKey && e.altKey && e.code === "KeyD") {
5672
5681
  e.preventDefault();
5673
5682
  set(isOpen, !get(isOpen));
5674
5683
  }
@@ -5692,28 +5701,13 @@ function Overlay($$anchor, $$props) {
5692
5701
  var fragment = root();
5693
5702
  var button = first_child(fragment);
5694
5703
  let classes;
5695
- var node = child(button);
5704
+ var node = sibling(button, 2);
5696
5705
  {
5697
5706
  var consequent = ($$anchor2) => {
5698
- var svg = root_1();
5699
- append($$anchor2, svg);
5700
- };
5701
- var alternate = ($$anchor2) => {
5702
- var svg_1 = root_2();
5703
- append($$anchor2, svg_1);
5704
- };
5705
- if_block(node, ($$render) => {
5706
- if (get(isOpen)) $$render(consequent);
5707
- else $$render(alternate, -1);
5708
- });
5709
- }
5710
- var node_1 = sibling(button, 2);
5711
- {
5712
- var consequent_1 = ($$anchor2) => {
5713
- var div = root_3();
5707
+ var div = root_1();
5714
5708
  let classes_1;
5715
- var node_2 = child(div);
5716
- Panel(node_2, {
5709
+ var node_1 = child(div);
5710
+ Panel(node_1, {
5717
5711
  get height() {
5718
5712
  return get(height);
5719
5713
  },
@@ -5733,13 +5727,13 @@ function Overlay($$anchor, $$props) {
5733
5727
  });
5734
5728
  append($$anchor2, div);
5735
5729
  };
5736
- if_block(node_1, ($$render) => {
5737
- if (get(isOpen)) $$render(consequent_1);
5730
+ if_block(node, ($$render) => {
5731
+ if (get(isOpen)) $$render(consequent);
5738
5732
  });
5739
5733
  }
5740
5734
  template_effect(() => {
5741
5735
  classes = set_class(button, 1, "sdt-toggle", null, classes, { "sdt-toggle--open": get(isOpen) });
5742
- set_attribute(button, "title", get(isOpen) ? "Close Svelte DevTools (⌘⇧D)" : "Open Svelte DevTools (⌘⇧D)");
5736
+ set_attribute(button, "title", get(isOpen) ? "Close Svelte DevTools (⇧⌥D)" : "Open Svelte DevTools (⇧⌥D)");
5743
5737
  });
5744
5738
  delegated("click", button, () => set(isOpen, !get(isOpen)));
5745
5739
  append($$anchor, fragment);
package/package.json CHANGED
@@ -1,9 +1,18 @@
1
1
  {
2
2
  "name": "@svelte-devtools/vite-plugin",
3
- "version": "0.1.1",
3
+ "version": "0.1.3",
4
4
  "description": "Vite plugin that adds a development overlay for inspecting Svelte 5 and SvelteKit apps",
5
5
  "type": "module",
6
- "keywords": ["svelte", "svelte5", "sveltekit", "devtools", "vite", "vite-plugin", "debug", "inspector"],
6
+ "keywords": [
7
+ "svelte",
8
+ "svelte5",
9
+ "sveltekit",
10
+ "devtools",
11
+ "vite",
12
+ "vite-plugin",
13
+ "debug",
14
+ "inspector"
15
+ ],
7
16
  "author": "Chris Lentz",
8
17
  "license": "MIT",
9
18
  "repository": {
@@ -19,7 +28,9 @@
19
28
  "import": "./dist/index.js"
20
29
  }
21
30
  },
22
- "files": ["dist"],
31
+ "files": [
32
+ "dist"
33
+ ],
23
34
  "scripts": {
24
35
  "build": "tsc --project tsconfig.build.json && cp ../overlay/dist/overlay.js dist/overlay.js",
25
36
  "prepublishOnly": "npm run build"