Desktop,Mobile: Add setting to disable markup autocompletion (#11222)

packages/app-desktop/gui/NoteEditor/NoteBody/CodeMirror/v6/CodeMirror.tsx

@@ -381,6 +381,7 @@ const CodeMirror = (props: NoteBodyEditorProps, ref: ForwardedRef<NoteBodyEditor
 				monospaceFont: Setting.value('style.editor.monospaceFontFamily'),
 			},
 			automatchBraces: Setting.value('editor.autoMatchingBraces'),
+			autocompleteMarkup: Setting.value('editor.autocompleteMarkup'),
 			useExternalSearch: false,
 			ignoreModifiers: true,
 			spellcheckEnabled: Setting.value('editor.spellcheckBeta'),

packages/app-mobile/components/NoteEditor/NoteEditor.tsx

@@ -345,6 +345,7 @@ function NoteEditor(props: Props, ref: any) {
 
 		automatchBraces: false,
 		ignoreModifiers: false,
+		autocompleteMarkup: Setting.value('editor.autocompleteMarkup'),
 
 		indentWithTabs: true,
 	}), [props.themeId, props.readOnly]);

packages/editor/CodeMirror/configFromSettings.ts

@@ -28,11 +28,21 @@ const configFromSettings = (settings: EditorSettings) => {
 						settings.katexEnabled ? MarkdownMathExtension : [],
 					],
 					codeLanguages: lookUpLanguage,
+
+					...(settings.autocompleteMarkup ? {
+						// Most Markup completion is enabled by default
+					} : {
+						addKeymap: false,
+						completeHTMLTags: false,
+						htmlTagLanguage: html({ matchClosingTags: false, autoCloseTags: false }),
+					}),
+				}),
+				markdownLanguage.data.of({
+					closeBrackets: openingBrackets,
 				}),
-				markdownLanguage.data.of({ closeBrackets: openingBrackets }),
 			];
 		} else if (language === EditorLanguageType.Html) {
-			return html();
+			return html({ autoCloseTags: settings.autocompleteMarkup });
 		} else {
 			const exhaustivenessCheck: never = language;
 			return exhaustivenessCheck;

packages/editor/CodeMirror/createEditor.ts

@@ -7,7 +7,7 @@ import { classHighlighter } from '@lezer/highlight';
 import {
 	EditorView, drawSelection, highlightSpecialChars, ViewUpdate, Command, rectangularSelection,
 } from '@codemirror/view';
-import { history, undoDepth, redoDepth, standardKeymap } from '@codemirror/commands';
+import { history, undoDepth, redoDepth, standardKeymap, insertTab } from '@codemirror/commands';
 
 import { keymap, KeyBinding } from '@codemirror/view';
 import { searchKeymap } from '@codemirror/search';
@@ -186,7 +186,13 @@ const createEditor = (
 			notifyLinkEditRequest();
 			return true;
 		}),
-		keyCommand('Tab', insertOrIncreaseIndent, true),
+		keyCommand('Tab', (view: EditorView) => {
+			if (settings.autocompleteMarkup) {
+				return insertOrIncreaseIndent(view);
+			}
+			// Use the default indent behavior (which doesn't adjust markup)
+			return insertTab(view);
+		}, true),
 		keyCommand('Shift-Tab', (view) => {
 			// When at the beginning of the editor, allow shift-tab to act
 			// normally.

packages/editor/CodeMirror/testUtil/createEditorSettings.ts

@@ -10,6 +10,7 @@ const createEditorSettings = (themeId: number) => {
 		readOnly: false,
 		automatchBraces: false,
 		ignoreModifiers: false,
+		autocompleteMarkup: true,
 
 		keymap: EditorKeymap.Default,
 		language: EditorLanguageType.Markdown,

packages/editor/types.ts

@@ -152,6 +152,7 @@ export interface EditorSettings {
 	useExternalSearch: boolean;
 
 	automatchBraces: boolean;
+	autocompleteMarkup: boolean;
 
 	// True if internal command keyboard shortcuts should be ignored (thus
 	// allowing Joplin shortcuts to run).

packages/lib/models/settings/builtInMetadata.ts

@@ -641,6 +641,18 @@ const builtInMetadata = (Setting: typeof SettingType) => {
 			storage: SettingStorage.File,
 			isGlobal: true,
 		},
+		'editor.autocompleteMarkup': {
+			value: true,
+			advanced: true,
+			type: SettingItemType.Bool,
+			public: true,
+			section: 'note',
+			appTypes: [AppType.Desktop, AppType.Mobile],
+			label: () => _('Autocomplete Markdown and HTML'),
+			description: () => _('Enables Markdown list continuation, auto-closing HTML tags, and other markup autocompletions.'),
+			storage: SettingStorage.File,
+			isGlobal: true,
+		},
 		'notes.columns': {
 			value: defaultListColumns(),
 			public: false,