@@ -69,6 +69,25 @@ function getDiagnostics(
6969 return diagnostics . filter ( ( d ) => d . severity === 1 ) . slice ( 0 , 3 )
7070}
7171
72+ const isRtlText = ( text : string ) => {
73+ const rtlChars = / [ \u0590 - \u05FF \u0600 - \u06FF ] /
74+ let rtlCount = 0
75+ let totalCount = 0
76+
77+ for ( const char of text ) {
78+ if ( char . trim ( ) !== "" ) {
79+ totalCount ++
80+ if ( rtlChars . test ( char ) ) {
81+ rtlCount ++
82+ }
83+ }
84+ }
85+
86+ if ( totalCount < 3 ) return false
87+
88+ return rtlCount / totalCount > 0.5
89+ }
90+
7291function DiagnosticsDisplay ( props : { diagnostics : Diagnostic [ ] } ) : JSX . Element {
7392 const i18n = useI18n ( )
7493 return (
@@ -653,6 +672,10 @@ export function UserMessageDisplay(props: { message: UserMessage; parts: PartTyp
653672 )
654673
655674 const text = createMemo ( ( ) => textPart ( ) ?. text || "" )
675+ const [ isRTL , setIsRTL ] = createSignal ( false )
676+ createEffect ( ( ) => {
677+ setIsRTL ( isRtlText ( text ( ) ) )
678+ } )
656679
657680 const files = createMemo ( ( ) => ( props . parts ?. filter ( ( p ) => p . type === "file" ) as FilePart [ ] ) ?? [ ] )
658681
@@ -750,7 +773,7 @@ export function UserMessageDisplay(props: { message: UserMessage; parts: PartTyp
750773 < Show when = { text ( ) } >
751774 < >
752775 < div data-slot = "user-message-body" >
753- < div data-slot = "user-message-text" >
776+ < div data-slot = "user-message-text" dir = { isRTL ( ) ? "rtl" : "ltr" } classList = { { "text-right" : isRTL ( ) } } >
754777 < HighlightedText text = { text ( ) } references = { inlineFiles ( ) } agents = { agents ( ) } />
755778 </ div >
756779 </ div >
@@ -1082,6 +1105,10 @@ PART_MAPPING["text"] = function TextPartDisplay(props) {
10821105 } )
10831106
10841107 const displayText = ( ) => relativizeProjectPaths ( ( part . text ?? "" ) . trim ( ) , data . directory )
1108+ const [ isRTL , setIsRTL ] = createSignal ( false )
1109+ createEffect ( ( ) => {
1110+ setIsRTL ( isRtlText ( displayText ( ) ) )
1111+ } )
10851112 const throttledText = createThrottledValue ( displayText )
10861113 const isLastTextPart = createMemo ( ( ) => {
10871114 const last = ( data . store . part ?. [ props . message . id ] ?? [ ] )
@@ -1107,7 +1134,7 @@ PART_MAPPING["text"] = function TextPartDisplay(props) {
11071134
11081135 return (
11091136 < Show when = { throttledText ( ) } >
1110- < div data-component = "text-part" >
1137+ < div data-component = "text-part" dir = { isRTL ( ) ? "rtl" : "ltr" } classList = { { "text-right" : isRTL ( ) } } >
11111138 < div data-slot = "text-part-body" >
11121139 < Markdown text = { throttledText ( ) } cacheKey = { part . id } />
11131140 </ div >
0 commit comments