Merge branch 'main' into dependabot/gradle/androidx.recyclerview-recy…

…clerview-1.4.0

app/src/main/java/org/wikipedia/compose/components/WikiButtons.kt

@@ -0,0 +1,179 @@
+package org.wikipedia.compose.components
+
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Button
+import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import org.wikipedia.compose.ComposeColors
+import org.wikipedia.compose.theme.BaseTheme
+import org.wikipedia.compose.theme.WikipediaTheme
+
+@Composable
+fun AppButton(
+    onClick: () -> Unit,
+    modifier: Modifier = Modifier,
+    backgroundColor: Color = WikipediaTheme.colors.progressiveColor,
+    contentColor: Color = WikipediaTheme.colors.paperColor,
+    content: @Composable (() -> Unit)
+) {
+    Button(
+        onClick = onClick,
+        modifier = modifier,
+        colors = ButtonDefaults.buttonColors(
+            containerColor = backgroundColor,
+            contentColor = contentColor,
+        ),
+        contentPadding = ButtonDefaults.ContentPadding
+    ) {
+        content()
+    }
+}
+
+@Composable
+fun AppTextButton(
+    onClick: () -> Unit,
+    modifier: Modifier = Modifier,
+    contentColor: Color = WikipediaTheme.colors.progressiveColor,
+    content: @Composable (() -> Unit)
+) {
+    Button(
+        onClick = onClick,
+        modifier = modifier,
+        colors = ButtonDefaults.buttonColors(
+            containerColor = Color.Transparent,
+            contentColor = contentColor
+        ),
+        elevation = ButtonDefaults.elevatedButtonElevation(0.dp)
+    ) {
+        content()
+    }
+}
+
+@Composable
+fun OutlineButton(
+    onClick: () -> Unit,
+    modifier: Modifier = Modifier,
+    backgroundColor: Color = WikipediaTheme.colors.paperColor,
+    contentColor: Color = WikipediaTheme.colors.progressiveColor,
+    borderColor: Color = WikipediaTheme.colors.borderColor,
+    cornerRadius: Int = 8,
+    strokeWidth: Int = 1,
+    content: @Composable (() -> Unit)
+) {
+    Button(
+        onClick = onClick,
+        modifier = modifier.border(
+            width = strokeWidth.dp,
+            color = borderColor,
+            shape = RoundedCornerShape(cornerRadius.dp)
+        ),
+        colors = ButtonDefaults.buttonColors(
+            containerColor = backgroundColor,
+            contentColor = contentColor
+        )
+    ) {
+        content()
+    }
+}
+
+@Composable
+fun SmallOutlineButton(
+    onClick: () -> Unit,
+    modifier: Modifier = Modifier,
+    backgroundColor: Color = WikipediaTheme.colors.paperColor,
+    contentColor: Color = WikipediaTheme.colors.progressiveColor,
+    borderColor: Color = WikipediaTheme.colors.borderColor,
+    cornerRadius: Int = 16,
+    content: @Composable (() -> Unit)
+) {
+    Button(
+        onClick = onClick,
+        modifier = modifier.border(
+            width = 1.dp,
+            color = borderColor,
+            shape = RoundedCornerShape(cornerRadius.dp)
+        ),
+        colors = ButtonDefaults.buttonColors(
+            containerColor = backgroundColor,
+            contentColor = contentColor
+        ),
+        contentPadding = PaddingValues(horizontal = 16.dp)
+    ) {
+        content()
+    }
+}
+
+@Composable
+fun ThemeColorCircularButton(
+    onClick: () -> Unit,
+    text: String = "Aa",
+    modifier: Modifier = Modifier,
+    size: Dp = 40.dp,
+    defaultBackgroundColor: Color = WikipediaTheme.colors.paperColor,
+    selectedBackgroundColor: Color = WikipediaTheme.colors.backgroundColor,
+    borderColor: Color = WikipediaTheme.colors.progressiveColor,
+    textColor: Color = WikipediaTheme.colors.primaryColor,
+    rippleColor: Color = Color.Transparent,
+    isSelected: Boolean = false
+) {
+    Button(
+        onClick = onClick,
+        modifier = modifier
+            .border(
+                width = 2.dp,
+                color = if (isSelected) borderColor else Color.Transparent,
+                shape = CircleShape
+            )
+            .size(size),
+        colors = ButtonDefaults.buttonColors(
+            containerColor = if (isSelected) defaultBackgroundColor else selectedBackgroundColor,
+            contentColor = rippleColor
+        ),
+        contentPadding = PaddingValues(0.dp)
+    ) {
+        Text(
+            text = text,
+            style = WikipediaTheme.typography.h3.copy(
+                color = textColor,
+                letterSpacing = 0.sp
+            )
+        )
+    }
+}
+
+@Preview(showSystemUi = true)
+@Composable
+private fun SepiaThemeColorButton() {
+    BaseTheme {
+        Column(
+            modifier = Modifier
+                .fillMaxSize(),
+            verticalArrangement = Arrangement.spacedBy(12.dp, Alignment.CenterVertically),
+            horizontalAlignment = Alignment.CenterHorizontally
+        ) {
+            ThemeColorCircularButton(
+                isSelected = true,
+                defaultBackgroundColor = ComposeColors.Beige300,
+                selectedBackgroundColor = ComposeColors.Beige300,
+                rippleColor = ComposeColors.Beige300,
+                textColor = ComposeColors.Gray700,
+                onClick = {}
+            )
+        }
+    }
+}

