diff --git a/compound/screenshots/Compound Icons - Rtl.png b/compound/screenshots/Compound Icons - Rtl.png new file mode 100644 index 0000000..c62c83b --- /dev/null +++ b/compound/screenshots/Compound Icons - Rtl.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:5cf83fa752042e5f94e82cd80781ab574c68d228d55ac6d1137d602532f9eb17 +size 165901 diff --git a/compound/src/main/kotlin/io/element/android/compound/previews/CompoundIconsPreview.kt b/compound/src/main/kotlin/io/element/android/compound/previews/CompoundIconsPreview.kt index 96e644a..5930df1 100644 --- a/compound/src/main/kotlin/io/element/android/compound/previews/CompoundIconsPreview.kt +++ b/compound/src/main/kotlin/io/element/android/compound/previews/CompoundIconsPreview.kt @@ -6,6 +6,7 @@ import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.ColumnScope import androidx.compose.foundation.layout.IntrinsicSize import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxHeight import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height @@ -17,13 +18,16 @@ import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable +import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.vector.ImageVector import androidx.compose.ui.platform.LocalContext +import androidx.compose.ui.platform.LocalLayoutDirection import androidx.compose.ui.res.vectorResource import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.LayoutDirection import androidx.compose.ui.unit.dp import io.element.android.compound.theme.ElementTheme import io.element.android.compound.tokens.generated.CompoundIcons @@ -34,6 +38,18 @@ internal fun IconsCompoundPreviewLight() = ElementTheme { IconsCompoundPreview() } +@Preview(widthDp = 730, heightDp = 1600) +@Composable +internal fun IconsCompoundPreviewRtl() = ElementTheme { + CompositionLocalProvider( + LocalLayoutDirection provides LayoutDirection.Rtl, + ) { + IconsCompoundPreview( + title = "Compound Icons Rtl", + ) + } +} + @Preview(widthDp = 730, heightDp = 1600) @Composable internal fun IconsCompoundPreviewDark() = ElementTheme(darkTheme = true) { @@ -41,7 +57,9 @@ internal fun IconsCompoundPreviewDark() = ElementTheme(darkTheme = true) { } @Composable -private fun IconsCompoundPreview() { +private fun IconsCompoundPreview( + title: String = "Compound Icons", +) { val context = LocalContext.current val content: Sequence<@Composable ColumnScope.() -> Unit> = sequence { for (icon in CompoundIcons.allResIds) { @@ -64,7 +82,7 @@ private fun IconsCompoundPreview() { } } IconsPreview( - title = "Compound Icons", + title = title, content = content.toList(), ) } @@ -92,9 +110,10 @@ internal fun IconsPreview( content.chunked(10).forEach { chunk -> Row( modifier = Modifier.height(IntrinsicSize.Max), - horizontalArrangement = Arrangement.spacedBy(6.dp), + // Keep same order of icons for an easier comparison of previews + horizontalArrangement = Arrangement.Absolute.Left, ) { - chunk.forEach { icon -> + chunk.forEachIndexed { index, icon -> Column( modifier = Modifier .background(MaterialTheme.colorScheme.background) @@ -105,6 +124,9 @@ internal fun IconsPreview( ) { icon() } + if (index < chunk.size - 1) { + Spacer(modifier = Modifier.width(6.dp)) + } } } } diff --git a/compound/src/main/res/drawable/ic_compound_arrow_left.xml b/compound/src/main/res/drawable/ic_compound_arrow_left.xml index 288f65c..30f33a7 100644 --- a/compound/src/main/res/drawable/ic_compound_arrow_left.xml +++ b/compound/src/main/res/drawable/ic_compound_arrow_left.xml @@ -1,6 +1,7 @@