@tanstack/router-devtools-core 1.117.1 → 1.119.0
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.
- package/dist/cjs/BaseTanStackRouterDevtoolsPanel.cjs +197 -101
- package/dist/cjs/BaseTanStackRouterDevtoolsPanel.cjs.map +1 -1
- package/dist/cjs/NavigateButton.cjs +30 -0
- package/dist/cjs/NavigateButton.cjs.map +1 -0
- package/dist/cjs/NavigateButton.d.cts +7 -0
- package/dist/cjs/useStyles.cjs +25 -0
- package/dist/cjs/useStyles.cjs.map +1 -1
- package/dist/cjs/useStyles.d.cts +2 -0
- package/dist/esm/BaseTanStackRouterDevtoolsPanel.js +199 -103
- package/dist/esm/BaseTanStackRouterDevtoolsPanel.js.map +1 -1
- package/dist/esm/NavigateButton.d.ts +7 -0
- package/dist/esm/NavigateButton.js +30 -0
- package/dist/esm/NavigateButton.js.map +1 -0
- package/dist/esm/useStyles.d.ts +2 -0
- package/dist/esm/useStyles.js +25 -0
- package/dist/esm/useStyles.js.map +1 -1
- package/package.json +2 -2
- package/src/BaseTanStackRouterDevtoolsPanel.tsx +92 -21
- package/src/NavigateButton.tsx +25 -0
- package/src/useStyles.tsx +25 -0
|
@@ -11,7 +11,8 @@ const useLocalStorage = require("./useLocalStorage.cjs");
|
|
|
11
11
|
const Explorer = require("./Explorer.cjs");
|
|
12
12
|
const utils = require("./utils.cjs");
|
|
13
13
|
const AgeTicker = require("./AgeTicker.cjs");
|
|
14
|
-
|
|
14
|
+
const NavigateButton = require("./NavigateButton.cjs");
|
|
15
|
+
var _tmpl$ = /* @__PURE__ */ web.template(`<button><div>TANSTACK</div><div>TanStack Router v1`), _tmpl$2 = /* @__PURE__ */ web.template(`<div><div>`), _tmpl$3 = /* @__PURE__ */ web.template(`<code> `), _tmpl$4 = /* @__PURE__ */ web.template(`<code>`), _tmpl$5 = /* @__PURE__ */ web.template(`<div><div role=button><div>`), _tmpl$6 = /* @__PURE__ */ web.template(`<div>`), _tmpl$7 = /* @__PURE__ */ web.template(`<div><button><svg xmlns=http://www.w3.org/2000/svg width=10 height=6 fill=none viewBox="0 0 10 6"><path stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=1.667 d="M1 1l4 4 4-4"></path></svg></button><div><div></div><div><div></div></div></div><div><div><div><span>Pathname</span></div><div><code></code></div><div><div><button type=button>Routes</button><button type=button>Matches</button></div><div><div>age / staleTime / gcTime</div></div></div><div>`), _tmpl$8 = /* @__PURE__ */ web.template(`<div><span>masked`), _tmpl$9 = /* @__PURE__ */ web.template(`<div role=button><div>`), _tmpl$10 = /* @__PURE__ */ web.template(`<div><div><div>Cached Matches</div><div>age / staleTime / gcTime</div></div><div>`), _tmpl$11 = /* @__PURE__ */ web.template(`<div><div>Match Details</div><div><div><div><div></div></div><div><div>ID:</div><div><code></code></div></div><div><div>State:</div><div></div></div><div><div>Last Updated:</div><div></div></div></div></div><div>Explorer</div><div>`), _tmpl$12 = /* @__PURE__ */ web.template(`<div>Loader Data`), _tmpl$13 = /* @__PURE__ */ web.template(`<div><div>Search Params</div><div>`);
|
|
15
16
|
function Logo(props) {
|
|
16
17
|
const {
|
|
17
18
|
className,
|
|
@@ -37,6 +38,21 @@ function Logo(props) {
|
|
|
37
38
|
return _el$;
|
|
38
39
|
})();
|
|
39
40
|
}
|
|
41
|
+
function NavigateLink(props) {
|
|
42
|
+
return (() => {
|
|
43
|
+
var _el$4 = _tmpl$2(), _el$5 = _el$4.firstChild;
|
|
44
|
+
_el$4.style.setProperty("display", "flex");
|
|
45
|
+
_el$4.style.setProperty("align-items", "center");
|
|
46
|
+
_el$4.style.setProperty("width", "100%");
|
|
47
|
+
web.insert(_el$4, () => props.left, _el$5);
|
|
48
|
+
_el$5.style.setProperty("flex-grow", "1");
|
|
49
|
+
_el$5.style.setProperty("min-width", "0");
|
|
50
|
+
web.insert(_el$5, () => props.children);
|
|
51
|
+
web.insert(_el$4, () => props.right, null);
|
|
52
|
+
web.effect(() => web.className(_el$4, props.class));
|
|
53
|
+
return _el$4;
|
|
54
|
+
})();
|
|
55
|
+
}
|
|
40
56
|
function RouteComp({
|
|
41
57
|
routerState,
|
|
42
58
|
router,
|
|
@@ -66,28 +82,72 @@ function RouteComp({
|
|
|
66
82
|
return "";
|
|
67
83
|
}
|
|
68
84
|
});
|
|
85
|
+
const navigationTarget = solidJs.createMemo(() => {
|
|
86
|
+
if (isRoot) return void 0;
|
|
87
|
+
if (!route.path) return void 0;
|
|
88
|
+
const allParams = Object.assign({}, ...matches().map((m) => m.params));
|
|
89
|
+
const interpolated = routerCore.interpolatePath({
|
|
90
|
+
path: route.fullPath,
|
|
91
|
+
params: allParams,
|
|
92
|
+
leaveWildcards: false,
|
|
93
|
+
leaveParams: false,
|
|
94
|
+
decodeCharMap: router().pathParamsDecodeCharMap
|
|
95
|
+
});
|
|
96
|
+
return !interpolated.isMissingParams ? interpolated.interpolatedPath : void 0;
|
|
97
|
+
});
|
|
69
98
|
return (() => {
|
|
70
|
-
var _el$
|
|
71
|
-
_el$
|
|
99
|
+
var _el$6 = _tmpl$5(), _el$7 = _el$6.firstChild, _el$8 = _el$7.firstChild;
|
|
100
|
+
_el$7.$$click = () => {
|
|
72
101
|
if (match()) {
|
|
73
102
|
setActiveId(activeId() === route.id ? "" : route.id);
|
|
74
103
|
}
|
|
75
104
|
};
|
|
76
|
-
web.insert(_el$
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
105
|
+
web.insert(_el$7, web.createComponent(NavigateLink, {
|
|
106
|
+
get ["class"]() {
|
|
107
|
+
return clsx.clsx(styles().routesRow(!!match()));
|
|
108
|
+
},
|
|
109
|
+
get left() {
|
|
110
|
+
return web.createComponent(solidJs.Show, {
|
|
111
|
+
get when() {
|
|
112
|
+
return navigationTarget();
|
|
113
|
+
},
|
|
114
|
+
children: (navigate) => web.createComponent(NavigateButton.NavigateButton, {
|
|
115
|
+
get to() {
|
|
116
|
+
return navigate();
|
|
117
|
+
},
|
|
118
|
+
router
|
|
119
|
+
})
|
|
120
|
+
});
|
|
121
|
+
},
|
|
122
|
+
get right() {
|
|
123
|
+
return web.createComponent(AgeTicker.AgeTicker, {
|
|
124
|
+
get match() {
|
|
125
|
+
return match();
|
|
126
|
+
},
|
|
127
|
+
router
|
|
128
|
+
});
|
|
81
129
|
},
|
|
82
|
-
|
|
130
|
+
get children() {
|
|
131
|
+
return [(() => {
|
|
132
|
+
var _el$9 = _tmpl$3(), _el$10 = _el$9.firstChild;
|
|
133
|
+
web.insert(_el$9, () => isRoot ? routerCore.rootRouteId : route.path || routerCore.trimPath(route.id), _el$10);
|
|
134
|
+
web.effect(() => web.className(_el$9, styles().code));
|
|
135
|
+
return _el$9;
|
|
136
|
+
})(), (() => {
|
|
137
|
+
var _el$11 = _tmpl$4();
|
|
138
|
+
web.insert(_el$11, param);
|
|
139
|
+
web.effect(() => web.className(_el$11, styles().routeParamInfo));
|
|
140
|
+
return _el$11;
|
|
141
|
+
})()];
|
|
142
|
+
}
|
|
83
143
|
}), null);
|
|
84
|
-
web.insert(_el$
|
|
144
|
+
web.insert(_el$6, (() => {
|
|
85
145
|
var _c$ = web.memo(() => {
|
|
86
146
|
var _a;
|
|
87
147
|
return !!((_a = route.children) == null ? void 0 : _a.length);
|
|
88
148
|
});
|
|
89
149
|
return () => _c$() ? (() => {
|
|
90
|
-
var _el$12 = _tmpl$
|
|
150
|
+
var _el$12 = _tmpl$6();
|
|
91
151
|
web.insert(_el$12, () => [...route.children].sort((a, b) => {
|
|
92
152
|
return a.rank - b.rank;
|
|
93
153
|
}).map((r) => web.createComponent(RouteComp, {
|
|
@@ -102,23 +162,17 @@ function RouteComp({
|
|
|
102
162
|
})() : null;
|
|
103
163
|
})(), null);
|
|
104
164
|
web.effect((_p$) => {
|
|
105
|
-
var _v$3 = `Open match details for ${route.id}`, _v$4 = clsx.clsx(styles().routesRowContainer(route.id === activeId(), !!match())), _v$5 = clsx.clsx(styles().matchIndicator(utils.getRouteStatusColor(matches(), route)))
|
|
106
|
-
_v$3 !== _p$.e && web.setAttribute(_el$
|
|
107
|
-
_v$4 !== _p$.t && web.className(_el$
|
|
108
|
-
_v$5 !== _p$.a && web.className(_el$
|
|
109
|
-
_v$6 !== _p$.o && web.className(_el$7, _p$.o = _v$6);
|
|
110
|
-
_v$7 !== _p$.i && web.className(_el$9, _p$.i = _v$7);
|
|
111
|
-
_v$8 !== _p$.n && web.className(_el$11, _p$.n = _v$8);
|
|
165
|
+
var _v$3 = `Open match details for ${route.id}`, _v$4 = clsx.clsx(styles().routesRowContainer(route.id === activeId(), !!match())), _v$5 = clsx.clsx(styles().matchIndicator(utils.getRouteStatusColor(matches(), route)));
|
|
166
|
+
_v$3 !== _p$.e && web.setAttribute(_el$7, "aria-label", _p$.e = _v$3);
|
|
167
|
+
_v$4 !== _p$.t && web.className(_el$7, _p$.t = _v$4);
|
|
168
|
+
_v$5 !== _p$.a && web.className(_el$8, _p$.a = _v$5);
|
|
112
169
|
return _p$;
|
|
113
170
|
}, {
|
|
114
171
|
e: void 0,
|
|
115
172
|
t: void 0,
|
|
116
|
-
a: void 0
|
|
117
|
-
o: void 0,
|
|
118
|
-
i: void 0,
|
|
119
|
-
n: void 0
|
|
173
|
+
a: void 0
|
|
120
174
|
});
|
|
121
|
-
return _el$
|
|
175
|
+
return _el$6;
|
|
122
176
|
})();
|
|
123
177
|
}
|
|
124
178
|
const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel2({
|
|
@@ -164,7 +218,7 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
164
218
|
const activeMatchValue = solidJs.createMemo(() => activeMatch());
|
|
165
219
|
const locationSearchValue = solidJs.createMemo(() => routerState().location.search);
|
|
166
220
|
return (() => {
|
|
167
|
-
var _el$13 = _tmpl$
|
|
221
|
+
var _el$13 = _tmpl$7(), _el$14 = _el$13.firstChild, _el$15 = _el$14.firstChild, _el$16 = _el$14.nextSibling, _el$17 = _el$16.firstChild, _el$18 = _el$17.nextSibling, _el$19 = _el$18.firstChild, _el$20 = _el$16.nextSibling, _el$21 = _el$20.firstChild, _el$22 = _el$21.firstChild;
|
|
168
222
|
_el$22.firstChild;
|
|
169
223
|
var _el$24 = _el$22.nextSibling, _el$25 = _el$24.firstChild, _el$26 = _el$24.nextSibling, _el$27 = _el$26.firstChild, _el$28 = _el$27.firstChild, _el$29 = _el$28.nextSibling, _el$30 = _el$27.nextSibling, _el$31 = _el$26.nextSibling;
|
|
170
224
|
web.spread(_el$13, web.mergeProps({
|
|
@@ -176,7 +230,7 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
176
230
|
}
|
|
177
231
|
}, otherPanelProps), false, true);
|
|
178
232
|
web.insert(_el$13, handleDragStart ? (() => {
|
|
179
|
-
var _el$32 = _tmpl$
|
|
233
|
+
var _el$32 = _tmpl$6();
|
|
180
234
|
web.addEventListener(_el$32, "mousedown", handleDragStart, true);
|
|
181
235
|
web.effect(() => web.className(_el$32, styles().dragHandle));
|
|
182
236
|
return _el$32;
|
|
@@ -211,11 +265,11 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
211
265
|
web.insert(_el$22, (() => {
|
|
212
266
|
var _c$2 = web.memo(() => !!routerState().location.maskedLocation);
|
|
213
267
|
return () => _c$2() ? (() => {
|
|
214
|
-
var _el$33 = _tmpl$
|
|
268
|
+
var _el$33 = _tmpl$8(), _el$34 = _el$33.firstChild;
|
|
215
269
|
web.effect((_p$) => {
|
|
216
|
-
var _v$
|
|
217
|
-
_v$
|
|
218
|
-
_v$
|
|
270
|
+
var _v$24 = styles().maskedBadgeContainer, _v$25 = styles().maskedBadge;
|
|
271
|
+
_v$24 !== _p$.e && web.className(_el$33, _p$.e = _v$24);
|
|
272
|
+
_v$25 !== _p$.t && web.className(_el$34, _p$.t = _v$25);
|
|
219
273
|
return _p$;
|
|
220
274
|
}, {
|
|
221
275
|
e: void 0,
|
|
@@ -228,7 +282,7 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
228
282
|
web.insert(_el$24, (() => {
|
|
229
283
|
var _c$3 = web.memo(() => !!routerState().location.maskedLocation);
|
|
230
284
|
return () => _c$3() ? (() => {
|
|
231
|
-
var _el$35 = _tmpl$
|
|
285
|
+
var _el$35 = _tmpl$4();
|
|
232
286
|
web.insert(_el$35, () => {
|
|
233
287
|
var _a;
|
|
234
288
|
return (_a = routerState().location.maskedLocation) == null ? void 0 : _a.pathname;
|
|
@@ -255,30 +309,51 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
255
309
|
activeId,
|
|
256
310
|
setActiveId
|
|
257
311
|
}) : (() => {
|
|
258
|
-
var _el$36 = _tmpl$
|
|
312
|
+
var _el$36 = _tmpl$6();
|
|
259
313
|
web.insert(_el$36, () => {
|
|
260
314
|
var _a, _b;
|
|
261
|
-
return (_b = ((_a = routerState().pendingMatches) == null ? void 0 : _a.length) ? routerState().pendingMatches : routerState().matches) == null ? void 0 : _b.map((match,
|
|
315
|
+
return (_b = ((_a = routerState().pendingMatches) == null ? void 0 : _a.length) ? routerState().pendingMatches : routerState().matches) == null ? void 0 : _b.map((match, _i) => {
|
|
262
316
|
return (() => {
|
|
263
|
-
var _el$37 = _tmpl$
|
|
317
|
+
var _el$37 = _tmpl$9(), _el$38 = _el$37.firstChild;
|
|
264
318
|
_el$37.$$click = () => setActiveId(activeId() === match.id ? "" : match.id);
|
|
265
|
-
web.insert(_el$
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
319
|
+
web.insert(_el$37, web.createComponent(NavigateLink, {
|
|
320
|
+
get left() {
|
|
321
|
+
return web.createComponent(NavigateButton.NavigateButton, {
|
|
322
|
+
get to() {
|
|
323
|
+
return match.pathname;
|
|
324
|
+
},
|
|
325
|
+
get params() {
|
|
326
|
+
return match.params;
|
|
327
|
+
},
|
|
328
|
+
get search() {
|
|
329
|
+
return match.search;
|
|
330
|
+
},
|
|
331
|
+
router
|
|
332
|
+
});
|
|
333
|
+
},
|
|
334
|
+
get right() {
|
|
335
|
+
return web.createComponent(AgeTicker.AgeTicker, {
|
|
336
|
+
match,
|
|
337
|
+
router
|
|
338
|
+
});
|
|
339
|
+
},
|
|
340
|
+
get children() {
|
|
341
|
+
var _el$39 = _tmpl$4();
|
|
342
|
+
web.insert(_el$39, () => `${match.routeId === routerCore.rootRouteId ? routerCore.rootRouteId : match.pathname}`);
|
|
343
|
+
web.effect(() => web.className(_el$39, styles().matchID));
|
|
344
|
+
return _el$39;
|
|
345
|
+
}
|
|
269
346
|
}), null);
|
|
270
347
|
web.effect((_p$) => {
|
|
271
|
-
var _v$
|
|
272
|
-
_v$
|
|
273
|
-
_v$
|
|
274
|
-
_v$
|
|
275
|
-
_v$32 !== _p$.o && web.className(_el$39, _p$.o = _v$32);
|
|
348
|
+
var _v$26 = `Open match details for ${match.id}`, _v$27 = clsx.clsx(styles().matchRow(match === activeMatch())), _v$28 = clsx.clsx(styles().matchIndicator(utils.getStatusColor(match)));
|
|
349
|
+
_v$26 !== _p$.e && web.setAttribute(_el$37, "aria-label", _p$.e = _v$26);
|
|
350
|
+
_v$27 !== _p$.t && web.className(_el$37, _p$.t = _v$27);
|
|
351
|
+
_v$28 !== _p$.a && web.className(_el$38, _p$.a = _v$28);
|
|
276
352
|
return _p$;
|
|
277
353
|
}, {
|
|
278
354
|
e: void 0,
|
|
279
355
|
t: void 0,
|
|
280
|
-
a: void 0
|
|
281
|
-
o: void 0
|
|
356
|
+
a: void 0
|
|
282
357
|
});
|
|
283
358
|
return _el$37;
|
|
284
359
|
})();
|
|
@@ -290,37 +365,58 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
290
365
|
web.insert(_el$20, (() => {
|
|
291
366
|
var _c$5 = web.memo(() => !!routerState().cachedMatches.length);
|
|
292
367
|
return () => _c$5() ? (() => {
|
|
293
|
-
var _el$40 = _tmpl$
|
|
368
|
+
var _el$40 = _tmpl$10(), _el$41 = _el$40.firstChild, _el$42 = _el$41.firstChild, _el$43 = _el$42.nextSibling, _el$44 = _el$41.nextSibling;
|
|
294
369
|
web.insert(_el$44, () => routerState().cachedMatches.map((match) => {
|
|
295
370
|
return (() => {
|
|
296
|
-
var _el$45 = _tmpl$
|
|
371
|
+
var _el$45 = _tmpl$9(), _el$46 = _el$45.firstChild;
|
|
297
372
|
_el$45.$$click = () => setActiveId(activeId() === match.id ? "" : match.id);
|
|
298
|
-
web.insert(_el$
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
373
|
+
web.insert(_el$45, web.createComponent(NavigateLink, {
|
|
374
|
+
get left() {
|
|
375
|
+
return web.createComponent(NavigateButton.NavigateButton, {
|
|
376
|
+
get to() {
|
|
377
|
+
return match.pathname;
|
|
378
|
+
},
|
|
379
|
+
get params() {
|
|
380
|
+
return match.params;
|
|
381
|
+
},
|
|
382
|
+
get search() {
|
|
383
|
+
return match.search;
|
|
384
|
+
},
|
|
385
|
+
router
|
|
386
|
+
});
|
|
387
|
+
},
|
|
388
|
+
get right() {
|
|
389
|
+
return web.createComponent(AgeTicker.AgeTicker, {
|
|
390
|
+
match,
|
|
391
|
+
router
|
|
392
|
+
});
|
|
393
|
+
},
|
|
394
|
+
get children() {
|
|
395
|
+
var _el$47 = _tmpl$4();
|
|
396
|
+
web.insert(_el$47, () => `${match.id}`);
|
|
397
|
+
web.effect(() => web.className(_el$47, styles().matchID));
|
|
398
|
+
return _el$47;
|
|
399
|
+
}
|
|
302
400
|
}), null);
|
|
303
401
|
web.effect((_p$) => {
|
|
304
|
-
var _v$
|
|
305
|
-
_v$
|
|
306
|
-
_v$
|
|
307
|
-
_v$
|
|
308
|
-
_v$39 !== _p$.o && web.className(_el$47, _p$.o = _v$39);
|
|
402
|
+
var _v$32 = `Open match details for ${match.id}`, _v$33 = clsx.clsx(styles().matchRow(match === activeMatch())), _v$34 = clsx.clsx(styles().matchIndicator(utils.getStatusColor(match)));
|
|
403
|
+
_v$32 !== _p$.e && web.setAttribute(_el$45, "aria-label", _p$.e = _v$32);
|
|
404
|
+
_v$33 !== _p$.t && web.className(_el$45, _p$.t = _v$33);
|
|
405
|
+
_v$34 !== _p$.a && web.className(_el$46, _p$.a = _v$34);
|
|
309
406
|
return _p$;
|
|
310
407
|
}, {
|
|
311
408
|
e: void 0,
|
|
312
409
|
t: void 0,
|
|
313
|
-
a: void 0
|
|
314
|
-
o: void 0
|
|
410
|
+
a: void 0
|
|
315
411
|
});
|
|
316
412
|
return _el$45;
|
|
317
413
|
})();
|
|
318
414
|
}));
|
|
319
415
|
web.effect((_p$) => {
|
|
320
|
-
var _v$
|
|
321
|
-
_v$
|
|
322
|
-
_v$
|
|
323
|
-
_v$
|
|
416
|
+
var _v$29 = styles().cachedMatchesContainer, _v$30 = styles().detailsHeader, _v$31 = styles().detailsHeaderInfo;
|
|
417
|
+
_v$29 !== _p$.e && web.className(_el$40, _p$.e = _v$29);
|
|
418
|
+
_v$30 !== _p$.t && web.className(_el$41, _p$.t = _v$30);
|
|
419
|
+
_v$31 !== _p$.a && web.className(_el$43, _p$.a = _v$31);
|
|
324
420
|
return _p$;
|
|
325
421
|
}, {
|
|
326
422
|
e: void 0,
|
|
@@ -336,7 +432,7 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
336
432
|
return !!(activeMatch() && ((_a = activeMatch()) == null ? void 0 : _a.status));
|
|
337
433
|
});
|
|
338
434
|
return () => _c$6() ? (() => {
|
|
339
|
-
var _el$48 = _tmpl$
|
|
435
|
+
var _el$48 = _tmpl$11(), _el$49 = _el$48.firstChild, _el$50 = _el$49.nextSibling, _el$51 = _el$50.firstChild, _el$52 = _el$51.firstChild, _el$53 = _el$52.firstChild, _el$54 = _el$52.nextSibling, _el$55 = _el$54.firstChild, _el$56 = _el$55.nextSibling, _el$57 = _el$56.firstChild, _el$58 = _el$54.nextSibling, _el$59 = _el$58.firstChild, _el$60 = _el$59.nextSibling, _el$61 = _el$58.nextSibling, _el$62 = _el$61.firstChild, _el$63 = _el$62.nextSibling, _el$64 = _el$50.nextSibling, _el$65 = _el$64.nextSibling;
|
|
340
436
|
web.insert(_el$53, (() => {
|
|
341
437
|
var _c$8 = web.memo(() => {
|
|
342
438
|
var _a, _b;
|
|
@@ -377,11 +473,11 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
377
473
|
web.insert(_el$48, (() => {
|
|
378
474
|
var _c$11 = web.memo(() => !!activeMatchLoaderData());
|
|
379
475
|
return () => _c$11() ? [(() => {
|
|
380
|
-
var _el$66 = _tmpl$
|
|
476
|
+
var _el$66 = _tmpl$12();
|
|
381
477
|
web.effect(() => web.className(_el$66, styles().detailsHeader));
|
|
382
478
|
return _el$66;
|
|
383
479
|
})(), (() => {
|
|
384
|
-
var _el$67 = _tmpl$
|
|
480
|
+
var _el$67 = _tmpl$6();
|
|
385
481
|
web.insert(_el$67, web.createComponent(Explorer.Explorer, {
|
|
386
482
|
label: "loaderData",
|
|
387
483
|
value: activeMatchLoaderData,
|
|
@@ -398,19 +494,19 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
398
494
|
}));
|
|
399
495
|
web.effect((_p$) => {
|
|
400
496
|
var _a, _b;
|
|
401
|
-
var _v$
|
|
402
|
-
_v$
|
|
403
|
-
_v$
|
|
404
|
-
_v$
|
|
405
|
-
_v$
|
|
406
|
-
_v$
|
|
407
|
-
_v$
|
|
408
|
-
_v$
|
|
409
|
-
_v$
|
|
410
|
-
_v$
|
|
411
|
-
_v$
|
|
412
|
-
_v$
|
|
413
|
-
_v$
|
|
497
|
+
var _v$35 = styles().thirdContainer, _v$36 = styles().detailsHeader, _v$37 = styles().matchDetails, _v$38 = styles().matchStatus((_a = activeMatch()) == null ? void 0 : _a.status, (_b = activeMatch()) == null ? void 0 : _b.isFetching), _v$39 = styles().matchDetailsInfoLabel, _v$40 = styles().matchDetailsInfo, _v$41 = styles().matchDetailsInfoLabel, _v$42 = styles().matchDetailsInfo, _v$43 = styles().matchDetailsInfoLabel, _v$44 = styles().matchDetailsInfo, _v$45 = styles().detailsHeader, _v$46 = styles().detailsContent;
|
|
498
|
+
_v$35 !== _p$.e && web.className(_el$48, _p$.e = _v$35);
|
|
499
|
+
_v$36 !== _p$.t && web.className(_el$49, _p$.t = _v$36);
|
|
500
|
+
_v$37 !== _p$.a && web.className(_el$51, _p$.a = _v$37);
|
|
501
|
+
_v$38 !== _p$.o && web.className(_el$52, _p$.o = _v$38);
|
|
502
|
+
_v$39 !== _p$.i && web.className(_el$54, _p$.i = _v$39);
|
|
503
|
+
_v$40 !== _p$.n && web.className(_el$56, _p$.n = _v$40);
|
|
504
|
+
_v$41 !== _p$.s && web.className(_el$58, _p$.s = _v$41);
|
|
505
|
+
_v$42 !== _p$.h && web.className(_el$60, _p$.h = _v$42);
|
|
506
|
+
_v$43 !== _p$.r && web.className(_el$61, _p$.r = _v$43);
|
|
507
|
+
_v$44 !== _p$.d && web.className(_el$63, _p$.d = _v$44);
|
|
508
|
+
_v$45 !== _p$.l && web.className(_el$64, _p$.l = _v$45);
|
|
509
|
+
_v$46 !== _p$.u && web.className(_el$65, _p$.u = _v$46);
|
|
414
510
|
return _p$;
|
|
415
511
|
}, {
|
|
416
512
|
e: void 0,
|
|
@@ -432,7 +528,7 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
432
528
|
web.insert(_el$13, (() => {
|
|
433
529
|
var _c$7 = web.memo(() => !!hasSearch());
|
|
434
530
|
return () => _c$7() ? (() => {
|
|
435
|
-
var _el$68 = _tmpl$
|
|
531
|
+
var _el$68 = _tmpl$13(), _el$69 = _el$68.firstChild, _el$70 = _el$69.nextSibling;
|
|
436
532
|
web.insert(_el$70, web.createComponent(Explorer.Explorer, {
|
|
437
533
|
value: locationSearchValue,
|
|
438
534
|
get defaultExpanded() {
|
|
@@ -443,10 +539,10 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
443
539
|
}
|
|
444
540
|
}));
|
|
445
541
|
web.effect((_p$) => {
|
|
446
|
-
var _v$
|
|
447
|
-
_v$
|
|
448
|
-
_v$
|
|
449
|
-
_v$
|
|
542
|
+
var _v$47 = styles().fourthContainer, _v$48 = styles().detailsHeader, _v$49 = styles().detailsContent;
|
|
543
|
+
_v$47 !== _p$.e && web.className(_el$68, _p$.e = _v$47);
|
|
544
|
+
_v$48 !== _p$.t && web.className(_el$69, _p$.t = _v$48);
|
|
545
|
+
_v$49 !== _p$.a && web.className(_el$70, _p$.a = _v$49);
|
|
450
546
|
return _p$;
|
|
451
547
|
}, {
|
|
452
548
|
e: void 0,
|
|
@@ -457,25 +553,25 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
|
|
|
457
553
|
})() : null;
|
|
458
554
|
})(), null);
|
|
459
555
|
web.effect((_p$) => {
|
|
460
|
-
var _v$
|
|
461
|
-
_v$
|
|
462
|
-
_v$
|
|
463
|
-
_v$
|
|
464
|
-
_v$
|
|
465
|
-
_v$
|
|
466
|
-
_v$
|
|
467
|
-
_v$
|
|
468
|
-
_v$
|
|
469
|
-
_v$
|
|
470
|
-
_v$
|
|
471
|
-
_v$
|
|
472
|
-
_v$
|
|
473
|
-
_v$
|
|
474
|
-
_v$
|
|
475
|
-
_v$
|
|
476
|
-
_v$
|
|
477
|
-
_v$
|
|
478
|
-
_v$
|
|
556
|
+
var _v$6 = styles().panelCloseBtn, _v$7 = styles().panelCloseBtnIcon, _v$8 = styles().firstContainer, _v$9 = styles().row, _v$10 = styles().routerExplorerContainer, _v$11 = styles().routerExplorer, _v$12 = styles().secondContainer, _v$13 = styles().matchesContainer, _v$14 = styles().detailsHeader, _v$15 = styles().detailsContent, _v$16 = styles().detailsHeader, _v$17 = styles().routeMatchesToggle, _v$18 = !showMatches(), _v$19 = clsx.clsx(styles().routeMatchesToggleBtn(!showMatches(), true)), _v$20 = showMatches(), _v$21 = clsx.clsx(styles().routeMatchesToggleBtn(!!showMatches(), false)), _v$22 = styles().detailsHeaderInfo, _v$23 = clsx.clsx(styles().routesContainer);
|
|
557
|
+
_v$6 !== _p$.e && web.className(_el$14, _p$.e = _v$6);
|
|
558
|
+
_v$7 !== _p$.t && web.setAttribute(_el$15, "class", _p$.t = _v$7);
|
|
559
|
+
_v$8 !== _p$.a && web.className(_el$16, _p$.a = _v$8);
|
|
560
|
+
_v$9 !== _p$.o && web.className(_el$17, _p$.o = _v$9);
|
|
561
|
+
_v$10 !== _p$.i && web.className(_el$18, _p$.i = _v$10);
|
|
562
|
+
_v$11 !== _p$.n && web.className(_el$19, _p$.n = _v$11);
|
|
563
|
+
_v$12 !== _p$.s && web.className(_el$20, _p$.s = _v$12);
|
|
564
|
+
_v$13 !== _p$.h && web.className(_el$21, _p$.h = _v$13);
|
|
565
|
+
_v$14 !== _p$.r && web.className(_el$22, _p$.r = _v$14);
|
|
566
|
+
_v$15 !== _p$.d && web.className(_el$24, _p$.d = _v$15);
|
|
567
|
+
_v$16 !== _p$.l && web.className(_el$26, _p$.l = _v$16);
|
|
568
|
+
_v$17 !== _p$.u && web.className(_el$27, _p$.u = _v$17);
|
|
569
|
+
_v$18 !== _p$.c && (_el$28.disabled = _p$.c = _v$18);
|
|
570
|
+
_v$19 !== _p$.w && web.className(_el$28, _p$.w = _v$19);
|
|
571
|
+
_v$20 !== _p$.m && (_el$29.disabled = _p$.m = _v$20);
|
|
572
|
+
_v$21 !== _p$.f && web.className(_el$29, _p$.f = _v$21);
|
|
573
|
+
_v$22 !== _p$.y && web.className(_el$30, _p$.y = _v$22);
|
|
574
|
+
_v$23 !== _p$.g && web.className(_el$31, _p$.g = _v$23);
|
|
479
575
|
return _p$;
|
|
480
576
|
}, {
|
|
481
577
|
e: void 0,
|