app/src/main/java/org/wikipedia/compose/components/WikiSnackbar.kt

@@ -0,0 +1,51 @@
+package org.wikipedia.compose.components
+
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.Snackbar
+import androidx.compose.material3.Text
+import androidx.compose.material3.TextButton
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import org.wikipedia.compose.theme.WikipediaTheme
+
+@Composable
+fun Snackbar(
+    message: String,
+    modifier: Modifier = Modifier,
+    actionLabel: String? = null,
+    onActionClick: (() -> Unit)? = null,
+) {
+    Snackbar(
+        action = {
+            if (actionLabel != null && onActionClick != null) {
+                TextButton(
+                    onClick = onActionClick,
+                    modifier = Modifier.padding(end = 8.dp)
+                ) {
+                    Text(
+                        text = actionLabel,
+                        style = WikipediaTheme.typography.h3.copy(
+                            color = WikipediaTheme.colors.progressiveColor
+                        )
+                    )
+                }
+            }
+        },
+        modifier = modifier.padding(16.dp)
+    ) {
+        Text(
+            text = message,
+            style = WikipediaTheme.typography.h3.copy(
+                color = WikipediaTheme.colors.primaryColor,
+                letterSpacing = 0.sp
+            ),
+            maxLines = 10,
+            overflow = TextOverflow.Ellipsis,
+            modifier = Modifier
+                .padding(top = 0.dp, bottom = 0.dp, start = 0.dp, end = 8.dp)
+        )
+    }
+}

app/src/main/java/org/wikipedia/compose/components/WikiTopAppBar.kt

@@ -0,0 +1,54 @@
+package org.wikipedia.compose.components
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.automirrored.filled.ArrowBack
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
+import androidx.compose.material3.TopAppBarDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.shadow
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import org.wikipedia.compose.theme.WikipediaTheme
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun WikiTopAppBar(
+    title: String,
+    onNavigationClick: (() -> Unit),
+    titleStyle: TextStyle = WikipediaTheme.typography.h1.copy(lineHeight = 24.sp),
+    elevation: Dp = 0.dp,
+    modifier: Modifier = Modifier
+) {
+    val navigationIcon = Icons.AutoMirrored.Filled.ArrowBack
+    val backgroundColor = WikipediaTheme.colors.paperColor
+
+    TopAppBar(
+        title = {
+            Text(
+                text = title,
+                style = titleStyle,
+                color = WikipediaTheme.colors.primaryColor
+            )
+        },
+        navigationIcon = {
+            IconButton(onClick = onNavigationClick) {
+                Icon(
+                    imageVector = navigationIcon,
+                    contentDescription = null
+                )
+            }
+        },
+        colors = TopAppBarDefaults.topAppBarColors(
+            containerColor = backgroundColor,
+            titleContentColor = WikipediaTheme.colors.primaryColor
+        ),
+        modifier = modifier.shadow(elevation = elevation)
+    )
+}

