feat(code): adjust word wrapping automatically in preview

This commit is contained in:
Elian Doran 2025-05-12 00:23:47 +03:00
parent 4e18798850
commit d79977b9a4
No known key found for this signature in database
2 changed files with 11 additions and 4 deletions

View File

@ -141,6 +141,7 @@ export default class CodeTheme extends OptionsWidget {
}
this.editor.setText(SAMPLE_CODE);
this.editor.setMimeType(SAMPLE_MIME);
this.editor.setLineWrapping(options.codeLineWrapEnabled === "true");
// Load the theme.
const themeId = options.codeNoteTheme;

View File

@ -27,11 +27,13 @@ export default class CodeMirror extends EditorView {
private languageCompartment: Compartment;
private historyCompartment: Compartment;
private themeCompartment: Compartment;
private lineWrappingCompartment: Compartment;
constructor(config: EditorConfig) {
const languageCompartment = new Compartment();
const historyCompartment = new Compartment();
const themeCompartment = new Compartment();
const lineWrappingCompartment = new Compartment();
let extensions: Extension[] = [];
@ -42,6 +44,7 @@ export default class CodeMirror extends EditorView {
extensions = [
...extensions,
languageCompartment.of([]),
lineWrappingCompartment.of(config.lineWrapping ? EditorView.lineWrapping : []),
themeCompartment.of([
syntaxHighlighting(defaultHighlightStyle, { fallback: true })
]),
@ -74,10 +77,6 @@ export default class CodeMirror extends EditorView {
extensions.push(EditorState.readOnly.of(true));
}
if (config.lineWrapping) {
extensions.push(EditorView.lineWrapping);
}
super({
parent: config.parent,
extensions
@ -86,6 +85,7 @@ export default class CodeMirror extends EditorView {
this.languageCompartment = languageCompartment;
this.historyCompartment = historyCompartment;
this.themeCompartment = themeCompartment;
this.lineWrappingCompartment = lineWrappingCompartment;
}
#onDocumentUpdated(v: ViewUpdate) {
@ -115,6 +115,12 @@ export default class CodeMirror extends EditorView {
});
}
setLineWrapping(wrapping: boolean) {
this.dispatch({
effects: [ this.lineWrappingCompartment.reconfigure(wrapping ? EditorView.lineWrapping : []) ]
});
}
/**
* Clears the history of undo/redo. Generally useful when changing to a new document.
*/