Add opt-in RTL auto-detect for editor lines (#246116)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Author: mulhamfetna

src/vs/editor/common/config/editorOptions.ts

@@ -571,6 +571,11 @@ export interface IEditorOptions {
 	 * Defaults to true.
 	 */
 	doubleClickSelectsBlock?: boolean;
+	/**
+	 * Controls whether lines containing RTL text are rendered with RTL direction automatically.
+	 * Defaults to false.
+	 */
+	rtlAutoDetect?: boolean;
 	/**
 	 * Controls if the editor should allow to move selections via drag and drop.
 	 * Defaults to false.
@@ -5931,6 +5936,7 @@ export const enum EditorOption {
 	inertialScroll,
 	inlayHints,
 	wrapOnEscapedLineFeeds,
+	rtlAutoDetect,
 	// Leave these at the end (because they have dependencies!)
 	effectiveCursorStyle,
 	editorClassName,
@@ -6851,6 +6857,12 @@ export const EditorOptions = {
 	tabFocusMode: register(new EditorBooleanOption(EditorOption.tabFocusMode, 'tabFocusMode', false,
 		{ markdownDescription: nls.localize('tabFocusMode', "Controls whether the editor receives tabs or defers them to the workbench for navigation.") }
 	)),
+	rtlAutoDetect: register(new EditorBooleanOption(
+		EditorOption.rtlAutoDetect, 'rtlAutoDetect', false,
+		{
+			description: nls.localize('rtlAutoDetect', "Controls whether lines containing RTL text are rendered with RTL direction automatically.")
+		}
+	)),
 	layoutInfo: register(new EditorLayoutInfoComputer()),
 	wrappingInfo: register(new EditorWrappingInfoComputer()),
 	wrappingIndent: register(new WrappingIndentOption()),

src/vs/editor/common/standalone/standaloneEnums.ts

@@ -335,19 +335,20 @@ export enum EditorOption {
 	inertialScroll = 158,
 	inlayHints = 159,
 	wrapOnEscapedLineFeeds = 160,
-	effectiveCursorStyle = 161,
-	editorClassName = 162,
-	pixelRatio = 163,
-	tabFocusMode = 164,
-	layoutInfo = 165,
-	wrappingInfo = 166,
-	defaultColorDecorators = 167,
-	colorDecoratorsActivatedOn = 168,
-	inlineCompletionsAccessibilityVerbose = 169,
-	effectiveEditContext = 170,
-	scrollOnMiddleClick = 171,
-	effectiveAllowVariableFonts = 172,
-	doubleClickSelectsBlock = 173
+	rtlAutoDetect = 161,
+	effectiveCursorStyle = 162,
+	editorClassName = 163,
+	pixelRatio = 164,
+	tabFocusMode = 165,
+	layoutInfo = 166,
+	wrappingInfo = 167,
+	defaultColorDecorators = 168,
+	colorDecoratorsActivatedOn = 169,
+	inlineCompletionsAccessibilityVerbose = 170,
+	effectiveEditContext = 171,
+	scrollOnMiddleClick = 172,
+	effectiveAllowVariableFonts = 173,
+	doubleClickSelectsBlock = 174
 }
 
 /**

src/vs/editor/common/viewModel/viewModelImpl.ts

@@ -853,7 +853,7 @@ export class ViewModel extends Disposable implements IViewModel {
 		return this._lines.getInjectedTextAt(viewPosition);
 	}
 
-	private _getTextDirection(lineNumber: number, decorations: ViewModelDecoration[]): TextDirection {
+	private _getTextDirection(lineNumber: number, lineContent: string, decorations: ViewModelDecoration[]): TextDirection {
 		let rtlCount = 0;
 
 		for (const decoration of decorations) {
@@ -869,12 +869,22 @@ export class ViewModel extends Disposable implements IViewModel {
 			}
 		}
 
-		return rtlCount > 0 ? TextDirection.RTL : TextDirection.LTR;
+		if (rtlCount > 0) {
+			return TextDirection.RTL;
+		}
+		if (rtlCount < 0) {
+			return TextDirection.LTR;
+		}
+		if (this._configuration.options.get(EditorOption.rtlAutoDetect) && strings.containsRTL(lineContent)) {
+			return TextDirection.RTL;
+		}
+
+		return TextDirection.LTR;
 	}
 
 	public getTextDirection(lineNumber: number): TextDirection {
 		const decorationsCollection = this._decorations.getDecorationsOnLine(lineNumber);
-		return this._getTextDirection(lineNumber, decorationsCollection.decorations);
+		return this._getTextDirection(lineNumber, this.getLineContent(lineNumber), decorationsCollection.decorations);
 	}
 
 	public getViewportViewLineRenderingData(visibleRange: Range, lineNumber: number): ViewLineRenderingData {
@@ -914,7 +924,7 @@ export class ViewModel extends Disposable implements IViewModel {
 			inlineDecorations,
 			tabSize,
 			lineData.startVisibleColumn,
-			this._getTextDirection(lineNumber, decorations),
+			this._getTextDirection(lineNumber, lineData.content, decorations),
 			hasVariableFonts
 		);
 	}

src/vs/editor/test/browser/viewModel/viewModelImpl.test.ts

@@ -7,7 +7,7 @@ import assert from 'assert';
 import { ensureNoDisposablesAreLeakedInTestSuite } from '../../../../base/test/common/utils.js';
 import { Position } from '../../../common/core/position.js';
 import { Range } from '../../../common/core/range.js';
-import { EndOfLineSequence, PositionAffinity } from '../../../common/model.js';
+import { EndOfLineSequence, PositionAffinity, TextDirection } from '../../../common/model.js';
 import { ViewEventHandler } from '../../../common/viewEventHandler.js';
 import { ViewEvent } from '../../../common/viewEvents.js';
 import { testViewModel } from './testViewModel.js';
@@ -149,6 +149,38 @@ suite('ViewModel', () => {
 		});
 	});
 
+	test('rtlAutoDetect renders Arabic text as RTL when enabled', () => {
+		testViewModel(['مرحبا، Hello world!'], { rtlAutoDetect: true }, (viewModel) => {
+			assert.strictEqual(viewModel.getTextDirection(1), TextDirection.RTL);
+		});
+	});
+
+	test('rtlAutoDetect keeps Arabic text as LTR when disabled', () => {
+		testViewModel(['مرحبا، Hello world!'], { rtlAutoDetect: false }, (viewModel) => {
+			assert.strictEqual(viewModel.getTextDirection(1), TextDirection.LTR);
+		});
+	});
+
+	test('rtlAutoDetect still allows forcing LTR direction via decorations', () => {
+		testViewModel(['مرحبا، Hello world!'], { rtlAutoDetect: true }, (viewModel, model) => {
+			model.deltaDecorations([], [{
+				range: new Range(1, 1, 1, 1),
+				options: {
+					description: 'text-direction-ltr',
+					textDirection: TextDirection.LTR,
+				}
+			}]);
+
+			assert.strictEqual(viewModel.getTextDirection(1), TextDirection.LTR);
+		});
+	});
+
+	test('rtlAutoDetect renders ASCII-only lines as LTR', () => {
+		testViewModel(['Hello world!'], { rtlAutoDetect: true }, (viewModel) => {
+			assert.strictEqual(viewModel.getTextDirection(1), TextDirection.LTR);
+		});
+	});
+
 	function assertGetPlainTextToCopy(text: string[], ranges: Range[], emptySelectionClipboard: boolean, expected: string | string[]): void {
 		testViewModel(text, {}, (viewModel, model) => {
 			const actual = viewModel.getPlainTextToCopy(ranges, emptySelectionClipboard, false);

src/vs/monaco.d.ts

@@ -3726,6 +3726,11 @@ declare namespace monaco.editor {
 		 * Defaults to true.
 		 */
 		doubleClickSelectsBlock?: boolean;
+		/**
+		 * Controls whether lines containing RTL text are rendered with RTL direction automatically.
+		 * Defaults to false.
+		 */
+		rtlAutoDetect?: boolean;
 		/**
 		 * Controls if the editor should allow to move selections via drag and drop.
 		 * Defaults to false.
@@ -5245,19 +5250,20 @@ declare namespace monaco.editor {
 		inertialScroll = 158,
 		inlayHints = 159,
 		wrapOnEscapedLineFeeds = 160,
-		effectiveCursorStyle = 161,
-		editorClassName = 162,
-		pixelRatio = 163,
-		tabFocusMode = 164,
-		layoutInfo = 165,
-		wrappingInfo = 166,
-		defaultColorDecorators = 167,
-		colorDecoratorsActivatedOn = 168,
-		inlineCompletionsAccessibilityVerbose = 169,
-		effectiveEditContext = 170,
-		scrollOnMiddleClick = 171,
-		effectiveAllowVariableFonts = 172,
-		doubleClickSelectsBlock = 173
+		rtlAutoDetect = 161,
+		effectiveCursorStyle = 162,
+		editorClassName = 163,
+		pixelRatio = 164,
+		tabFocusMode = 165,
+		layoutInfo = 166,
+		wrappingInfo = 167,
+		defaultColorDecorators = 168,
+		colorDecoratorsActivatedOn = 169,
+		inlineCompletionsAccessibilityVerbose = 170,
+		effectiveEditContext = 171,
+		scrollOnMiddleClick = 172,
+		effectiveAllowVariableFonts = 173,
+		doubleClickSelectsBlock = 174
 	}
 
 	export const EditorOptions: {
@@ -5429,6 +5435,7 @@ declare namespace monaco.editor {
 		defaultColorDecorators: IEditorOption<EditorOption.defaultColorDecorators, 'auto' | 'always' | 'never'>;
 		pixelRatio: IEditorOption<EditorOption.pixelRatio, number>;
 		tabFocusMode: IEditorOption<EditorOption.tabFocusMode, boolean>;
+		rtlAutoDetect: IEditorOption<EditorOption.rtlAutoDetect, boolean>;
 		layoutInfo: IEditorOption<EditorOption.layoutInfo, EditorLayoutInfo>;
 		wrappingInfo: IEditorOption<EditorOption.wrappingInfo, EditorWrappingInfo>;
 		wrappingIndent: IEditorOption<EditorOption.wrappingIndent, WrappingIndent>;