app/src/main/java/org/wikipedia/compose/theme/WikipediaTheme.kt

@@ -22,7 +22,8 @@ fun BaseTheme(
     }
 
     CompositionLocalProvider(
-        LocalWikipediaColor provides wikipediaColorSystem
+        LocalWikipediaColor provides wikipediaColorSystem,
+        LocalWikipediaTypography provides Typography
     ) {
         content()
     }
@@ -32,4 +33,8 @@ object WikipediaTheme {
     val colors: WikipediaColor
         @Composable
         get() = LocalWikipediaColor.current
+
+    val typography: WikipediaTypography
+        @Composable
+        get() = LocalWikipediaTypography.current
 }

app/src/main/java/org/wikipedia/compose/theme/WikipediaTypography.kt

@@ -0,0 +1,90 @@
+package org.wikipedia.compose.theme
+
+import androidx.compose.runtime.Immutable
+import androidx.compose.runtime.staticCompositionLocalOf
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.FontFamily
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.sp
+
+@Immutable
+data class WikipediaTypography(
+    val h1: TextStyle = TextStyle(),
+    val h2: TextStyle = TextStyle(),
+    val h3: TextStyle = TextStyle(),
+    val h4: TextStyle = TextStyle(),
+    val h5: TextStyle = TextStyle(),
+    val p: TextStyle = TextStyle(),
+    val button: TextStyle = TextStyle(),
+    val article: TextStyle = TextStyle(),
+    val list: TextStyle = TextStyle(),
+    val chip: TextStyle = TextStyle(),
+    val small: TextStyle = TextStyle()
+)
+
+val LocalWikipediaTypography = staticCompositionLocalOf {
+    WikipediaTypography()
+}
+
+val Typography = WikipediaTypography(
+    h1 = TextStyle(
+        fontFamily = FontFamily.SansSerif,
+        fontWeight = FontWeight.Bold,
+        fontSize = 24.sp,
+        lineHeight = 32.sp
+    ),
+    h2 = TextStyle(
+        fontFamily = FontFamily.SansSerif,
+        fontWeight = FontWeight.Bold,
+        fontSize = 20.sp,
+        lineHeight = 28.sp
+    ),
+    h3 = TextStyle(
+        fontFamily = FontFamily.SansSerif,
+        fontWeight = FontWeight.Bold,
+        fontSize = 16.sp,
+        lineHeight = 24.sp
+    ),
+    h4 = TextStyle(
+        fontFamily = FontFamily.SansSerif,
+        fontWeight = FontWeight.Bold,
+        fontSize = 14.sp,
+        lineHeight = 24.sp
+    ),
+    h5 = TextStyle(
+        fontFamily = FontFamily.SansSerif,
+        fontWeight = FontWeight.Bold,
+        fontSize = 12.sp,
+        lineHeight = 18.sp
+    ),
+    button = TextStyle(
+        fontFamily = FontFamily.SansSerif,
+        fontWeight = FontWeight.Medium,
+        fontSize = 16.sp,
+        lineHeight = 24.sp
+    ),
+    article = TextStyle(
+        fontFamily = FontFamily.Serif,
+        fontWeight = FontWeight.Normal,
+        fontSize = 16.sp,
+        lineHeight = 24.sp
+    ),
+    list = TextStyle(
+        fontFamily = FontFamily.SansSerif,
+        fontWeight = FontWeight.Normal,
+        fontSize = 14.sp,
+        lineHeight = 24.sp
+    ),
+    chip = TextStyle(
+        fontFamily = FontFamily.SansSerif,
+        fontWeight = FontWeight.Medium,
+        fontSize = 14.sp,
+        lineHeight = 24.sp
+    ),
+    small = TextStyle(
+        fontFamily = FontFamily.SansSerif,
+        fontWeight = FontWeight.Medium,
+        fontSize = 12.sp,
+        lineHeight = 18.sp
+    )
+)