@troyio/vite-file-router 0.4.0 → 0.5.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/README.md +664 -484
- package/devtools/app.js +1546 -143
- package/devtools/index.html +153 -33
- package/devtools/style.css +1490 -231
- package/dist/devtools-app.d.ts +97 -0
- package/dist/devtools.d.ts +75 -0
- package/dist/generator.d.ts +8 -1
- package/dist/index.d.ts +29 -3
- package/dist/index.js +904 -31
- package/dist/scanner.d.ts +2 -1
- package/package.json +1 -1
- package/types/index.d.ts +3 -0
package/devtools/index.html
CHANGED
|
@@ -1,33 +1,153 @@
|
|
|
1
|
-
<!doctype html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8" />
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
-
<title>Route Tree</title>
|
|
7
|
-
<link rel="stylesheet" href="/__vite-file-router/style.css" />
|
|
8
|
-
</head>
|
|
9
|
-
<body>
|
|
10
|
-
<
|
|
11
|
-
<
|
|
12
|
-
<
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
</
|
|
21
|
-
<
|
|
22
|
-
<
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>Route Tree</title>
|
|
7
|
+
<link rel="stylesheet" href="/__vite-file-router/style.css" />
|
|
8
|
+
</head>
|
|
9
|
+
<body>
|
|
10
|
+
<svg width="0" height="0" style="position: absolute" aria-hidden="true">
|
|
11
|
+
<symbol id="icon-chevron" viewBox="0 0 16 16">
|
|
12
|
+
<path d="M6 4l4 4-4 4" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" />
|
|
13
|
+
</symbol>
|
|
14
|
+
<symbol id="icon-refresh" viewBox="0 0 16 16">
|
|
15
|
+
<path d="M13.5 8a5.5 5.5 0 1 1-1.6-3.9M13.5 2.5v2.8h-2.8" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
|
16
|
+
</symbol>
|
|
17
|
+
<symbol id="icon-search" viewBox="0 0 16 16">
|
|
18
|
+
<circle cx="7" cy="7" r="4.5" fill="none" stroke="currentColor" stroke-width="1.5" />
|
|
19
|
+
<path d="M10.5 10.5L14 14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
|
|
20
|
+
</symbol>
|
|
21
|
+
<symbol id="icon-open" viewBox="0 0 16 16">
|
|
22
|
+
<path d="M9 3h4v4M13 3L7.5 8.5M11 9.5V13H3V5h3.5" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
|
23
|
+
</symbol>
|
|
24
|
+
<symbol id="icon-go" viewBox="0 0 16 16">
|
|
25
|
+
<path d="M3 8h9M8.5 4.5L12 8l-3.5 3.5" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
|
26
|
+
</symbol>
|
|
27
|
+
<symbol id="icon-route" viewBox="0 0 16 16">
|
|
28
|
+
<circle cx="4" cy="4" r="1.8" fill="none" stroke="currentColor" stroke-width="1.4" />
|
|
29
|
+
<circle cx="12" cy="12" r="1.8" fill="none" stroke="currentColor" stroke-width="1.4" />
|
|
30
|
+
<path d="M4 5.8V9a3 3 0 0 0 3 3h3.2" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" />
|
|
31
|
+
</symbol>
|
|
32
|
+
<symbol id="icon-expand" viewBox="0 0 16 16">
|
|
33
|
+
<path d="M5 6l3-3 3 3M5 10l3 3 3-3" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
|
34
|
+
</symbol>
|
|
35
|
+
<symbol id="icon-collapse" viewBox="0 0 16 16">
|
|
36
|
+
<path d="M5 3l3 3 3-3M5 13l3-3 3 3" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
|
37
|
+
</symbol>
|
|
38
|
+
</svg>
|
|
39
|
+
|
|
40
|
+
<header class="topbar">
|
|
41
|
+
<div class="brand">
|
|
42
|
+
<span class="brand-mark" aria-hidden="true"><svg><use href="#icon-route" /></svg></span>
|
|
43
|
+
<div>
|
|
44
|
+
<h1>Routes</h1>
|
|
45
|
+
<p class="subtitle">vite-file-router</p>
|
|
46
|
+
</div>
|
|
47
|
+
</div>
|
|
48
|
+
<dl class="stats" id="stats" aria-label="Route summary"></dl>
|
|
49
|
+
<div class="topbar-actions">
|
|
50
|
+
<span class="live" id="live" data-state="connecting" role="status">
|
|
51
|
+
<span class="live-dot" aria-hidden="true"></span>
|
|
52
|
+
<span id="live-label">Connecting</span>
|
|
53
|
+
</span>
|
|
54
|
+
<button class="icon-button" id="refresh" type="button" aria-label="Refresh routes" title="Refresh routes">
|
|
55
|
+
<svg><use href="#icon-refresh" /></svg>
|
|
56
|
+
</button>
|
|
57
|
+
</div>
|
|
58
|
+
</header>
|
|
59
|
+
|
|
60
|
+
<p class="alert" id="error" role="alert" hidden></p>
|
|
61
|
+
<section class="conflicts" id="conflicts" aria-label="Route conflicts" hidden></section>
|
|
62
|
+
<section class="warnings" id="warnings" aria-label="Route warnings" hidden></section>
|
|
63
|
+
|
|
64
|
+
<main class="layout">
|
|
65
|
+
<section class="panel tree-panel" aria-label="Route tree">
|
|
66
|
+
<div class="panel-toolbar">
|
|
67
|
+
<label class="field">
|
|
68
|
+
<svg class="field-icon" aria-hidden="true"><use href="#icon-search" /></svg>
|
|
69
|
+
<span class="visually-hidden">Filter routes</span>
|
|
70
|
+
<input id="filter" type="search" placeholder="Filter by path, param, or file" autocomplete="off" spellcheck="false" />
|
|
71
|
+
</label>
|
|
72
|
+
<button class="icon-button" id="toggle" type="button" aria-label="Collapse all" title="Collapse all">
|
|
73
|
+
<svg><use href="#icon-collapse" /></svg>
|
|
74
|
+
</button>
|
|
75
|
+
</div>
|
|
76
|
+
<div class="tree" id="tree" role="tree" aria-label="Routes"></div>
|
|
77
|
+
</section>
|
|
78
|
+
|
|
79
|
+
<aside class="side">
|
|
80
|
+
<section class="panel current-panel" aria-labelledby="current-title">
|
|
81
|
+
<div class="panel-header panel-header-row">
|
|
82
|
+
<div>
|
|
83
|
+
<h2 id="current-title">Current page</h2>
|
|
84
|
+
<p id="current-subtitle">Follows the route your app is showing.</p>
|
|
85
|
+
</div>
|
|
86
|
+
<div class="tab-picker" id="tab-picker" role="group" aria-label="App tabs" hidden></div>
|
|
87
|
+
</div>
|
|
88
|
+
<div id="current" aria-live="polite"></div>
|
|
89
|
+
</section>
|
|
90
|
+
|
|
91
|
+
<div class="tabs" role="tablist" aria-label="Panel sections">
|
|
92
|
+
<button class="tab" id="tab-inspect" type="button" role="tab" aria-selected="true" aria-controls="view-inspect">Inspect</button>
|
|
93
|
+
<button class="tab" id="tab-timeline" type="button" role="tab" aria-selected="false" aria-controls="view-timeline">
|
|
94
|
+
Timeline <span class="tab-count" id="timeline-count" hidden></span>
|
|
95
|
+
</button>
|
|
96
|
+
</div>
|
|
97
|
+
|
|
98
|
+
<div class="view" id="view-inspect" role="tabpanel" aria-labelledby="tab-inspect">
|
|
99
|
+
<section class="panel" aria-labelledby="tester-title">
|
|
100
|
+
<div class="panel-header">
|
|
101
|
+
<h2 id="tester-title">Test a URL</h2>
|
|
102
|
+
<p>Shows which route files handle a URL.</p>
|
|
103
|
+
</div>
|
|
104
|
+
<form class="tester" id="tester">
|
|
105
|
+
<label class="field field-mono">
|
|
106
|
+
<span class="visually-hidden">URL to match</span>
|
|
107
|
+
<input id="tester-input" type="text" placeholder="/users/42?tab=posts" autocomplete="off" spellcheck="false" />
|
|
108
|
+
</label>
|
|
109
|
+
<button class="button" type="submit">Match</button>
|
|
110
|
+
</form>
|
|
111
|
+
<div id="tester-result" aria-live="polite"></div>
|
|
112
|
+
</section>
|
|
113
|
+
|
|
114
|
+
<section class="panel" aria-labelledby="details-title">
|
|
115
|
+
<div class="panel-header">
|
|
116
|
+
<h2 id="details-title">Route details</h2>
|
|
117
|
+
</div>
|
|
118
|
+
<div id="details"></div>
|
|
119
|
+
</section>
|
|
120
|
+
</div>
|
|
121
|
+
|
|
122
|
+
<div class="view" id="view-timeline" role="tabpanel" aria-labelledby="tab-timeline" hidden>
|
|
123
|
+
<section class="panel" aria-labelledby="timeline-title">
|
|
124
|
+
<div class="panel-header panel-header-row">
|
|
125
|
+
<div>
|
|
126
|
+
<h2 id="timeline-title">Loader and action timeline</h2>
|
|
127
|
+
<p>Calls made by your app, newest first.</p>
|
|
128
|
+
</div>
|
|
129
|
+
<button class="icon-button text-button" id="timeline-clear" type="button">Clear</button>
|
|
130
|
+
</div>
|
|
131
|
+
<div class="timeline-toolbar">
|
|
132
|
+
<div class="segmented" id="timeline-types" role="group" aria-label="Filter by call type">
|
|
133
|
+
<button type="button" data-type="all" aria-pressed="true">All</button>
|
|
134
|
+
<button type="button" data-type="loader" aria-pressed="false">Loaders</button>
|
|
135
|
+
<button type="button" data-type="action" aria-pressed="false">Actions</button>
|
|
136
|
+
<button type="button" data-type="middleware" aria-pressed="false">Middleware</button>
|
|
137
|
+
<button type="button" data-type="revalidate" aria-pressed="false">Revalidation</button>
|
|
138
|
+
</div>
|
|
139
|
+
<span class="route-pill" id="timeline-route" hidden></span>
|
|
140
|
+
<label class="field">
|
|
141
|
+
<svg class="field-icon" aria-hidden="true"><use href="#icon-search" /></svg>
|
|
142
|
+
<span class="visually-hidden">Filter calls</span>
|
|
143
|
+
<input id="timeline-filter" type="search" placeholder="Filter by route, URL, or outcome" autocomplete="off" spellcheck="false" />
|
|
144
|
+
</label>
|
|
145
|
+
</div>
|
|
146
|
+
<ol class="timeline" id="timeline" aria-label="Calls"></ol>
|
|
147
|
+
</section>
|
|
148
|
+
</div>
|
|
149
|
+
</aside>
|
|
150
|
+
</main>
|
|
151
|
+
<script type="module" src="/__vite-file-router/app.js"></script>
|
|
152
|
+
</body>
|
|
153
|
+
</html>
|