@vistagenic/vista 0.3.0 → 0.3.2
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/bin/dev-error-overlay-snippet.js +379 -153
- package/dist/dev-error.d.ts +14 -0
- package/dist/dev-error.js +1394 -336
- package/dist/server/engine.js +1 -7
- package/dist/server/rsc-engine.js +2 -12
- package/package.json +178 -178
|
@@ -16,11 +16,16 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
16
16
|
var root = null;
|
|
17
17
|
var messageNode = null;
|
|
18
18
|
var titleNode = null;
|
|
19
|
-
var
|
|
19
|
+
var detailNode = null;
|
|
20
20
|
var filesWrapNode = null;
|
|
21
21
|
var filesNode = null;
|
|
22
|
-
var
|
|
23
|
-
var
|
|
22
|
+
var tabNameNodes = null;
|
|
23
|
+
var crumbsNode = null;
|
|
24
|
+
var statusLnNode = null;
|
|
25
|
+
var statusLangNode = null;
|
|
26
|
+
var kindNode = null;
|
|
27
|
+
var sourceBadgeNode = null;
|
|
28
|
+
var fileTabsNode = null;
|
|
24
29
|
var copyButton = null;
|
|
25
30
|
var minimizeButton = null;
|
|
26
31
|
var reloadButton = null;
|
|
@@ -28,26 +33,21 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
28
33
|
var prevButton = null;
|
|
29
34
|
var nextButton = null;
|
|
30
35
|
var countNode = null;
|
|
36
|
+
var mainNode = null;
|
|
37
|
+
var panelExpandButton = null;
|
|
31
38
|
var listenersBound = false;
|
|
32
39
|
var state = {
|
|
33
40
|
open: false,
|
|
34
41
|
minimized: false,
|
|
35
42
|
entries: [],
|
|
36
43
|
activeIndex: 0,
|
|
44
|
+
fileTab: 0,
|
|
37
45
|
};
|
|
38
46
|
|
|
39
47
|
function getIndicator() {
|
|
40
48
|
return window.__VISTA_DEVTOOLS_INDICATOR__;
|
|
41
49
|
}
|
|
42
50
|
|
|
43
|
-
function pad2(value) {
|
|
44
|
-
return value < 10 ? '0' + value : String(value);
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
function formatTime(date) {
|
|
48
|
-
return pad2(date.getHours()) + ':' + pad2(date.getMinutes()) + ':' + pad2(date.getSeconds());
|
|
49
|
-
}
|
|
50
|
-
|
|
51
51
|
function escapeHtml(value) {
|
|
52
52
|
return String(value || '')
|
|
53
53
|
.replace(/&/g, '&')
|
|
@@ -57,43 +57,131 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
57
57
|
.replace(/'/g, ''');
|
|
58
58
|
}
|
|
59
59
|
|
|
60
|
-
function
|
|
61
|
-
var
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
60
|
+
function highlightSource(text) {
|
|
61
|
+
var html = '';
|
|
62
|
+
var i = 0;
|
|
63
|
+
var keywords = /^(import|from|function|return|const|let|var|export|default|class|extends|if|else|async|await|new|type|interface|true|false|null|undefined|typeof|void|as|of|in|for|while|switch|case|break|continue|try|catch|finally|this)\b/;
|
|
64
|
+
while (i < text.length) {
|
|
65
|
+
var ch = text.charAt(i);
|
|
66
|
+
if (ch === "'" || ch === '"' || ch === String.fromCharCode(96)) {
|
|
67
|
+
var j = i + 1;
|
|
68
|
+
while (j < text.length && text.charAt(j) !== ch) {
|
|
69
|
+
j += text.charAt(j) === '\\' ? 2 : 1;
|
|
70
|
+
}
|
|
71
|
+
html += '<span class="vista-tok-str">' + escapeHtml(text.slice(i, Math.min(j + 1, text.length))) + '</span>';
|
|
72
|
+
i = j + 1;
|
|
73
|
+
continue;
|
|
74
|
+
}
|
|
75
|
+
if (ch === '/' && text.charAt(i + 1) === '/') {
|
|
76
|
+
html += '<span class="vista-tok-cmt">' + escapeHtml(text.slice(i)) + '</span>';
|
|
77
|
+
break;
|
|
78
|
+
}
|
|
79
|
+
if (ch === '<' && /[A-Za-z/]/.test(text.charAt(i + 1) || '')) {
|
|
80
|
+
var tag = text.slice(i).match(/^<\/?[A-Za-z][\w.-]*/);
|
|
81
|
+
if (tag) {
|
|
82
|
+
html += '<span class="vista-tok-tag">' + escapeHtml(tag[0]) + '</span>';
|
|
83
|
+
i += tag[0].length;
|
|
84
|
+
continue;
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
if (/[A-Za-z_$]/.test(ch)) {
|
|
88
|
+
var ident = text.slice(i).match(/^[A-Za-z_$][\w$]*/);
|
|
89
|
+
if (ident) {
|
|
90
|
+
html += keywords.test(ident[0])
|
|
91
|
+
? '<span class="vista-tok-kw">' + escapeHtml(ident[0]) + '</span>'
|
|
92
|
+
: escapeHtml(ident[0]);
|
|
93
|
+
i += ident[0].length;
|
|
94
|
+
continue;
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
html += escapeHtml(ch);
|
|
98
|
+
i += 1;
|
|
99
|
+
}
|
|
100
|
+
return html;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
function fileBasename(file) {
|
|
104
|
+
var normalized = String(file || '').replace(/\\/g, '/').replace(/:\d+(?::\d+)?$/, '');
|
|
105
|
+
return normalized.split('/').filter(Boolean).pop() || 'untitled';
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
function fileBreadcrumb(file) {
|
|
109
|
+
var normalized = String(file || '').replace(/\\/g, '/').replace(/:\d+(?::\d+)?$/, '');
|
|
110
|
+
return normalized.split('/').filter(Boolean).join(' › ') || 'Source';
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
function languageFromFile(file) {
|
|
114
|
+
var ext = String(file || '').replace(/:\d+(?::\d+)?$/, '').split('.').pop().toLowerCase();
|
|
115
|
+
if (ext === 'tsx') return 'TypeScript React';
|
|
116
|
+
if (ext === 'ts') return 'TypeScript';
|
|
117
|
+
if (ext === 'jsx') return 'JavaScript React';
|
|
118
|
+
if (ext === 'js' || ext === 'mjs' || ext === 'cjs') return 'JavaScript';
|
|
119
|
+
if (ext === 'css') return 'CSS';
|
|
120
|
+
if (ext === 'json') return 'JSON';
|
|
121
|
+
return 'Plain Text';
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
function parseFileLocation(file) {
|
|
125
|
+
var match = String(file || '').match(/:(\d+)(?::(\d+))?$/);
|
|
126
|
+
return {
|
|
127
|
+
line: match ? Number(match[1]) : 0,
|
|
128
|
+
column: match && match[2] ? Number(match[2]) : 1,
|
|
129
|
+
};
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
function renderIdeCode(codeFrame, errorLine, errorColumn) {
|
|
133
|
+
var rawLines = String(codeFrame || '').split(/\r?\n/);
|
|
134
|
+
var rows = [];
|
|
135
|
+
for (var i = 0; i < rawLines.length; i += 1) {
|
|
136
|
+
var line = rawLines[i];
|
|
137
|
+
var numbered = line.match(/^(\s*>)?\s*(\d+)\s+\|(.*)$/);
|
|
138
|
+
if (!numbered) continue;
|
|
139
|
+
var src = numbered[3];
|
|
140
|
+
if (src.charAt(0) === ' ') src = src.slice(1);
|
|
141
|
+
var isError = !!(numbered[1] && numbered[1].indexOf('>') !== -1);
|
|
142
|
+
var squiggleAt = -1;
|
|
143
|
+
var next = rawLines[i + 1] || '';
|
|
144
|
+
var caret = next.match(/\|(.*)$/);
|
|
145
|
+
if (caret && caret[1].indexOf('^') !== -1) {
|
|
146
|
+
var mark = caret[1];
|
|
147
|
+
if (mark.charAt(0) === ' ') mark = mark.slice(1);
|
|
148
|
+
squiggleAt = Math.max(0, mark.indexOf('^'));
|
|
149
|
+
isError = true;
|
|
150
|
+
i += 1;
|
|
151
|
+
}
|
|
152
|
+
rows.push({ n: Number(numbered[2]), text: src, error: isError, squiggleAt: squiggleAt });
|
|
153
|
+
}
|
|
154
|
+
if (!rows.length) {
|
|
155
|
+
return '<div class="vista-error-editor"><div class="vista-error-editor-line"><span class="vista-error-gutter"></span><span class="vista-error-source">' + highlightSource(String(codeFrame || '')) + '</span></div></div>';
|
|
156
|
+
}
|
|
157
|
+
var min = rows[0].n;
|
|
158
|
+
var max = rows[0].n;
|
|
159
|
+
var byN = {};
|
|
160
|
+
for (var r = 0; r < rows.length; r += 1) {
|
|
161
|
+
byN[rows[r].n] = rows[r];
|
|
162
|
+
if (rows[r].n < min) min = rows[r].n;
|
|
163
|
+
if (rows[r].n > max) max = rows[r].n;
|
|
164
|
+
}
|
|
165
|
+
var html = '';
|
|
166
|
+
for (var n = min; n <= max; n += 1) {
|
|
167
|
+
var row = byN[n] || { n: n, text: '', error: Number(errorLine) === n, squiggleAt: -1 };
|
|
168
|
+
if (row.squiggleAt < 0 && Number(errorLine) === n && errorColumn) {
|
|
169
|
+
row.squiggleAt = Math.max(0, Number(errorColumn) - 1);
|
|
170
|
+
row.error = true;
|
|
171
|
+
}
|
|
172
|
+
html += '<div class="vista-error-editor-line' + (row.error ? ' is-error' : '') + '">';
|
|
173
|
+
html += '<span class="vista-error-gutter">' + row.n + '</span>';
|
|
174
|
+
html += '<span class="vista-error-source">' + highlightSource(row.text);
|
|
175
|
+
if (row.squiggleAt >= 0) {
|
|
176
|
+
html += '<span class="vista-error-squiggle" style="width:3.2ch;margin-left:' + row.squiggleAt + 'ch"></span>';
|
|
177
|
+
}
|
|
178
|
+
html += '</span></div>';
|
|
179
|
+
}
|
|
180
|
+
return '<div class="vista-error-editor">' + html + '</div>';
|
|
88
181
|
}
|
|
89
182
|
|
|
90
183
|
function colorizeBlock(value) {
|
|
91
|
-
return
|
|
92
|
-
.split(/\r?\n/)
|
|
93
|
-
.map(function (line) {
|
|
94
|
-
return highlightLine(line);
|
|
95
|
-
})
|
|
96
|
-
.join('\n');
|
|
184
|
+
return renderIdeCode(value);
|
|
97
185
|
}
|
|
98
186
|
|
|
99
187
|
function createStyle() {
|
|
@@ -101,46 +189,95 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
101
189
|
var style = document.createElement('style');
|
|
102
190
|
style.id = STYLE_ID;
|
|
103
191
|
style.textContent = [
|
|
104
|
-
'#' + ROOT_ID + '{position:fixed;inset:0;z-index:2147482500;display:flex;align-items:center;justify-content:center;padding:
|
|
192
|
+
'#' + ROOT_ID + '{position:fixed;inset:0;z-index:2147482500;display:flex;align-items:center;justify-content:center;padding:20px;overflow:hidden;}',
|
|
105
193
|
'#' + ROOT_ID + '[hidden]{display:none;}',
|
|
106
|
-
'#' + ROOT_ID + ' .vista-ov-backdrop{position:absolute;inset:0;background:
|
|
107
|
-
'#' + ROOT_ID + ' .vista-ov-panel{position:relative;width:min(
|
|
108
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
109
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
110
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
111
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
112
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
113
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
114
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
115
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
116
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
117
|
-
'#' + ROOT_ID + ' .vista-ov-page-
|
|
118
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
119
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
120
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
121
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
122
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
194
|
+
'#' + ROOT_ID + ' .vista-ov-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.72);}',
|
|
195
|
+
'#' + ROOT_ID + ' .vista-ov-panel{position:relative;width:min(1180px,calc(100vw - 32px));height:min(820px,calc(100vh - 32px));display:flex;flex-direction:column;overflow:hidden;border-radius:8px;border:1px solid #2b2b2b;background:#1e1e1e;box-shadow:0 24px 80px rgba(0,0,0,0.62);color:#ededed;font-family:"Segoe UI",ui-sans-serif,system-ui,-apple-system,sans-serif;animation:vista-ov-in 160ms ease;}',
|
|
196
|
+
'#' + ROOT_ID + ' .vista-ov-titlebar{display:flex;align-items:center;justify-content:space-between;gap:12px;height:38px;padding:0 10px;background:#181818;border-bottom:1px solid #2b2b2b;flex-shrink:0;}',
|
|
197
|
+
'#' + ROOT_ID + ' .vista-ov-traffic{display:inline-flex;align-items:center;gap:6px;width:54px;}',
|
|
198
|
+
'#' + ROOT_ID + ' .vista-ov-traffic span{width:10px;height:10px;border-radius:999px;}',
|
|
199
|
+
'#' + ROOT_ID + ' .vista-ov-traffic .is-close{background:#ff5f57;}',
|
|
200
|
+
'#' + ROOT_ID + ' .vista-ov-traffic .is-min{background:#febc2e;}',
|
|
201
|
+
'#' + ROOT_ID + ' .vista-ov-traffic .is-max{background:#28c840;}',
|
|
202
|
+
'#' + ROOT_ID + ' .vista-ov-window-title{min-width:0;flex:1;text-align:center;color:#c6c6c6;font-size:12px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}',
|
|
203
|
+
'#' + ROOT_ID + ' .vista-ov-pagination{display:inline-flex;align-items:center;gap:2px;}',
|
|
204
|
+
'#' + ROOT_ID + ' .vista-ov-pagination[hidden]{display:none;}',
|
|
205
|
+
'#' + ROOT_ID + ' .vista-ov-page-btn{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:6px;background:transparent;color:#a1a1a1;font-size:16px;line-height:1;cursor:pointer;}',
|
|
206
|
+
'#' + ROOT_ID + ' .vista-ov-page-btn:disabled{opacity:0.28;cursor:default;}',
|
|
207
|
+
'#' + ROOT_ID + ' .vista-ov-page-btn:not(:disabled):hover{background:#171717;color:#ededed;}',
|
|
208
|
+
'#' + ROOT_ID + ' .vista-ov-page-count{font-size:13px;font-weight:500;color:#a1a1a1;min-width:36px;text-align:center;font-variant-numeric:tabular-nums;padding:0 4px;}',
|
|
209
|
+
'#' + ROOT_ID + ' .vista-ov-workbench{display:flex;flex:1;min-height:0;}',
|
|
210
|
+
'#' + ROOT_ID + ' .vista-ov-activity{width:48px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;padding-top:8px;background:#181818;border-right:1px solid #2b2b2b;}',
|
|
211
|
+
'#' + ROOT_ID + ' .vista-ov-activity-item{width:48px;height:40px;display:inline-flex;align-items:center;justify-content:center;color:#ffffff;box-shadow:inset 2px 0 0 #0078d4;}',
|
|
212
|
+
'#' + ROOT_ID + ' .vista-ov-activity-item svg{width:22px;height:22px;display:block;}',
|
|
213
|
+
'#' + ROOT_ID + ' .vista-ov-main{display:flex;flex-direction:column;flex:1;min-width:0;min-height:0;}',
|
|
214
|
+
'#' + ROOT_ID + ' .vista-ov-tabbar{display:flex;align-items:stretch;justify-content:space-between;height:35px;background:#181818;border-bottom:1px solid #2b2b2b;flex-shrink:0;}',
|
|
215
|
+
'#' + ROOT_ID + ' .vista-ov-tabs{display:flex;min-width:0;overflow:hidden;scrollbar-width:none;}',
|
|
216
|
+
'#' + ROOT_ID + ' .vista-ov-tabs::-webkit-scrollbar{display:none;}',
|
|
217
|
+
'#' + ROOT_ID + ' .vista-ov-tab{display:inline-flex;align-items:center;gap:8px;height:35px;padding:0 14px;border:0;border-right:1px solid #2b2b2b;background:#1e1e1e;color:#cccccc;font-size:12px;box-shadow:inset 0 -1px 0 #0078d4;cursor:pointer;}',
|
|
218
|
+
'#' + ROOT_ID + ' .vista-ov-tab.is-inactive{background:#181818;color:#8b8b8b;box-shadow:none;}',
|
|
219
|
+
'#' + ROOT_ID + ' .vista-ov-tab svg{width:14px;height:14px;}',
|
|
220
|
+
'#' + ROOT_ID + ' .vista-ov-actions{display:inline-flex;gap:2px;align-items:center;}',
|
|
221
|
+
'#' + ROOT_ID + ' .vista-ov-btn{width:28px;height:28px;padding:0;border:0;border-radius:6px;background:transparent;color:#a1a1a1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;}',
|
|
222
|
+
'#' + ROOT_ID + ' .vista-ov-btn:hover{background:#171717;color:#ededed;}',
|
|
123
223
|
'#' + ROOT_ID + ' .vista-ov-btn svg{width:14px;height:14px;display:block;}',
|
|
124
|
-
'#' + ROOT_ID + ' .vista-ov-btn:focus-visible{outline:2px solid
|
|
125
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
126
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
127
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
128
|
-
'#' + ROOT_ID + ' .vista-ov-
|
|
129
|
-
'#' + ROOT_ID + ' .vista-
|
|
130
|
-
'#' + ROOT_ID + ' .vista-
|
|
131
|
-
'#' + ROOT_ID + ' .vista-
|
|
132
|
-
'#' + ROOT_ID + ' .vista-
|
|
133
|
-
'#' + ROOT_ID + ' .vista-
|
|
134
|
-
'#' + ROOT_ID + ' .vista-
|
|
135
|
-
'#' + ROOT_ID + ' .vista-
|
|
136
|
-
'#' + ROOT_ID + ' .vista-
|
|
137
|
-
'#' + ROOT_ID + ' .vista-
|
|
138
|
-
'
|
|
139
|
-
'
|
|
140
|
-
'
|
|
141
|
-
'
|
|
142
|
-
'
|
|
143
|
-
'
|
|
224
|
+
'#' + ROOT_ID + ' .vista-ov-btn:focus-visible{outline:2px solid #ededed;outline-offset:1px;}',
|
|
225
|
+
'#' + ROOT_ID + ' .vista-ov-crumbs{height:24px;padding:0 12px;display:flex;align-items:center;background:#1e1e1e;border-bottom:1px solid #2b2b2b;color:#8b8b8b;font-size:11px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}',
|
|
226
|
+
'#' + ROOT_ID + ' .vista-ov-code{display:flex;flex-direction:column;flex:1;min-height:0;background:#1e1e1e;overflow:hidden;}',
|
|
227
|
+
'#' + ROOT_ID + ' .vista-ov-code[hidden]{display:none;}',
|
|
228
|
+
'#' + ROOT_ID + ' .vista-ov-editor-host{flex:1;min-height:0;overflow:auto;}',
|
|
229
|
+
'#' + ROOT_ID + ' .vista-error-editor{margin:0;min-height:100%;padding:8px 0 12px;font-size:13px;line-height:20px;font-family:ui-monospace,SFMono-Regular,"Cascadia Code",Menlo,Consolas,monospace;background:#1e1e1e;}',
|
|
230
|
+
'#' + ROOT_ID + ' .vista-error-editor-line{display:grid;grid-template-columns:56px minmax(0,1fr);min-height:20px;}',
|
|
231
|
+
'#' + ROOT_ID + ' .vista-error-editor-line.is-error{background:rgba(248,81,73,0.12);}',
|
|
232
|
+
'#' + ROOT_ID + ' .vista-error-gutter{padding:0 12px 0 0;border-right:1px solid #2b2b2b;color:#6e7681;text-align:right;user-select:none;font-variant-numeric:tabular-nums;}',
|
|
233
|
+
'#' + ROOT_ID + ' .vista-error-editor-line.is-error .vista-error-gutter{color:#f85149;font-weight:600;}',
|
|
234
|
+
'#' + ROOT_ID + ' .vista-error-source{position:relative;padding:0 16px 0 12px;color:#d4d4d4;white-space:pre;overflow:hidden;}',
|
|
235
|
+
'#' + ROOT_ID + ' .vista-error-squiggle{position:absolute;left:12px;bottom:0;height:4px;width:3.2ch;background-image:url("data:image/svg+xml,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' width=\'6\' height=\'4\' viewBox=\'0 0 6 4\'%3E%3Cpath d=\'M0 3 Q1.5 0 3 3 T6 3\' fill=\'none\' stroke=\'%23f85149\' stroke-width=\'1.4\'/%3E%3C/svg%3E");background-repeat:repeat-x;background-size:6px 4px;pointer-events:none;}',
|
|
236
|
+
'#' + ROOT_ID + ' .vista-tok-kw{color:#c586c0;}',
|
|
237
|
+
'#' + ROOT_ID + ' .vista-tok-str{color:#ce9178;}',
|
|
238
|
+
'#' + ROOT_ID + ' .vista-tok-cmt{color:#6a9955;font-style:italic;}',
|
|
239
|
+
'#' + ROOT_ID + ' .vista-tok-tag{color:#4ec9b0;}',
|
|
240
|
+
'#' + ROOT_ID + ' .vista-tok-num{color:#b5cea8;}',
|
|
241
|
+
'#' + ROOT_ID + ' .vista-ov-statusbar{display:flex;align-items:center;justify-content:space-between;gap:12px;height:22px;padding:0 10px;background:#007acc;color:#fff;font-size:12px;flex-shrink:0;}',
|
|
242
|
+
'#' + ROOT_ID + ' .vista-ov-panel-dock{display:flex;flex-direction:column;background:#181818;border-top:1px solid #2b2b2b;overflow:hidden;flex:0 0 auto;max-height:38%;min-height:148px;}',
|
|
243
|
+
'#' + ROOT_ID + ' .vista-ov-panel-tabs{display:flex;align-items:center;gap:16px;height:32px;padding:0 8px 0 12px;border-bottom:1px solid #2b2b2b;color:#bbbbbb;font-size:11px;font-weight:600;letter-spacing:0.06em;flex-shrink:0;}',
|
|
244
|
+
'#' + ROOT_ID + ' .vista-ov-panel-tabs .is-active{color:#fff;box-shadow:inset 0 -1px 0 #fff;padding-bottom:8px;}',
|
|
245
|
+
'#' + ROOT_ID + ' .vista-ov-panel-toggle{margin-left:auto;}',
|
|
246
|
+
'#' + ROOT_ID + ' .vista-ov-panel-toggle[hidden]{display:none;}',
|
|
247
|
+
'#' + ROOT_ID + ' .vista-ov-panel-toggle .vista-ide-icon-restore{display:none;}',
|
|
248
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-panel-expanded="true"] .vista-ov-tabbar,' +
|
|
249
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-panel-expanded="true"] .vista-ov-crumbs,' +
|
|
250
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-panel-expanded="true"] .vista-ov-code,' +
|
|
251
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-panel-expanded="true"] .vista-ov-statusbar{display:none;}',
|
|
252
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-panel-expanded="true"] .vista-ov-panel-dock{flex:1;max-height:none;min-height:0;border-top:0;}',
|
|
253
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-panel-expanded="true"] .vista-ide-icon-expand{display:none;}',
|
|
254
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-panel-expanded="true"] .vista-ide-icon-restore{display:block;}',
|
|
255
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-terminal="true"] .vista-ov-tabbar,' +
|
|
256
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-terminal="true"] .vista-ov-crumbs,' +
|
|
257
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-terminal="true"] .vista-ov-code,' +
|
|
258
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-terminal="true"] .vista-ov-statusbar{display:none;}',
|
|
259
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-terminal="true"] .vista-ov-panel-dock{flex:1;max-height:none;min-height:0;border-top:0;}',
|
|
260
|
+
'#' + ROOT_ID + ' .vista-ov-main[data-terminal="true"] .vista-ov-panel-toggle{display:none;}',
|
|
261
|
+
'#' + ROOT_ID + ' .vista-ov-body{flex:1;min-height:0;overflow:auto;padding:10px 14px 14px;}',
|
|
262
|
+
'#' + ROOT_ID + ' .vista-ov-editor-host,' + '#' + ROOT_ID + ' .vista-ov-body{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.16) transparent;}',
|
|
263
|
+
'#' + ROOT_ID + ' .vista-ov-editor-host::-webkit-scrollbar,' + '#' + ROOT_ID + ' .vista-ov-body::-webkit-scrollbar{width:6px;height:6px;}',
|
|
264
|
+
'#' + ROOT_ID + ' .vista-ov-editor-host::-webkit-scrollbar-track,' + '#' + ROOT_ID + ' .vista-ov-body::-webkit-scrollbar-track,' +
|
|
265
|
+
'#' + ROOT_ID + ' .vista-ov-editor-host::-webkit-scrollbar-corner,' + '#' + ROOT_ID + ' .vista-ov-body::-webkit-scrollbar-corner{background:transparent;}',
|
|
266
|
+
'#' + ROOT_ID + ' .vista-ov-editor-host::-webkit-scrollbar-thumb,' + '#' + ROOT_ID + ' .vista-ov-body::-webkit-scrollbar-thumb{background-color:rgba(255,255,255,0.16);border-radius:999px;}',
|
|
267
|
+
'#' + ROOT_ID + ' .vista-ov-editor-host::-webkit-scrollbar-thumb:hover,' + '#' + ROOT_ID + ' .vista-ov-body::-webkit-scrollbar-thumb:hover{background-color:rgba(255,255,255,0.34);}',
|
|
268
|
+
'#' + ROOT_ID + ' .vista-ov-kind{margin:0;color:#f85149;font-size:12px;font-weight:600;}',
|
|
269
|
+
'#' + ROOT_ID + ' .vista-ov-kind.is-hydration{color:#d29922;}',
|
|
270
|
+
'#' + ROOT_ID + ' .vista-ov-kind.is-server{color:#58a6ff;}',
|
|
271
|
+
'#' + ROOT_ID + ' .vista-ov-source-badge{padding:0 7px;border-radius:999px;font-size:10px;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;background:rgba(255,255,255,0.12);}',
|
|
272
|
+
'#' + ROOT_ID + ' .vista-ov-source-badge.is-server{background:#1f6feb;}',
|
|
273
|
+
'#' + ROOT_ID + ' .vista-ov-source-badge.is-hydration{background:#9e6a03;}',
|
|
274
|
+
'#' + ROOT_ID + ' .vista-ov-source-badge.is-client{background:#238636;}',
|
|
275
|
+
'#' + ROOT_ID + ' .vista-ov-title{margin:6px 0 0;font-size:13px;line-height:1.5;font-weight:500;color:#e6edf3;word-break:break-word;}',
|
|
276
|
+
'#' + ROOT_ID + ' .vista-ov-detail{margin:6px 0 0;font-size:12px;line-height:1.5;color:#8b949e;white-space:pre-wrap;word-break:break-word;}',
|
|
277
|
+
'#' + ROOT_ID + ' .vista-ov-detail[hidden]{display:none;}',
|
|
278
|
+
'@keyframes vista-ov-in{from{opacity:0;transform:translateY(8px) scale(0.98);}to{opacity:1;transform:translateY(0) scale(1);}}',
|
|
279
|
+
'@media (max-width: 720px){',
|
|
280
|
+
' #' + ROOT_ID + '{padding:10px;}',
|
|
144
281
|
'}',
|
|
145
282
|
].join('');
|
|
146
283
|
document.head.appendChild(style);
|
|
@@ -158,44 +295,46 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
158
295
|
root.innerHTML = [
|
|
159
296
|
'<div class="vista-ov-backdrop"></div>',
|
|
160
297
|
'<section class="vista-ov-panel" role="dialog" aria-modal="true" aria-label="Vista build error overlay">',
|
|
161
|
-
' <
|
|
162
|
-
' <div class="vista-ov-
|
|
163
|
-
'
|
|
164
|
-
'
|
|
165
|
-
' <div class="vista-ov-pagination" data-vista-pagination hidden>',
|
|
166
|
-
' <button type="button" class="vista-ov-page-btn" data-vista-prev aria-label="Previous error"><</button>',
|
|
167
|
-
' <span class="vista-ov-page-count" data-vista-count>1 / 1</span>',
|
|
168
|
-
' <button type="button" class="vista-ov-page-btn" data-vista-next aria-label="Next error">></button>',
|
|
169
|
-
' </div>',
|
|
170
|
-
' </div>',
|
|
171
|
-
' <h2 class="vista-ov-title" data-vista-ov-title>Build Error</h2>',
|
|
172
|
-
' <p class="vista-ov-meta" data-vista-ov-meta></p>',
|
|
173
|
-
' </div>',
|
|
174
|
-
' <div class="vista-ov-controls">',
|
|
298
|
+
' <div class="vista-ov-titlebar">',
|
|
299
|
+
' <div class="vista-ov-traffic" aria-hidden="true"><span class="is-close"></span><span class="is-min"></span><span class="is-max"></span></div>',
|
|
300
|
+
' <div class="vista-ov-window-title">Vista — <span data-vista-tab-name>untitled</span></div>',
|
|
301
|
+
' <div class="vista-ov-actions">',
|
|
175
302
|
' <button type="button" class="vista-ov-btn" data-vista-copy aria-label="Copy error">',
|
|
176
|
-
' <svg viewBox="0 0 24 24" fill="none" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"><rect x="9" y="9" width="10" height="10" rx="2" stroke="currentColor" stroke-width="
|
|
303
|
+
' <svg viewBox="0 0 24 24" fill="none" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"><rect x="9" y="9" width="10" height="10" rx="2" stroke="currentColor" stroke-width="1.6"/><rect x="5" y="5" width="10" height="10" rx="2" stroke="currentColor" stroke-width="1.6"/></svg>',
|
|
177
304
|
' </button>',
|
|
178
305
|
' <button type="button" class="vista-ov-btn" data-vista-minimize aria-label="Minimize">',
|
|
179
|
-
' <svg viewBox="0 0 24 24" fill="none" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"><path d="M5 12H19" stroke="currentColor" stroke-width="
|
|
306
|
+
' <svg viewBox="0 0 24 24" fill="none" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"><path d="M5 12H19" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg>',
|
|
180
307
|
' </button>',
|
|
181
308
|
' <button type="button" class="vista-ov-btn" data-vista-reload aria-label="Reload">',
|
|
182
|
-
' <svg viewBox="0 0 24 24" fill="none" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"><path d="M20 11A8 8 0 1 0 12 20" stroke="currentColor" stroke-width="
|
|
309
|
+
' <svg viewBox="0 0 24 24" fill="none" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"><path d="M20 11A8 8 0 1 0 12 20" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/><path d="M20 4V11H13" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg>',
|
|
183
310
|
' </button>',
|
|
311
|
+
' <div class="vista-ov-pagination" data-vista-pagination hidden>',
|
|
312
|
+
' <button type="button" class="vista-ov-page-btn" data-vista-prev aria-label="Previous error">‹</button>',
|
|
313
|
+
' <span class="vista-ov-page-count" data-vista-count>1/1</span>',
|
|
314
|
+
' <button type="button" class="vista-ov-page-btn" data-vista-next aria-label="Next error">›</button>',
|
|
315
|
+
' </div>',
|
|
316
|
+
' </div>',
|
|
317
|
+
' </div>',
|
|
318
|
+
' <div class="vista-ov-workbench">',
|
|
319
|
+
' <aside class="vista-ov-activity" aria-hidden="true"><span class="vista-ov-activity-item"><svg viewBox="0 0 24 24" fill="none"><rect x="4" y="3" width="10" height="13" rx="1.2" stroke="currentColor" stroke-width="1.6"/><rect x="10" y="8" width="10" height="13" rx="1.2" stroke="currentColor" stroke-width="1.6"/></svg></span></aside>',
|
|
320
|
+
' <div class="vista-ov-main" data-vista-ide-main>',
|
|
321
|
+
' <div class="vista-ov-tabbar">',
|
|
322
|
+
' <div class="vista-ov-tabs" data-vista-file-tabs><button type="button" class="vista-ov-tab" data-vista-file-tab="0"><svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><rect x="3" y="2" width="10" height="12" rx="1.5" stroke="#4fc1ff" stroke-width="1.4"/><path d="M6 6h4M6 9h4M6 12h2" stroke="#4fc1ff" stroke-width="1.2" stroke-linecap="round"/></svg><span data-vista-tab-name>untitled</span></button></div>',
|
|
323
|
+
' </div>',
|
|
324
|
+
' <div class="vista-ov-crumbs" data-vista-crumbs>Source</div>',
|
|
325
|
+
' <div class="vista-ov-code" data-vista-files-wrap>',
|
|
326
|
+
' <div class="vista-ov-editor-host" data-vista-message></div>',
|
|
327
|
+
' </div>',
|
|
328
|
+
' <div class="vista-ov-statusbar"><span data-vista-status-ln>Ready</span><span data-vista-status-lang>Plain Text</span><span class="vista-ov-source-badge" data-vista-source-badge>Build</span><span>UTF-8</span></div>',
|
|
329
|
+
' <div class="vista-ov-panel-dock">',
|
|
330
|
+
' <div class="vista-ov-panel-tabs"><span class="is-active">PROBLEMS</span><span>OUTPUT</span><button type="button" class="vista-ov-btn vista-ov-panel-toggle" data-vista-panel-expand aria-label="Expand problems panel" aria-pressed="false"><svg class="vista-ide-icon-expand" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M3 6.5V3h3.5M13 6.5V3h-3.5M3 9.5V13h3.5M13 9.5V13h-3.5" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg><svg class="vista-ide-icon-restore" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M6.5 3v3.5H3M9.5 3v3.5H13M6.5 13V9.5H3M9.5 13V9.5H13" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg></button></div>',
|
|
331
|
+
' <div class="vista-ov-body">',
|
|
332
|
+
' <p class="vista-ov-kind" data-vista-ov-kind>Build Error</p>',
|
|
333
|
+
' <h1 class="vista-ov-title" data-vista-ov-title>Build Error</h1>',
|
|
334
|
+
' <p class="vista-ov-detail" data-vista-ov-detail hidden></p>',
|
|
335
|
+
' </div>',
|
|
336
|
+
' </div>',
|
|
184
337
|
' </div>',
|
|
185
|
-
' </header>',
|
|
186
|
-
' <div class="vista-ov-body">',
|
|
187
|
-
' <section class="vista-ov-section" data-vista-hints-wrap hidden>',
|
|
188
|
-
' <h3 class="vista-ov-section-title">Insights</h3>',
|
|
189
|
-
' <ul class="vista-ov-list" data-vista-hints></ul>',
|
|
190
|
-
' </section>',
|
|
191
|
-
' <section class="vista-ov-section" data-vista-files-wrap hidden>',
|
|
192
|
-
' <h3 class="vista-ov-section-title">Possible Files</h3>',
|
|
193
|
-
' <ul class="vista-ov-list" data-vista-files></ul>',
|
|
194
|
-
' </section>',
|
|
195
|
-
' <section class="vista-ov-section">',
|
|
196
|
-
' <h3 class="vista-ov-section-title">Message</h3>',
|
|
197
|
-
' <pre class="vista-ov-pre" data-vista-message></pre>',
|
|
198
|
-
' </section>',
|
|
199
338
|
' </div>',
|
|
200
339
|
'</section>',
|
|
201
340
|
].join('');
|
|
@@ -207,11 +346,15 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
207
346
|
var backdrop = root.querySelector('.vista-ov-backdrop');
|
|
208
347
|
messageNode = root.querySelector('[data-vista-message]');
|
|
209
348
|
titleNode = root.querySelector('[data-vista-ov-title]');
|
|
210
|
-
|
|
349
|
+
detailNode = root.querySelector('[data-vista-ov-detail]');
|
|
211
350
|
filesWrapNode = root.querySelector('[data-vista-files-wrap]');
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
351
|
+
tabNameNodes = root.querySelectorAll('[data-vista-tab-name]');
|
|
352
|
+
crumbsNode = root.querySelector('[data-vista-crumbs]');
|
|
353
|
+
statusLnNode = root.querySelector('[data-vista-status-ln]');
|
|
354
|
+
statusLangNode = root.querySelector('[data-vista-status-lang]');
|
|
355
|
+
kindNode = root.querySelector('[data-vista-ov-kind]');
|
|
356
|
+
sourceBadgeNode = root.querySelector('[data-vista-source-badge]');
|
|
357
|
+
fileTabsNode = root.querySelector('[data-vista-file-tabs]');
|
|
215
358
|
copyButton = root.querySelector('[data-vista-copy]');
|
|
216
359
|
minimizeButton = root.querySelector('[data-vista-minimize]');
|
|
217
360
|
reloadButton = root.querySelector('[data-vista-reload]');
|
|
@@ -219,10 +362,20 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
219
362
|
prevButton = root.querySelector('[data-vista-prev]');
|
|
220
363
|
nextButton = root.querySelector('[data-vista-next]');
|
|
221
364
|
countNode = root.querySelector('[data-vista-count]');
|
|
365
|
+
mainNode = root.querySelector('[data-vista-ide-main]');
|
|
366
|
+
panelExpandButton = root.querySelector('[data-vista-panel-expand]');
|
|
222
367
|
|
|
223
368
|
if (listenersBound) return;
|
|
224
369
|
listenersBound = true;
|
|
225
370
|
|
|
371
|
+
if (fileTabsNode) {
|
|
372
|
+
fileTabsNode.addEventListener('click', function (event) {
|
|
373
|
+
var target = event.target && event.target.closest ? event.target.closest('[data-vista-file-tab]') : null;
|
|
374
|
+
if (!target) return;
|
|
375
|
+
state.fileTab = Number(target.getAttribute('data-vista-file-tab') || 0);
|
|
376
|
+
renderCurrent();
|
|
377
|
+
});
|
|
378
|
+
}
|
|
226
379
|
if (copyButton) {
|
|
227
380
|
copyButton.addEventListener('click', function () {
|
|
228
381
|
copyCurrentMessage();
|
|
@@ -248,6 +401,21 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
248
401
|
moveActiveIndex(1);
|
|
249
402
|
});
|
|
250
403
|
}
|
|
404
|
+
if (panelExpandButton && mainNode) {
|
|
405
|
+
panelExpandButton.addEventListener('click', function () {
|
|
406
|
+
if (mainNode.getAttribute('data-terminal') === 'true') return;
|
|
407
|
+
var expanded = mainNode.getAttribute('data-panel-expanded') === 'true';
|
|
408
|
+
if (expanded) {
|
|
409
|
+
mainNode.removeAttribute('data-panel-expanded');
|
|
410
|
+
panelExpandButton.setAttribute('aria-pressed', 'false');
|
|
411
|
+
panelExpandButton.setAttribute('aria-label', 'Expand problems panel');
|
|
412
|
+
} else {
|
|
413
|
+
mainNode.setAttribute('data-panel-expanded', 'true');
|
|
414
|
+
panelExpandButton.setAttribute('aria-pressed', 'true');
|
|
415
|
+
panelExpandButton.setAttribute('aria-label', 'Restore problems panel');
|
|
416
|
+
}
|
|
417
|
+
});
|
|
418
|
+
}
|
|
251
419
|
if (backdrop) {
|
|
252
420
|
backdrop.addEventListener('click', function () {
|
|
253
421
|
minimize();
|
|
@@ -259,7 +427,15 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
259
427
|
moveActiveIndex(-1);
|
|
260
428
|
} else if (event.key === 'ArrowRight') {
|
|
261
429
|
moveActiveIndex(1);
|
|
262
|
-
} else
|
|
430
|
+
} else if (event.key === 'Escape') {
|
|
431
|
+
if (mainNode && mainNode.getAttribute('data-panel-expanded') === 'true' && mainNode.getAttribute('data-terminal') !== 'true') {
|
|
432
|
+
mainNode.removeAttribute('data-panel-expanded');
|
|
433
|
+
if (panelExpandButton) {
|
|
434
|
+
panelExpandButton.setAttribute('aria-pressed', 'false');
|
|
435
|
+
panelExpandButton.setAttribute('aria-label', 'Expand problems panel');
|
|
436
|
+
}
|
|
437
|
+
return;
|
|
438
|
+
}
|
|
263
439
|
minimize();
|
|
264
440
|
}
|
|
265
441
|
});
|
|
@@ -316,7 +492,7 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
316
492
|
for (var fileIdx = 0; fileIdx < lines.length; fileIdx += 1) {
|
|
317
493
|
var maybeFile = lines[fileIdx].match(filePattern);
|
|
318
494
|
if (!maybeFile) continue;
|
|
319
|
-
var normalized = maybeFile[0].replace(/\\/g, '/');
|
|
495
|
+
var normalized = maybeFile[0].replace(/\\/g, '/').replace(/^\.\//, '');
|
|
320
496
|
if (files.indexOf(normalized) === -1) {
|
|
321
497
|
files.push(normalized);
|
|
322
498
|
}
|
|
@@ -346,37 +522,30 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
346
522
|
hints.push('Resolve the top-most failure first, then reload to see remaining issues.');
|
|
347
523
|
}
|
|
348
524
|
|
|
525
|
+
var kind = 'build';
|
|
526
|
+
if (/hydration/i.test(title) || /hydration|did not match|server rendered html/i.test(raw)) {
|
|
527
|
+
kind = 'hydration';
|
|
528
|
+
} else if (/server error|flight ssr/i.test(title + ' ' + raw)) {
|
|
529
|
+
kind = 'server';
|
|
530
|
+
} else if (/runtime|unhandled promise/i.test(title)) {
|
|
531
|
+
kind = 'runtime';
|
|
532
|
+
}
|
|
533
|
+
|
|
349
534
|
return {
|
|
350
535
|
raw: raw,
|
|
351
536
|
title: title,
|
|
352
537
|
files: files,
|
|
353
538
|
hints: hints,
|
|
539
|
+
kind: kind,
|
|
354
540
|
timestamp: new Date(),
|
|
355
541
|
};
|
|
356
542
|
}
|
|
357
543
|
|
|
358
544
|
function fillList(node, values, wrapNode) {
|
|
359
|
-
if (!node
|
|
360
|
-
while (node.firstChild) node.removeChild(node.firstChild);
|
|
361
|
-
if (!values || values.length === 0) {
|
|
362
|
-
wrapNode.hidden = true;
|
|
363
|
-
return;
|
|
364
|
-
}
|
|
365
|
-
for (var i = 0; i < values.length; i += 1) {
|
|
366
|
-
var item = document.createElement('li');
|
|
367
|
-
var code = document.createElement('code');
|
|
368
|
-
code.textContent = values[i];
|
|
369
|
-
item.appendChild(code);
|
|
370
|
-
node.appendChild(item);
|
|
371
|
-
}
|
|
372
|
-
wrapNode.hidden = false;
|
|
373
|
-
}
|
|
374
|
-
|
|
375
|
-
function fillHints(node, values, wrapNode) {
|
|
376
|
-
if (!node || !wrapNode) return;
|
|
545
|
+
if (!node) return;
|
|
377
546
|
while (node.firstChild) node.removeChild(node.firstChild);
|
|
378
547
|
if (!values || values.length === 0) {
|
|
379
|
-
wrapNode.hidden =
|
|
548
|
+
if (wrapNode) wrapNode.hidden = false;
|
|
380
549
|
return;
|
|
381
550
|
}
|
|
382
551
|
for (var i = 0; i < values.length; i += 1) {
|
|
@@ -384,7 +553,7 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
384
553
|
item.textContent = values[i];
|
|
385
554
|
node.appendChild(item);
|
|
386
555
|
}
|
|
387
|
-
wrapNode.hidden = false;
|
|
556
|
+
if (wrapNode) wrapNode.hidden = false;
|
|
388
557
|
}
|
|
389
558
|
|
|
390
559
|
function currentEntry() {
|
|
@@ -399,7 +568,7 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
399
568
|
var total = state.entries.length;
|
|
400
569
|
var current = total === 0 ? 0 : state.activeIndex + 1;
|
|
401
570
|
if (countNode) {
|
|
402
|
-
countNode.textContent = current + '
|
|
571
|
+
countNode.textContent = current + '/' + (total || 1);
|
|
403
572
|
}
|
|
404
573
|
if (paginationNode) {
|
|
405
574
|
paginationNode.hidden = total <= 1;
|
|
@@ -412,22 +581,78 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
412
581
|
}
|
|
413
582
|
}
|
|
414
583
|
|
|
584
|
+
function entryHasCode(parsed) {
|
|
585
|
+
if (!parsed) return false;
|
|
586
|
+
if (parsed.kind === 'server' || parsed.kind === 'hydration') return false;
|
|
587
|
+
return /(\s*>)?\s*\d+\s+\|/.test(String(parsed.raw || ''));
|
|
588
|
+
}
|
|
589
|
+
|
|
415
590
|
function renderCurrent() {
|
|
416
591
|
var parsed = currentEntry();
|
|
417
592
|
if (!parsed || !root) return;
|
|
593
|
+
var files = parsed.files && parsed.files.length ? parsed.files : [''];
|
|
594
|
+
if (state.fileTab > files.length - 1) state.fileTab = 0;
|
|
595
|
+
var file = files[state.fileTab] || files[0] || '';
|
|
596
|
+
var loc = parseFileLocation(file);
|
|
597
|
+
var tabName = fileBasename(file);
|
|
598
|
+
var kind = parsed.kind || 'build';
|
|
599
|
+
var kindLabel = kind === 'hydration' ? 'Hydration Error' : kind === 'server' ? 'Server Error' : kind === 'runtime' ? 'Unhandled Runtime Error' : 'Build Error';
|
|
600
|
+
var badge = kind === 'hydration' ? 'Hydration' : kind === 'server' ? 'Server' : kind === 'runtime' ? 'Client' : 'Build';
|
|
601
|
+
var terminal = !entryHasCode(parsed);
|
|
602
|
+
var titleName = terminal ? kindLabel : tabName;
|
|
603
|
+
if (kindNode) {
|
|
604
|
+
kindNode.textContent = kindLabel;
|
|
605
|
+
kindNode.className = 'vista-ov-kind' + (kind === 'hydration' || kind === 'server' ? ' is-' + kind : '');
|
|
606
|
+
}
|
|
418
607
|
if (titleNode) titleNode.textContent = parsed.title || 'Build Error';
|
|
419
|
-
if (
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
608
|
+
if (detailNode) {
|
|
609
|
+
var hintText = (parsed.hints || []).join(' ');
|
|
610
|
+
if (kind === 'hydration' && hintText.indexOf('HTML') === -1) {
|
|
611
|
+
hintText = 'Server HTML did not match the client. ' + hintText;
|
|
612
|
+
}
|
|
613
|
+
detailNode.textContent = hintText;
|
|
614
|
+
detailNode.hidden = hintText.length === 0;
|
|
615
|
+
}
|
|
616
|
+
if (fileTabsNode) {
|
|
617
|
+
var tabs = '';
|
|
618
|
+
for (var i = 0; i < files.length; i += 1) {
|
|
619
|
+
var name = fileBasename(files[i] || 'untitled');
|
|
620
|
+
tabs += '<button type="button" class="vista-ov-tab' + (i === state.fileTab ? '' : ' is-inactive') + '" data-vista-file-tab="' + i + '">';
|
|
621
|
+
tabs += '<svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><rect x="3" y="2" width="10" height="12" rx="1.5" stroke="#4fc1ff" stroke-width="1.4"/><path d="M6 6h4M6 9h4M6 12h2" stroke="#4fc1ff" stroke-width="1.2" stroke-linecap="round"/></svg>';
|
|
622
|
+
tabs += '<span>' + escapeHtml(name) + '</span></button>';
|
|
623
|
+
}
|
|
624
|
+
fileTabsNode.innerHTML = tabs;
|
|
625
|
+
}
|
|
626
|
+
if (tabNameNodes) {
|
|
627
|
+
for (var t = 0; t < tabNameNodes.length; t += 1) {
|
|
628
|
+
if (tabNameNodes[t].closest && tabNameNodes[t].closest('[data-vista-file-tabs]')) continue;
|
|
629
|
+
tabNameNodes[t].textContent = titleName;
|
|
630
|
+
}
|
|
631
|
+
}
|
|
632
|
+
if (crumbsNode) crumbsNode.textContent = fileBreadcrumb(file);
|
|
633
|
+
if (statusLnNode) statusLnNode.textContent = loc.line ? ('Ln ' + loc.line + ', Col ' + loc.column) : 'Ready';
|
|
634
|
+
if (statusLangNode) statusLangNode.textContent = languageFromFile(file);
|
|
635
|
+
if (sourceBadgeNode) {
|
|
636
|
+
sourceBadgeNode.textContent = badge;
|
|
637
|
+
sourceBadgeNode.className = 'vista-ov-source-badge' + (kind === 'build' ? '' : ' is-' + (kind === 'runtime' ? 'client' : kind));
|
|
638
|
+
}
|
|
639
|
+
if (messageNode) messageNode.innerHTML = renderIdeCode(parsed.raw, loc.line, loc.column);
|
|
640
|
+
if (filesWrapNode) filesWrapNode.hidden = false;
|
|
641
|
+
if (mainNode) {
|
|
642
|
+
if (terminal) {
|
|
643
|
+
mainNode.setAttribute('data-terminal', 'true');
|
|
644
|
+
mainNode.removeAttribute('data-panel-expanded');
|
|
645
|
+
} else {
|
|
646
|
+
mainNode.removeAttribute('data-terminal');
|
|
647
|
+
}
|
|
648
|
+
}
|
|
649
|
+
if (panelExpandButton) {
|
|
650
|
+
panelExpandButton.hidden = terminal;
|
|
651
|
+
if (terminal) {
|
|
652
|
+
panelExpandButton.setAttribute('aria-pressed', 'false');
|
|
653
|
+
panelExpandButton.setAttribute('aria-label', 'Expand problems panel');
|
|
654
|
+
}
|
|
655
|
+
}
|
|
431
656
|
updatePagination();
|
|
432
657
|
}
|
|
433
658
|
|
|
@@ -436,6 +661,7 @@ function getDevErrorOverlayBootstrapSource() {
|
|
|
436
661
|
var next = state.activeIndex + offset;
|
|
437
662
|
if (next < 0 || next >= state.entries.length) return;
|
|
438
663
|
state.activeIndex = next;
|
|
664
|
+
state.fileTab = 0;
|
|
439
665
|
renderCurrent();
|
|
440
666
|
}
|
|
441
667
|
|