@actis/codemirror 26.9.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/LICENSE +674 -0
- package/README.md +23 -0
- package/dist/index.cjs +731 -0
- package/dist/index.d.cts +54 -0
- package/dist/index.d.mts +54 -0
- package/dist/index.mjs +715 -0
- package/package.json +68 -0
- package/styles.css +79 -0
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,731 @@
|
|
|
1
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
+
let _codemirror_autocomplete = require("@codemirror/autocomplete");
|
|
3
|
+
let _codemirror_lang_cpp = require("@codemirror/lang-cpp");
|
|
4
|
+
let _codemirror_view = require("@codemirror/view");
|
|
5
|
+
let codemirror = require("codemirror");
|
|
6
|
+
let _codemirror_state = require("@codemirror/state");
|
|
7
|
+
let _codemirror_language = require("@codemirror/language");
|
|
8
|
+
let _codemirror_lint = require("@codemirror/lint");
|
|
9
|
+
let _lezer_highlight = require("@lezer/highlight");
|
|
10
|
+
//#region src/plugin/bracket-match.ts
|
|
11
|
+
const MATCH = new Map([
|
|
12
|
+
["(", ")"],
|
|
13
|
+
["[", "]"],
|
|
14
|
+
["{", "}"]
|
|
15
|
+
]);
|
|
16
|
+
const OPEN = new Set(MATCH.keys());
|
|
17
|
+
const CLOSE = new Set(MATCH.values());
|
|
18
|
+
function findUnmatchedBrackets(doc) {
|
|
19
|
+
const stack = [];
|
|
20
|
+
const unmatched = [];
|
|
21
|
+
let offset = 0;
|
|
22
|
+
const iter = doc.iter();
|
|
23
|
+
while (!iter.next().done) {
|
|
24
|
+
const chunk = iter.value;
|
|
25
|
+
for (let i = 0; i < chunk.length; i++) {
|
|
26
|
+
const ch = chunk[i];
|
|
27
|
+
if (OPEN.has(ch)) stack.push({
|
|
28
|
+
char: ch,
|
|
29
|
+
pos: offset + i
|
|
30
|
+
});
|
|
31
|
+
else if (CLOSE.has(ch)) {
|
|
32
|
+
const top = stack.at(-1);
|
|
33
|
+
if (top && MATCH.get(top.char) === ch) stack.pop();
|
|
34
|
+
else unmatched.push(offset + i);
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
offset += chunk.length;
|
|
38
|
+
}
|
|
39
|
+
for (const { pos } of stack) unmatched.push(pos);
|
|
40
|
+
return unmatched.sort((a, b) => a - b);
|
|
41
|
+
}
|
|
42
|
+
const unmatchedDecoration = _codemirror_view.Decoration.mark({ class: "cm-nonmatchingBracket" });
|
|
43
|
+
function buildDecorations(doc) {
|
|
44
|
+
const builder = new _codemirror_state.RangeSetBuilder();
|
|
45
|
+
for (const pos of findUnmatchedBrackets(doc)) builder.add(pos, pos + 1, unmatchedDecoration);
|
|
46
|
+
return builder.finish();
|
|
47
|
+
}
|
|
48
|
+
const nonMatchingBracketPlugin = _codemirror_view.ViewPlugin.fromClass(class {
|
|
49
|
+
constructor(view) {
|
|
50
|
+
this.decorations = buildDecorations(view.state.doc);
|
|
51
|
+
}
|
|
52
|
+
update(update) {
|
|
53
|
+
if (update.docChanged) this.decorations = buildDecorations(update.state.doc);
|
|
54
|
+
}
|
|
55
|
+
}, { decorations: (v) => v.decorations });
|
|
56
|
+
//#endregion
|
|
57
|
+
//#region src/plugin/completions.ts
|
|
58
|
+
const WEBGL_KEYWORDS = [
|
|
59
|
+
"precision",
|
|
60
|
+
"lowp",
|
|
61
|
+
"mediump",
|
|
62
|
+
"highp",
|
|
63
|
+
"attribute",
|
|
64
|
+
"uniform",
|
|
65
|
+
"varying",
|
|
66
|
+
"break",
|
|
67
|
+
"continue",
|
|
68
|
+
"do",
|
|
69
|
+
"for",
|
|
70
|
+
"while",
|
|
71
|
+
"if",
|
|
72
|
+
"else",
|
|
73
|
+
"float",
|
|
74
|
+
"int",
|
|
75
|
+
"void",
|
|
76
|
+
"bool",
|
|
77
|
+
"mat2",
|
|
78
|
+
"mat3",
|
|
79
|
+
"mat4",
|
|
80
|
+
"vec2",
|
|
81
|
+
"vec3",
|
|
82
|
+
"vec4",
|
|
83
|
+
"ivec2",
|
|
84
|
+
"ivec3",
|
|
85
|
+
"ivec4",
|
|
86
|
+
"bvec2",
|
|
87
|
+
"bvec3",
|
|
88
|
+
"bvec4",
|
|
89
|
+
"sampler2D",
|
|
90
|
+
"samplerCube",
|
|
91
|
+
"struct",
|
|
92
|
+
"discard",
|
|
93
|
+
"return"
|
|
94
|
+
];
|
|
95
|
+
const WEBGL2_KEYWORDS = [
|
|
96
|
+
"layout",
|
|
97
|
+
"flat",
|
|
98
|
+
"smooth",
|
|
99
|
+
"noperspective",
|
|
100
|
+
"switch",
|
|
101
|
+
"case",
|
|
102
|
+
"default",
|
|
103
|
+
"uint",
|
|
104
|
+
"uvec2",
|
|
105
|
+
"uvec3",
|
|
106
|
+
"uvec4",
|
|
107
|
+
"mat2x2",
|
|
108
|
+
"mat2x3",
|
|
109
|
+
"mat2x4",
|
|
110
|
+
"mat3x2",
|
|
111
|
+
"mat3x3",
|
|
112
|
+
"mat3x4",
|
|
113
|
+
"mat4x2",
|
|
114
|
+
"mat4x3",
|
|
115
|
+
"mat4x4",
|
|
116
|
+
"isampler2D",
|
|
117
|
+
"isampler3D",
|
|
118
|
+
"isamplerCube",
|
|
119
|
+
"usampler2D",
|
|
120
|
+
"usampler3D",
|
|
121
|
+
"usamplerCube"
|
|
122
|
+
];
|
|
123
|
+
const SNIPPETS = [{
|
|
124
|
+
label: "main",
|
|
125
|
+
detail: "main entry point",
|
|
126
|
+
type: "function",
|
|
127
|
+
template: "void main() {\n ${}\n gl_FragColor = vec4(1.0);\n}"
|
|
128
|
+
}, {
|
|
129
|
+
label: "for",
|
|
130
|
+
detail: "for loop",
|
|
131
|
+
type: "keyword",
|
|
132
|
+
template: "for (int i = 0; i < ${count}; i++) {\n ${}\n}"
|
|
133
|
+
}];
|
|
134
|
+
const WORD_PATTERN = /\w*/;
|
|
135
|
+
function glslCompletions(options = {}) {
|
|
136
|
+
const completions = [...[...WEBGL_KEYWORDS, ...options.webgl2 ? WEBGL2_KEYWORDS : []].map((kw) => ({
|
|
137
|
+
label: kw,
|
|
138
|
+
type: "keyword"
|
|
139
|
+
})), ...SNIPPETS.map((s) => (0, _codemirror_autocomplete.snippetCompletion)(s.template, {
|
|
140
|
+
label: s.label,
|
|
141
|
+
detail: s.detail,
|
|
142
|
+
type: s.type
|
|
143
|
+
}))];
|
|
144
|
+
return (context) => {
|
|
145
|
+
const word = context.matchBefore(WORD_PATTERN);
|
|
146
|
+
if (!word || word.from === word.to && !context.explicit) return null;
|
|
147
|
+
return {
|
|
148
|
+
from: word.from,
|
|
149
|
+
options: completions
|
|
150
|
+
};
|
|
151
|
+
};
|
|
152
|
+
}
|
|
153
|
+
//#endregion
|
|
154
|
+
//#region src/plugin/folding.ts
|
|
155
|
+
function codeFoldingExtension() {
|
|
156
|
+
return [(0, _codemirror_language.codeFolding)({
|
|
157
|
+
preparePlaceholder(state, range) {
|
|
158
|
+
const from = state.doc.lineAt(range.from).number;
|
|
159
|
+
return `${state.doc.lineAt(range.to).number - from} lines`;
|
|
160
|
+
},
|
|
161
|
+
placeholderDOM(_view, onclick, text) {
|
|
162
|
+
const placeholder = document.createElement("span");
|
|
163
|
+
placeholder.className = "cm-fold-placeholder";
|
|
164
|
+
placeholder.textContent = text;
|
|
165
|
+
placeholder.setAttribute("role", "button");
|
|
166
|
+
placeholder.setAttribute("aria-label", "unfold code");
|
|
167
|
+
placeholder.setAttribute("title", "Click to unfold");
|
|
168
|
+
placeholder.setAttribute("tabindex", "0");
|
|
169
|
+
placeholder.style.touchAction = "manipulation";
|
|
170
|
+
placeholder.addEventListener("click", onclick);
|
|
171
|
+
placeholder.addEventListener("keydown", (e) => {
|
|
172
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
173
|
+
e.preventDefault();
|
|
174
|
+
onclick(e);
|
|
175
|
+
}
|
|
176
|
+
});
|
|
177
|
+
return placeholder;
|
|
178
|
+
}
|
|
179
|
+
})];
|
|
180
|
+
}
|
|
181
|
+
//#endregion
|
|
182
|
+
//#region src/plugin/scrollbar.ts
|
|
183
|
+
const scrollbarRuler = _codemirror_view.ViewPlugin.fromClass(class {
|
|
184
|
+
constructor(view) {
|
|
185
|
+
this.view = view;
|
|
186
|
+
this.rectPool = [];
|
|
187
|
+
this.trackHeight = 0;
|
|
188
|
+
this.scrollHeight = 0;
|
|
189
|
+
this.clientHeight = 0;
|
|
190
|
+
this.thumbHeight = 0;
|
|
191
|
+
this.TRACK_WIDTH = 15;
|
|
192
|
+
this.onThumbPointerDown = (e) => {
|
|
193
|
+
e.stopPropagation();
|
|
194
|
+
e.preventDefault();
|
|
195
|
+
this.thumb.setPointerCapture(e.pointerId);
|
|
196
|
+
const startY = e.clientY;
|
|
197
|
+
const startScrollTop = this.view.scrollDOM.scrollTop;
|
|
198
|
+
const onMove = (ev) => {
|
|
199
|
+
const maxThumbTop = this.trackHeight - this.thumbHeight;
|
|
200
|
+
const maxScrollTop = this.scrollHeight - this.clientHeight;
|
|
201
|
+
if (maxThumbTop <= 0) return;
|
|
202
|
+
this.view.scrollDOM.scrollTop = startScrollTop + (ev.clientY - startY) * (maxScrollTop / maxThumbTop);
|
|
203
|
+
};
|
|
204
|
+
const onUp = () => {
|
|
205
|
+
this.thumb.removeEventListener("pointermove", onMove);
|
|
206
|
+
this.thumb.removeEventListener("pointerup", onUp);
|
|
207
|
+
};
|
|
208
|
+
this.thumb.addEventListener("pointermove", onMove);
|
|
209
|
+
this.thumb.addEventListener("pointerup", onUp);
|
|
210
|
+
};
|
|
211
|
+
this.onTrackPointerDown = (e) => {
|
|
212
|
+
if (e.target === this.thumb) return;
|
|
213
|
+
e.preventDefault();
|
|
214
|
+
const rect = this.inner.getBoundingClientRect();
|
|
215
|
+
const clickFraction = Math.max(0, Math.min(1, (e.clientY - rect.top - this.thumbHeight / 2) / (this.trackHeight - this.thumbHeight)));
|
|
216
|
+
this.view.scrollDOM.scrollTop = clickFraction * (this.scrollHeight - this.clientHeight);
|
|
217
|
+
};
|
|
218
|
+
this.syncThumb = () => {
|
|
219
|
+
const maxScroll = this.scrollHeight - this.clientHeight;
|
|
220
|
+
if (maxScroll <= 0) {
|
|
221
|
+
this.thumb.style.display = "none";
|
|
222
|
+
return;
|
|
223
|
+
}
|
|
224
|
+
this.thumb.style.display = "";
|
|
225
|
+
const thumbTop = this.view.scrollDOM.scrollTop / maxScroll * (this.trackHeight - this.thumbHeight);
|
|
226
|
+
this.thumb.style.transform = `translate3d(0, ${thumbTop}px, 0)`;
|
|
227
|
+
};
|
|
228
|
+
this.gutter = document.createElement("div");
|
|
229
|
+
this.gutter.className = "cm-scrollbar-gutter";
|
|
230
|
+
this.inner = document.createElement("div");
|
|
231
|
+
this.inner.className = "cm-scrollbar-inner";
|
|
232
|
+
this.svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
233
|
+
this.svg.setAttribute("aria-hidden", "true");
|
|
234
|
+
this.svg.style.display = "block";
|
|
235
|
+
this.svg.style.width = "100%";
|
|
236
|
+
this.thumb = document.createElement("div");
|
|
237
|
+
this.thumb.className = "cm-scrollbar-thumb";
|
|
238
|
+
this.thumb.style.willChange = "transform";
|
|
239
|
+
this.inner.appendChild(this.svg);
|
|
240
|
+
this.inner.appendChild(this.thumb);
|
|
241
|
+
this.gutter.appendChild(this.inner);
|
|
242
|
+
view.dom.classList.add("cm-with-scrollbar");
|
|
243
|
+
view.dom.appendChild(this.gutter);
|
|
244
|
+
this.cursorRect = document.createElementNS("http://www.w3.org/2000/svg", "rect");
|
|
245
|
+
this.cursorRect.setAttribute("x", "0");
|
|
246
|
+
this.cursorRect.setAttribute("y", "0");
|
|
247
|
+
this.cursorRect.setAttribute("width", `${this.TRACK_WIDTH}`);
|
|
248
|
+
this.cursorRect.setAttribute("height", "2");
|
|
249
|
+
this.cursorRect.setAttribute("fill", "var(--cm-foreground, #888)");
|
|
250
|
+
this.cursorRect.style.willChange = "transform";
|
|
251
|
+
this.svg.appendChild(this.cursorRect);
|
|
252
|
+
this.thumb.addEventListener("pointerdown", this.onThumbPointerDown);
|
|
253
|
+
this.inner.addEventListener("pointerdown", this.onTrackPointerDown);
|
|
254
|
+
this.view.scrollDOM.addEventListener("scroll", this.syncThumb, { passive: true });
|
|
255
|
+
this.measureAndPaint();
|
|
256
|
+
}
|
|
257
|
+
update(update) {
|
|
258
|
+
let needsFullPaint = false;
|
|
259
|
+
if (update.geometryChanged) {
|
|
260
|
+
this.measure();
|
|
261
|
+
needsFullPaint = true;
|
|
262
|
+
}
|
|
263
|
+
if (update.docChanged || update.transactions.some((t) => t.effects.length > 0)) needsFullPaint = true;
|
|
264
|
+
if (needsFullPaint) this.paintMarkers();
|
|
265
|
+
if (update.selectionSet || needsFullPaint) this.paintCursor();
|
|
266
|
+
}
|
|
267
|
+
measure() {
|
|
268
|
+
const scrollDOM = this.view.scrollDOM;
|
|
269
|
+
this.scrollHeight = scrollDOM.scrollHeight;
|
|
270
|
+
this.clientHeight = scrollDOM.clientHeight;
|
|
271
|
+
const scrollerRect = scrollDOM.getBoundingClientRect();
|
|
272
|
+
const editorRect = this.view.dom.getBoundingClientRect();
|
|
273
|
+
this.trackHeight = scrollerRect.height;
|
|
274
|
+
this.gutter.style.top = `${scrollerRect.top - editorRect.top}px`;
|
|
275
|
+
this.gutter.style.height = `${this.trackHeight}px`;
|
|
276
|
+
this.svg.setAttribute("height", `${this.trackHeight}`);
|
|
277
|
+
const newThumbHeight = Math.max(20, this.clientHeight / this.scrollHeight * this.trackHeight);
|
|
278
|
+
if (Math.abs(this.thumbHeight - newThumbHeight) > .5) {
|
|
279
|
+
this.thumbHeight = newThumbHeight;
|
|
280
|
+
this.thumb.style.height = `${newThumbHeight}px`;
|
|
281
|
+
}
|
|
282
|
+
}
|
|
283
|
+
measureAndPaint() {
|
|
284
|
+
this.measure();
|
|
285
|
+
this.paintMarkers();
|
|
286
|
+
this.paintCursor();
|
|
287
|
+
this.syncThumb();
|
|
288
|
+
}
|
|
289
|
+
paintCursor() {
|
|
290
|
+
const { state } = this.view;
|
|
291
|
+
if (state.doc.length === 0 || this.scrollHeight <= 0) return;
|
|
292
|
+
const y = this.posToY(state.selection.main.head);
|
|
293
|
+
this.cursorRect.style.transform = `translate3d(0, ${y}px, 0)`;
|
|
294
|
+
}
|
|
295
|
+
paintMarkers() {
|
|
296
|
+
const { state } = this.view;
|
|
297
|
+
if (state.doc.length === 0 || this.trackHeight <= 0 || this.scrollHeight <= 0) return;
|
|
298
|
+
let i = 0;
|
|
299
|
+
(0, _codemirror_lint.forEachDiagnostic)(state, (diag) => {
|
|
300
|
+
if (diag.severity !== "error") return;
|
|
301
|
+
const top = this.posToY(diag.from);
|
|
302
|
+
const bottom = this.posToY(diag.to);
|
|
303
|
+
const height = Math.max(3, bottom - top);
|
|
304
|
+
let rect;
|
|
305
|
+
if (i < this.rectPool.length) rect = this.rectPool[i];
|
|
306
|
+
else {
|
|
307
|
+
rect = document.createElementNS("http://www.w3.org/2000/svg", "rect");
|
|
308
|
+
rect.setAttribute("x", "0");
|
|
309
|
+
rect.setAttribute("y", "0");
|
|
310
|
+
rect.setAttribute("width", `${this.TRACK_WIDTH}`);
|
|
311
|
+
rect.setAttribute("height", "1");
|
|
312
|
+
rect.setAttribute("fill", "#ff5555");
|
|
313
|
+
rect.style.transformOrigin = "0 0";
|
|
314
|
+
this.svg.insertBefore(rect, this.cursorRect);
|
|
315
|
+
this.rectPool.push(rect);
|
|
316
|
+
}
|
|
317
|
+
rect.style.transform = `translate3d(0, ${top}px, 0) scaleY(${height})`;
|
|
318
|
+
rect.style.display = "";
|
|
319
|
+
i++;
|
|
320
|
+
});
|
|
321
|
+
while (i < this.rectPool.length) {
|
|
322
|
+
this.rectPool[i].style.display = "none";
|
|
323
|
+
i++;
|
|
324
|
+
}
|
|
325
|
+
}
|
|
326
|
+
posToY(pos) {
|
|
327
|
+
if (this.scrollHeight <= 0) return 0;
|
|
328
|
+
const safePos = Math.max(0, Math.min(pos, this.view.state.doc.length));
|
|
329
|
+
return (this.view.lineBlockAt(safePos).top + this.view.documentPadding.top) / this.scrollHeight * this.trackHeight;
|
|
330
|
+
}
|
|
331
|
+
destroy() {
|
|
332
|
+
this.thumb.removeEventListener("pointerdown", this.onThumbPointerDown);
|
|
333
|
+
this.inner.removeEventListener("pointerdown", this.onTrackPointerDown);
|
|
334
|
+
this.view.scrollDOM.removeEventListener("scroll", this.syncThumb);
|
|
335
|
+
this.gutter.remove();
|
|
336
|
+
}
|
|
337
|
+
});
|
|
338
|
+
const scrollbarRulerTheme = _codemirror_view.EditorView.baseTheme({
|
|
339
|
+
".cm-scrollbar-gutter": {
|
|
340
|
+
position: "absolute",
|
|
341
|
+
right: "0",
|
|
342
|
+
width: "0.938rem",
|
|
343
|
+
pointerEvents: "auto",
|
|
344
|
+
overflow: "hidden",
|
|
345
|
+
zIndex: 10,
|
|
346
|
+
userSelect: "none"
|
|
347
|
+
},
|
|
348
|
+
".cm-scrollbar-inner": {
|
|
349
|
+
position: "relative",
|
|
350
|
+
width: "100%",
|
|
351
|
+
height: "100%",
|
|
352
|
+
backgroundColor: "rgba(0, 0, 0, 0.1)",
|
|
353
|
+
cursor: "pointer"
|
|
354
|
+
},
|
|
355
|
+
".cm-scrollbar-inner svg": {
|
|
356
|
+
position: "absolute",
|
|
357
|
+
top: "0",
|
|
358
|
+
left: "0",
|
|
359
|
+
height: "100%",
|
|
360
|
+
pointerEvents: "none"
|
|
361
|
+
},
|
|
362
|
+
".cm-scrollbar-thumb": {
|
|
363
|
+
position: "absolute",
|
|
364
|
+
left: "0",
|
|
365
|
+
right: "0",
|
|
366
|
+
backgroundColor: "rgba(128, 128, 128, 0.3)",
|
|
367
|
+
pointerEvents: "auto",
|
|
368
|
+
cursor: "default",
|
|
369
|
+
zIndex: 11
|
|
370
|
+
},
|
|
371
|
+
".cm-scrollbar-thumb:hover": { backgroundColor: "rgba(128, 128, 128, 0.5)" },
|
|
372
|
+
".cm-scrollbar-thumb:active": { backgroundColor: "rgba(128, 128, 128, 0.6)" },
|
|
373
|
+
".cm-scroller": {
|
|
374
|
+
scrollbarWidth: "none",
|
|
375
|
+
msOverflowStyle: "none"
|
|
376
|
+
},
|
|
377
|
+
".cm-scroller::-webkit-scrollbar": { display: "none" }
|
|
378
|
+
});
|
|
379
|
+
function scrollbarRulerExtension() {
|
|
380
|
+
return [scrollbarRuler, scrollbarRulerTheme];
|
|
381
|
+
}
|
|
382
|
+
//#endregion
|
|
383
|
+
//#region src/plugin/selection.ts
|
|
384
|
+
const selectionLineHighlightPlugin = _codemirror_view.ViewPlugin.fromClass(class {
|
|
385
|
+
update(update) {
|
|
386
|
+
if (update.selectionSet || update.docChanged) {
|
|
387
|
+
const { state, dom } = update.view;
|
|
388
|
+
if (state.selection.ranges.some((r) => !r.empty)) {
|
|
389
|
+
dom.style.setProperty("--cm-line-highlight-background", "transparent");
|
|
390
|
+
dom.style.setProperty("--cm-line-highlight-border", "transparent");
|
|
391
|
+
} else {
|
|
392
|
+
dom.style.removeProperty("--cm-line-highlight-background");
|
|
393
|
+
dom.style.removeProperty("--cm-line-highlight-border");
|
|
394
|
+
}
|
|
395
|
+
}
|
|
396
|
+
}
|
|
397
|
+
});
|
|
398
|
+
//#endregion
|
|
399
|
+
//#region src/plugin/theme.ts
|
|
400
|
+
const keyword = "var(--cm-keyword)";
|
|
401
|
+
const property = "var(--cm-property)";
|
|
402
|
+
const punctuation = "var(--cm-punctuation)";
|
|
403
|
+
const invalid = "var(--cm-invalid, #ffffff)";
|
|
404
|
+
const foreground = "var(--cm-foreground)";
|
|
405
|
+
const lineNumber = "var(--cm-line-number)";
|
|
406
|
+
const comment = "var(--cm-comment)";
|
|
407
|
+
const variable = "var(--cm-variable)";
|
|
408
|
+
const string = "var(--cm-string)";
|
|
409
|
+
const darkBackground = "var(--cm-background)";
|
|
410
|
+
const highlightBackground = "var(--cm-line-highlight-background)";
|
|
411
|
+
const background = "var(--cm-background)";
|
|
412
|
+
const tooltipBackground = "var(--cm-tooltip-background)";
|
|
413
|
+
const selection = "var(--cm-selection-background)";
|
|
414
|
+
const border = "var(--cm-border)";
|
|
415
|
+
const cursor = "var(--cm-cursor, #888)";
|
|
416
|
+
const vitesseTheme = _codemirror_view.EditorView.theme({
|
|
417
|
+
"&": {
|
|
418
|
+
color: foreground,
|
|
419
|
+
backgroundColor: background,
|
|
420
|
+
fontFamily: "var(--cm-font-family)",
|
|
421
|
+
fontSize: "var(--cm-font-size, 14px)",
|
|
422
|
+
lineHeight: "var(--cm-line-height, 1.6)",
|
|
423
|
+
fontVariantLigatures: "var(--cm-font-ligatures, normal)",
|
|
424
|
+
fontFeatureSettings: "var(--cm-font-feature-settings, \"calt\" 1)"
|
|
425
|
+
},
|
|
426
|
+
"& div": { flexDirection: "initial" },
|
|
427
|
+
"&.cm-focused": { outline: "none" },
|
|
428
|
+
".cm-content": { caretColor: cursor },
|
|
429
|
+
".cm-completionIcon": { display: "none" },
|
|
430
|
+
".cm-cursor, .cm-dropCursor": { borderLeftColor: cursor },
|
|
431
|
+
"&.cm-focused .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection": { backgroundColor: `${selection} !important` },
|
|
432
|
+
".cm-panels": {
|
|
433
|
+
backgroundColor: darkBackground,
|
|
434
|
+
color: foreground
|
|
435
|
+
},
|
|
436
|
+
".cm-panels.cm-panels-top": { borderBottom: "1px solid var(--cm-border)" },
|
|
437
|
+
".cm-panels.cm-panels-bottom": { borderTop: "1px solid var(--cm-border)" },
|
|
438
|
+
".cm-searchMatch": {
|
|
439
|
+
backgroundColor: "var(--cm-search-match-background, #72a1ff59)",
|
|
440
|
+
outline: "1px solid var(--cm-search-match-outline, #457dff)"
|
|
441
|
+
},
|
|
442
|
+
".cm-searchMatch.cm-searchMatch-selected": { backgroundColor: "var(--cm-search-match-selected-background, #6199ff2f)" },
|
|
443
|
+
".cm-line": {
|
|
444
|
+
border: "1px solid transparent",
|
|
445
|
+
lineHeight: "inherit"
|
|
446
|
+
},
|
|
447
|
+
".cm-activeLine": {
|
|
448
|
+
backgroundColor: highlightBackground,
|
|
449
|
+
border: "1px solid var(--cm-line-highlight-border)"
|
|
450
|
+
},
|
|
451
|
+
".cm-selectionMatch": { backgroundColor: "var(--cm-selection-match-background, #aafe661a)" },
|
|
452
|
+
"&.cm-focused .cm-matchingBracket": {
|
|
453
|
+
backgroundColor: "var(--cm-matching-bracket-background)",
|
|
454
|
+
textDecoration: "underline",
|
|
455
|
+
textUnderlineOffset: "var(--cm-bracket-underline-offset, 2px)"
|
|
456
|
+
},
|
|
457
|
+
"&.cm-focused .cm-nonmatchingBracket": {
|
|
458
|
+
backgroundColor: "var(--cm-nonmatching-bracket-background)",
|
|
459
|
+
outline: "1px solid color-mix(in srgb, var(--cm-nonmatching-bracket-background), white 25%)",
|
|
460
|
+
borderRadius: "2px"
|
|
461
|
+
},
|
|
462
|
+
".cm-gutters": {
|
|
463
|
+
backgroundColor: background,
|
|
464
|
+
color: lineNumber,
|
|
465
|
+
border: "none",
|
|
466
|
+
fontFamily: "var(--cm-font-family)"
|
|
467
|
+
},
|
|
468
|
+
".cm-activeLineGutter": {
|
|
469
|
+
backgroundColor: "transparent",
|
|
470
|
+
color: "var(--cm-active-line-gutter, #bfbaaa)"
|
|
471
|
+
},
|
|
472
|
+
".cm-foldPlaceholder": {
|
|
473
|
+
backgroundColor: "transparent",
|
|
474
|
+
border: "none",
|
|
475
|
+
color: "var(--cm-fold-placeholder-color, #ddd)"
|
|
476
|
+
},
|
|
477
|
+
".cm-tooltip": {
|
|
478
|
+
border: `1px solid ${border}`,
|
|
479
|
+
borderRadius: "4px",
|
|
480
|
+
backgroundColor: tooltipBackground,
|
|
481
|
+
color: "var(--cm-tooltip-foreground, #c2beb3)",
|
|
482
|
+
fontFamily: "var(--cm-font-family)"
|
|
483
|
+
},
|
|
484
|
+
".cm-tooltip .cm-tooltip-arrow:before": {
|
|
485
|
+
borderTopColor: "transparent",
|
|
486
|
+
borderBottomColor: "transparent"
|
|
487
|
+
},
|
|
488
|
+
".cm-tooltip .cm-tooltip-arrow:after": {
|
|
489
|
+
borderTopColor: tooltipBackground,
|
|
490
|
+
borderBottomColor: tooltipBackground
|
|
491
|
+
},
|
|
492
|
+
".cm-tooltip-autocomplete": { "& > ul > li[aria-selected]": {
|
|
493
|
+
backgroundColor: selection,
|
|
494
|
+
color: "var(--cm-tooltip-foreground, #c2beb3)"
|
|
495
|
+
} }
|
|
496
|
+
}, { dark: true });
|
|
497
|
+
const vitesseHighlightStyle = _codemirror_language.HighlightStyle.define([
|
|
498
|
+
{
|
|
499
|
+
tag: [_lezer_highlight.tags.variableName, _lezer_highlight.tags.regexp],
|
|
500
|
+
color: "var(--cm-decorator)"
|
|
501
|
+
},
|
|
502
|
+
{
|
|
503
|
+
tag: [
|
|
504
|
+
_lezer_highlight.tags.name,
|
|
505
|
+
_lezer_highlight.tags.deleted,
|
|
506
|
+
_lezer_highlight.tags.character,
|
|
507
|
+
_lezer_highlight.tags.propertyName,
|
|
508
|
+
_lezer_highlight.tags.macroName
|
|
509
|
+
],
|
|
510
|
+
color: property
|
|
511
|
+
},
|
|
512
|
+
{
|
|
513
|
+
tag: [_lezer_highlight.tags.function(_lezer_highlight.tags.variableName), _lezer_highlight.tags.labelName],
|
|
514
|
+
color: variable
|
|
515
|
+
},
|
|
516
|
+
{
|
|
517
|
+
tag: [
|
|
518
|
+
_lezer_highlight.tags.color,
|
|
519
|
+
_lezer_highlight.tags.constant(_lezer_highlight.tags.name),
|
|
520
|
+
_lezer_highlight.tags.standard(_lezer_highlight.tags.name)
|
|
521
|
+
],
|
|
522
|
+
color: "var(--cm-constant, #c99076)"
|
|
523
|
+
},
|
|
524
|
+
{
|
|
525
|
+
tag: [_lezer_highlight.tags.definition(_lezer_highlight.tags.name), _lezer_highlight.tags.separator],
|
|
526
|
+
color: foreground
|
|
527
|
+
},
|
|
528
|
+
{
|
|
529
|
+
tag: [_lezer_highlight.tags.angleBracket],
|
|
530
|
+
color: "var(--cm-angle-bracket, #666666)"
|
|
531
|
+
},
|
|
532
|
+
{
|
|
533
|
+
tag: [_lezer_highlight.tags.brace],
|
|
534
|
+
color: "var(--cm-brace, #5eaab5)"
|
|
535
|
+
},
|
|
536
|
+
{
|
|
537
|
+
tag: [_lezer_highlight.tags.bracket],
|
|
538
|
+
color: "var(--cm-bracket, #4d9375)"
|
|
539
|
+
},
|
|
540
|
+
{
|
|
541
|
+
tag: [
|
|
542
|
+
_lezer_highlight.tags.typeName,
|
|
543
|
+
_lezer_highlight.tags.className,
|
|
544
|
+
_lezer_highlight.tags.number,
|
|
545
|
+
_lezer_highlight.tags.changed,
|
|
546
|
+
_lezer_highlight.tags.annotation,
|
|
547
|
+
_lezer_highlight.tags.modifier,
|
|
548
|
+
_lezer_highlight.tags.self,
|
|
549
|
+
_lezer_highlight.tags.namespace,
|
|
550
|
+
_lezer_highlight.tags.keyword,
|
|
551
|
+
_lezer_highlight.tags.atom,
|
|
552
|
+
_lezer_highlight.tags.bool,
|
|
553
|
+
_lezer_highlight.tags.special(_lezer_highlight.tags.variableName)
|
|
554
|
+
],
|
|
555
|
+
color: keyword
|
|
556
|
+
},
|
|
557
|
+
{
|
|
558
|
+
tag: [_lezer_highlight.tags.definitionKeyword],
|
|
559
|
+
color: "var(--cm-definition-keyword)"
|
|
560
|
+
},
|
|
561
|
+
{
|
|
562
|
+
tag: [
|
|
563
|
+
_lezer_highlight.tags.operator,
|
|
564
|
+
_lezer_highlight.tags.operatorKeyword,
|
|
565
|
+
_lezer_highlight.tags.url,
|
|
566
|
+
_lezer_highlight.tags.escape,
|
|
567
|
+
_lezer_highlight.tags.link,
|
|
568
|
+
_lezer_highlight.tags.special(_lezer_highlight.tags.string)
|
|
569
|
+
],
|
|
570
|
+
color: punctuation
|
|
571
|
+
},
|
|
572
|
+
{
|
|
573
|
+
tag: [_lezer_highlight.tags.meta, _lezer_highlight.tags.comment],
|
|
574
|
+
color: comment
|
|
575
|
+
},
|
|
576
|
+
{
|
|
577
|
+
tag: _lezer_highlight.tags.strong,
|
|
578
|
+
fontWeight: "var(--cm-font-weight-bold, bold)"
|
|
579
|
+
},
|
|
580
|
+
{
|
|
581
|
+
tag: _lezer_highlight.tags.emphasis,
|
|
582
|
+
fontStyle: "var(--cm-font-style-italic, italic)"
|
|
583
|
+
},
|
|
584
|
+
{
|
|
585
|
+
tag: _lezer_highlight.tags.strikethrough,
|
|
586
|
+
textDecoration: "line-through"
|
|
587
|
+
},
|
|
588
|
+
{
|
|
589
|
+
tag: _lezer_highlight.tags.link,
|
|
590
|
+
color: lineNumber,
|
|
591
|
+
textDecoration: "underline"
|
|
592
|
+
},
|
|
593
|
+
{
|
|
594
|
+
tag: _lezer_highlight.tags.heading,
|
|
595
|
+
fontWeight: "var(--cm-font-weight-bold, bold)",
|
|
596
|
+
color: property
|
|
597
|
+
},
|
|
598
|
+
{
|
|
599
|
+
tag: [
|
|
600
|
+
_lezer_highlight.tags.processingInstruction,
|
|
601
|
+
_lezer_highlight.tags.string,
|
|
602
|
+
_lezer_highlight.tags.inserted
|
|
603
|
+
],
|
|
604
|
+
color: string
|
|
605
|
+
},
|
|
606
|
+
{
|
|
607
|
+
tag: _lezer_highlight.tags.invalid,
|
|
608
|
+
color: invalid
|
|
609
|
+
}
|
|
610
|
+
]);
|
|
611
|
+
const vitesse = [vitesseTheme, (0, _codemirror_language.syntaxHighlighting)(vitesseHighlightStyle)];
|
|
612
|
+
//#endregion
|
|
613
|
+
//#region src/plugin/word-highlight.ts
|
|
614
|
+
const WORD_BEFORE_PATTERN = /\w*$/;
|
|
615
|
+
const WORD_AFTER_PATTERN = /^\w*/;
|
|
616
|
+
const ESCAPE_REGEX_PATTERN = /[.*+?^${}()|[\]\\]/g;
|
|
617
|
+
function escapeRegExp(string) {
|
|
618
|
+
return string.replace(ESCAPE_REGEX_PATTERN, "\\$&");
|
|
619
|
+
}
|
|
620
|
+
const wordHighlightPlugin = _codemirror_view.ViewPlugin.fromClass(class {
|
|
621
|
+
constructor() {
|
|
622
|
+
this.decorations = _codemirror_view.Decoration.none;
|
|
623
|
+
this.cachedWord = null;
|
|
624
|
+
this.cachedDecorations = null;
|
|
625
|
+
}
|
|
626
|
+
update(update) {
|
|
627
|
+
if (update.selectionSet || update.docChanged) {
|
|
628
|
+
const word = this.getCurrentWord(update.view);
|
|
629
|
+
if (word !== this.cachedWord || update.docChanged) {
|
|
630
|
+
this.cachedWord = word;
|
|
631
|
+
if (word) this.cachedDecorations = this.buildDecorations(update.view, word);
|
|
632
|
+
else this.cachedDecorations = _codemirror_view.Decoration.none;
|
|
633
|
+
this.decorations = this.cachedDecorations;
|
|
634
|
+
}
|
|
635
|
+
}
|
|
636
|
+
}
|
|
637
|
+
getCurrentWord(view) {
|
|
638
|
+
const { state } = view;
|
|
639
|
+
const { selection, doc } = state;
|
|
640
|
+
for (const range of selection.ranges) if (range.empty) {
|
|
641
|
+
const pos = range.head;
|
|
642
|
+
const line = doc.lineAt(pos);
|
|
643
|
+
const text = line.text;
|
|
644
|
+
const offset = pos - line.from;
|
|
645
|
+
const beforeMatch = text.slice(0, offset).match(WORD_BEFORE_PATTERN);
|
|
646
|
+
const afterMatch = text.slice(offset).match(WORD_AFTER_PATTERN);
|
|
647
|
+
if (beforeMatch && afterMatch) {
|
|
648
|
+
const wordStart = offset - beforeMatch[0].length;
|
|
649
|
+
const word = text.slice(wordStart, wordStart + beforeMatch[0].length + afterMatch[0].length);
|
|
650
|
+
if (word.length > 0) {
|
|
651
|
+
if ((wordStart > 0 ? text[wordStart - 1] : "") === ".") return null;
|
|
652
|
+
return word;
|
|
653
|
+
}
|
|
654
|
+
}
|
|
655
|
+
}
|
|
656
|
+
return null;
|
|
657
|
+
}
|
|
658
|
+
buildDecorations(view, word) {
|
|
659
|
+
const { doc } = view.state;
|
|
660
|
+
const builder = new _codemirror_state.RangeSetBuilder();
|
|
661
|
+
const escapedWord = escapeRegExp(word);
|
|
662
|
+
const pattern = new RegExp(`(?<!\\.)\\b${escapedWord}\\b`, "g");
|
|
663
|
+
for (let lineNum = 1; lineNum <= doc.lines; lineNum++) {
|
|
664
|
+
const line = doc.line(lineNum);
|
|
665
|
+
pattern.lastIndex = 0;
|
|
666
|
+
let match;
|
|
667
|
+
while (true) {
|
|
668
|
+
match = pattern.exec(line.text);
|
|
669
|
+
if (match === null) break;
|
|
670
|
+
const from = line.from + match.index;
|
|
671
|
+
const to = from + match[0].length;
|
|
672
|
+
builder.add(from, to, _codemirror_view.Decoration.mark({ class: "cm-word-highlight" }));
|
|
673
|
+
}
|
|
674
|
+
}
|
|
675
|
+
return builder.finish();
|
|
676
|
+
}
|
|
677
|
+
}, { decorations: (v) => v.decorations });
|
|
678
|
+
const wordHighlightTheme = _codemirror_view.EditorView.baseTheme({ ".cm-word-highlight": {
|
|
679
|
+
backgroundColor: "var(--cm-word-highlight-background, hsl(210 91% 61% / 0.15))",
|
|
680
|
+
borderRadius: "2px"
|
|
681
|
+
} });
|
|
682
|
+
function wordHighlightExtension() {
|
|
683
|
+
return [wordHighlightPlugin, wordHighlightTheme];
|
|
684
|
+
}
|
|
685
|
+
//#endregion
|
|
686
|
+
//#region src/glsl.ts
|
|
687
|
+
const actisCodeMirrorClassName = "cm-actis-editor";
|
|
688
|
+
function glslLanguage() {
|
|
689
|
+
return (0, _codemirror_lang_cpp.cpp)();
|
|
690
|
+
}
|
|
691
|
+
function glslEditorExtensions(options = {}) {
|
|
692
|
+
const extensions = [];
|
|
693
|
+
const basicSetup = options.basicSetup === void 0 ? codemirror.basicSetup : options.basicSetup;
|
|
694
|
+
if (basicSetup !== false) extensions.push(basicSetup);
|
|
695
|
+
const language = options.language === void 0 ? glslLanguage() : options.language;
|
|
696
|
+
if (language !== false) extensions.push(language);
|
|
697
|
+
const theme = options.theme === void 0 ? vitesse : options.theme;
|
|
698
|
+
if (theme !== false) extensions.push(theme);
|
|
699
|
+
if (options.nonMatchingBrackets !== false) extensions.push(nonMatchingBracketPlugin);
|
|
700
|
+
if (options.wordHighlight !== false) extensions.push(wordHighlightExtension());
|
|
701
|
+
if (options.selectionLineHighlight !== false) extensions.push(selectionLineHighlightPlugin);
|
|
702
|
+
if (options.scrollbar !== false) extensions.push(scrollbarRulerExtension());
|
|
703
|
+
if (options.scrollPastEnd !== false) extensions.push((0, _codemirror_view.scrollPastEnd)());
|
|
704
|
+
if (options.folding !== false) extensions.push(codeFoldingExtension());
|
|
705
|
+
const completionSource = options.completionSource === void 0 ? glslCompletions(options) : options.completionSource;
|
|
706
|
+
if (completionSource !== false) extensions.push((0, _codemirror_autocomplete.autocompletion)({
|
|
707
|
+
activateOnTyping: true,
|
|
708
|
+
override: [completionSource]
|
|
709
|
+
}));
|
|
710
|
+
if (options.onChange) extensions.push(_codemirror_view.EditorView.updateListener.of((update) => {
|
|
711
|
+
if (update.docChanged) options.onChange?.(update.state.doc.toString(), update);
|
|
712
|
+
}));
|
|
713
|
+
return extensions;
|
|
714
|
+
}
|
|
715
|
+
//#endregion
|
|
716
|
+
exports.actisCodeMirrorClassName = actisCodeMirrorClassName;
|
|
717
|
+
exports.codeFoldingExtension = codeFoldingExtension;
|
|
718
|
+
exports.glslCompletions = glslCompletions;
|
|
719
|
+
exports.glslEditorExtensions = glslEditorExtensions;
|
|
720
|
+
exports.glslLanguage = glslLanguage;
|
|
721
|
+
exports.nonMatchingBracketPlugin = nonMatchingBracketPlugin;
|
|
722
|
+
exports.scrollbarRuler = scrollbarRuler;
|
|
723
|
+
exports.scrollbarRulerExtension = scrollbarRulerExtension;
|
|
724
|
+
exports.scrollbarRulerTheme = scrollbarRulerTheme;
|
|
725
|
+
exports.selectionLineHighlightPlugin = selectionLineHighlightPlugin;
|
|
726
|
+
exports.vitesse = vitesse;
|
|
727
|
+
exports.vitesseHighlightStyle = vitesseHighlightStyle;
|
|
728
|
+
exports.vitesseTheme = vitesseTheme;
|
|
729
|
+
exports.wordHighlightExtension = wordHighlightExtension;
|
|
730
|
+
exports.wordHighlightPlugin = wordHighlightPlugin;
|
|
731
|
+
exports.wordHighlightTheme = wordHighlightTheme;
|