Merge pull request #133 from halilozercan/halilozercan/fix-rtl-lists

Fix #109
halilozercan · Feb 19, 2024 · bbc25a2 · bbc25a2
2 parents 358d370 + eeb73eb
commit bbc25a2
Show file tree

Hide file tree

Showing 2 changed files with 66 additions and 51 deletions.
diff --git a/android-sample/src/main/java/com/zachklipp/richtext/sample/MarkdownSample.kt b/android-sample/src/main/java/com/zachklipp/richtext/sample/MarkdownSample.kt
@@ -19,6 +19,7 @@ import androidx.compose.material3.Text
 import androidx.compose.material3.darkColorScheme
 import androidx.compose.material3.lightColorScheme
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -27,7 +28,9 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.LayoutDirection
 import androidx.compose.ui.unit.dp
 import com.halilibo.richtext.commonmark.CommonmarkAstNodeParser
 import com.halilibo.richtext.commonmark.MarkdownParseOptions
@@ -48,6 +51,7 @@ import com.halilibo.richtext.ui.resolveDefaults
   var isWordWrapEnabled by remember { mutableStateOf(true) }
   var markdownParseOptions by remember { mutableStateOf(MarkdownParseOptions.Default) }
   var isAutolinkEnabled by remember { mutableStateOf(true) }
+  var isRtl by remember { mutableStateOf(false) }
 
   LaunchedEffect(isWordWrapEnabled) {
     richTextStyle = richTextStyle.copy(
@@ -65,61 +69,72 @@ import com.halilibo.richtext.ui.resolveDefaults
   val colors = if (isDarkModeEnabled) darkColorScheme() else lightColorScheme()
   val context = LocalContext.current
 
-  SampleTheme(colorScheme = colors) {
-    Surface {
-      Column {
-        // Config
-        Card(elevation = CardDefaults.elevatedCardElevation()) {
-          Column {
-            FlowRow {
-              CheckboxPreference(
-                onClick = {
-                  isDarkModeEnabled = !isDarkModeEnabled
-                },
-                checked = isDarkModeEnabled,
-                label = "Dark Mode"
-              )
-              CheckboxPreference(
-                onClick = {
-                  isWordWrapEnabled = !isWordWrapEnabled
-                },
-                checked = isWordWrapEnabled,
-                label = "Word Wrap"
-              )
-              CheckboxPreference(
-                onClick = {
-                  isAutolinkEnabled = !isAutolinkEnabled
-                },
-                checked = isAutolinkEnabled,
-                label = "Autolink"
+  CompositionLocalProvider(
+    LocalLayoutDirection provides if (isRtl) LayoutDirection.Rtl else LayoutDirection.Ltr
+  ) {
+    SampleTheme(colorScheme = colors) {
+      Surface {
+        Column {
+          // Config
+          Card(elevation = CardDefaults.elevatedCardElevation()) {
+            Column {
+              FlowRow {
+                CheckboxPreference(
+                  onClick = {
+                    isDarkModeEnabled = !isDarkModeEnabled
+                  },
+                  checked = isDarkModeEnabled,
+                  label = "Dark Mode"
+                )
+                CheckboxPreference(
+                  onClick = {
+                    isWordWrapEnabled = !isWordWrapEnabled
+                  },
+                  checked = isWordWrapEnabled,
+                  label = "Word Wrap"
+                )
+                CheckboxPreference(
+                  onClick = {
+                    isAutolinkEnabled = !isAutolinkEnabled
+                  },
+                  checked = isAutolinkEnabled,
+                  label = "Autolink"
+                )
+                CheckboxPreference(
+                  onClick = {
+                    isRtl = !isRtl
+                  },
+                  checked = isRtl,
+                  label = "RTL Layout"
+                )
+              }
+
+              RichTextStyleConfig(
+                richTextStyle = richTextStyle,
+                onChanged = { richTextStyle = it }
               )
             }
-
-            RichTextStyleConfig(
-              richTextStyle = richTextStyle,
-              onChanged = { richTextStyle = it }
-            )
           }
-        }
 
-        SelectionContainer {
-          Column(Modifier.verticalScroll(rememberScrollState())) {
-            val parser = remember(markdownParseOptions) {
-              CommonmarkAstNodeParser(markdownParseOptions)
-            }
+          SelectionContainer {
+            Column(Modifier.verticalScroll(rememberScrollState())) {
+              val parser = remember(markdownParseOptions) {
+                CommonmarkAstNodeParser(markdownParseOptions)
+              }
 
-            val astNode = remember(parser) {
-              parser.parse(sampleMarkdown)
-            }
+              val astNode = remember(parser) {
+                parser.parse(sampleMarkdown)
+              }
 
-            RichText(
-              style = richTextStyle,
-              linkClickHandler = {
-                Toast.makeText(context, it, Toast.LENGTH_SHORT).show()
-              },
-              modifier = Modifier.padding(8.dp),
-            ) {
-              BasicMarkdown(astNode)
+              RichText(
+                style = richTextStyle,
+                linkClickHandler = {
+                  Toast.makeText(context, it, Toast.LENGTH_SHORT).show()
+                },
+                modifier = Modifier.padding(8.dp),
+              ) {
+                BasicMarkdown(astNode)
+              }
             }
           }
         }

diff --git a/richtext-ui/src/commonMain/kotlin/com/halilibo/richtext/ui/FormattedList.kt b/richtext-ui/src/commonMain/kotlin/com/halilibo/richtext/ui/FormattedList.kt
@@ -293,8 +293,8 @@ private val LocalListLevel = compositionLocalOf { 0 }
           layoutDirection = layoutDirection
         )
 
-        prefix.place(prefixOffset.x, y + prefixOffset.y)
-        item.place(widestPrefix.width, y)
+        prefix.placeRelative(prefixOffset.x, y + prefixOffset.y)
+        item.placeRelative(widestPrefix.width, y)
         y += rowHeight
       }
     }