Update to Compose 1.6 (BC break in Text)

catalog/src/main/java/kiwi/orbit/compose/catalog/screens/MainScreen.kt

@@ -13,9 +13,12 @@ import androidx.compose.foundation.lazy.grid.GridItemSpan
 import androidx.compose.foundation.lazy.grid.LazyGridScope
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
 import androidx.compose.foundation.lazy.grid.items
+import androidx.compose.material.icons.automirrored.rounded.Announcement
+import androidx.compose.material.icons.automirrored.rounded.Article
+import androidx.compose.material.icons.automirrored.rounded.LabelImportant
+import androidx.compose.material.icons.automirrored.rounded.ListAlt
+import androidx.compose.material.icons.automirrored.rounded.MenuOpen
 import androidx.compose.material.icons.outlined.ToggleOff
-import androidx.compose.material.icons.rounded.Announcement
-import androidx.compose.material.icons.rounded.Article
 import androidx.compose.material.icons.rounded.Ballot
 import androidx.compose.material.icons.rounded.BrightnessMedium
 import androidx.compose.material.icons.rounded.CheckBox
@@ -25,10 +28,7 @@ import androidx.compose.material.icons.rounded.DragHandle
 import androidx.compose.material.icons.rounded.EditAttributes
 import androidx.compose.material.icons.rounded.FormatSize
 import androidx.compose.material.icons.rounded.Keyboard
-import androidx.compose.material.icons.rounded.LabelImportant
 import androidx.compose.material.icons.rounded.LinearScale
-import androidx.compose.material.icons.rounded.ListAlt
-import androidx.compose.material.icons.rounded.MenuOpen
 import androidx.compose.material.icons.rounded.Palette
 import androidx.compose.material.icons.rounded.Rectangle
 import androidx.compose.material.icons.rounded.SignalWifiOff
@@ -66,6 +66,7 @@ import kiwi.orbit.compose.ui.controls.TopAppBarLarge
 import kiwi.orbit.compose.ui.foundation.ProvideMergedTextStyle
 import kiwi.orbit.compose.ui.utils.plus
 import kotlinx.serialization.ExperimentalSerializationApi
+import androidx.compose.material.icons.Icons.AutoMirrored.Rounded as AMMIcons
 import androidx.compose.material.icons.Icons.Outlined as OMIcons
 import androidx.compose.material.icons.Icons.Rounded as MIcons
 import kiwi.orbit.compose.catalog.semantics.MainScreenSemantics as Semantics
@@ -121,18 +122,18 @@ internal fun MainScreen(
         MenuItem("Segmented Switch", MIcons.ToggleOn, Semantics.SegmentedSwitchItemTag) {
             Destinations.SegmentedSwitch
         },
-        MenuItem("Select Field", MIcons.MenuOpen, Semantics.SelectFieldItemTag) { Destinations.SelectField },
+        MenuItem("Select Field", AMMIcons.MenuOpen, Semantics.SelectFieldItemTag) { Destinations.SelectField },
         MenuItem("Slider", MIcons.LinearScale, Semantics.SliderItemTag) { Destinations.Slider },
         MenuItem("Stepper", Icons.PlusCircle, Semantics.StepperItemTag) { Destinations.Stepper },
-        MenuItem("SurfaceCard", MIcons.Article, Semantics.SurfaceCardItemTag) { Destinations.SurfaceCard },
+        MenuItem("SurfaceCard", AMMIcons.Article, Semantics.SurfaceCardItemTag) { Destinations.SurfaceCard },
         MenuItem("Switch", MIcons.ToggleOn, Semantics.SwitchItemTag) { Destinations.Switch },
         MenuItem("Tabs", MIcons.Tab, Semantics.TabsItemTag) { Destinations.Tabs },
-        MenuItem("Tag", MIcons.LabelImportant, Semantics.TagItemTag) { Destinations.Tag },
+        MenuItem("Tag", AMMIcons.LabelImportant, Semantics.TagItemTag) { Destinations.Tag },
         MenuItem("Text Field", MIcons.Keyboard, Semantics.TextFieldItemTag) { Destinations.TextField },
         MenuItem("Tile", MIcons.Crop169, Semantics.TileItemTag) { Destinations.Tile },
-        MenuItem("TileGroup", MIcons.ListAlt, Semantics.TileGroupItemTag) { Destinations.TileGroup },
+        MenuItem("TileGroup", AMMIcons.ListAlt, Semantics.TileGroupItemTag) { Destinations.TileGroup },
         MenuItem("Timeline", Icons.RouteTwoStops, Semantics.TimelineItemTag) { Destinations.Timeline },
-        MenuItem("Toast", MIcons.Announcement, Semantics.ToastItemTag) { Destinations.Toast },
+        MenuItem("Toast", AMMIcons.Announcement, Semantics.ToastItemTag) { Destinations.Toast },
         MenuItem("TopAppBar", MIcons.WebAsset, Semantics.TopAppBarItemTag) { Destinations.TopAppBar },
     )
 

gradle/libs.versions.toml

@@ -44,13 +44,13 @@ accompanist-systemController = "com.google.accompanist:accompanist-systemuicontr
 coil = { module = "io.coil-kt:coil-compose", version = "2.4.0" }
 compose-animation = { module = "androidx.compose.animation:animation" }
 compose-animationGraphics = { module = "androidx.compose.animation:animation-graphics" }
-compose-bom = "dev.chrisbanes.compose:compose-bom:2023.04.00-beta02"
+compose-bom = "dev.chrisbanes.compose:compose-bom:2023.12.00-alpha03"
 # compiler dependency is defined to help Renovabot update the version
 compose-compiler = { module = "androidx.compose.compiler:compiler", version.ref = "compose-compiler" }
 compose-foundation = { module = "androidx.compose.foundation:foundation" }
 compose-layout = { module = "androidx.compose.foundation:foundation-layout" }
 compose-material = { module = "androidx.compose.material:material" }
-compose-material3 = "androidx.compose.material3:material3:1.1.2"
+compose-material3 = "androidx.compose.material3:material3:1.2.0-alpha12"
 compose-materialRipple = { module = "androidx.compose.material:material-ripple" }
 compose-materialIconsExtended = { module = "androidx.compose.material:material-icons-extended" }
 compose-navigation = { module = "androidx.navigation:navigation-compose", version = "2.7.5" }

lint/src/main/kotlin/kiwi/orbit/compose/lint/detectors/MaterialDesignInsteadOrbitDesignDetector.kt

@@ -120,6 +120,7 @@ class MaterialDesignInsteadOrbitDesignDetector : Detector(), Detector.UastScanne
             "kiwi.orbit.compose.ui.controls.Separator" to setOf(
                 "androidx.compose.material.Divider",
                 "androidx.compose.material3.Divider",
+                "androidx.compose.material3.HorizontalDivider",
             ),
             "kiwi.orbit.compose.ui.controls.IconButton" to setOf(
                 "androidx.compose.material.IconButton",

readme.md

@@ -10,8 +10,8 @@
 [![CI Build](https://img.shields.io/github/actions/workflow/status/kiwicom/orbit-compose/build.yml?branch=main)](https://github.com/kiwicom/orbit-compose/actions/workflows/build.yml)
 [![GitHub release](https://img.shields.io/github/v/release/kiwicom/orbit-compose)](https://github.com/kiwicom/orbit-compose/releases)
 [![Maven release](https://img.shields.io/maven-metadata/v?metadataUrl=https%3A%2F%2Frepo1.maven.org%2Fmaven2%2Fkiwi%2Forbit%2Fcompose%2Fui%2Fmaven-metadata.xml)](https://search.maven.org/search?q=g:kiwi.orbit.compose)
-[![Compose 1.5](https://img.shields.io/badge/Compose-1.5-%232ec781)](https://developer.android.com/jetpack/androidx/releases/compose-kotlin)
-[![Material 3](https://img.shields.io/badge/Material-3-%230c57d0)](https://developer.android.com/jetpack/androidx/releases/compose-material3)
+[![Compose 1.6](https://img.shields.io/badge/Compose-1.6-00A991)](https://developer.android.com/jetpack/androidx/releases/compose-kotlin)
+[![Compose M3 1.2](https://img.shields.io/badge/Compose%20M3-1.2-00A991)](https://developer.android.com/jetpack/androidx/releases/compose-material3)
 
 </div>
 

ui/src/androidMain/kotlin/kiwi/orbit/compose/ui/controls/Collapse.kt

@@ -9,7 +9,6 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.Divider
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -106,7 +105,7 @@ public fun Collapse(
             }
         }
         if (withSeparator) {
-            Divider()
+            Separator()
         }
     }
 }

ui/src/androidMain/kotlin/kiwi/orbit/compose/ui/controls/LinearProgressIndicator.kt

@@ -48,7 +48,7 @@ public fun LinearProgressIndicator(
         label = "LinearProgressWidth",
     )
     androidx.compose.material3.LinearProgressIndicator(
-        progress = animatedProgress,
+        progress = { animatedProgress },
         modifier = modifier.fillMaxWidth(),
         color = color,
         trackColor = backgroundColor,

ui/src/androidMain/kotlin/kiwi/orbit/compose/ui/controls/PasswordStrengthIndicator.kt

@@ -2,7 +2,7 @@ package kiwi.orbit.compose.ui.controls
 
 import androidx.compose.animation.core.animateFloatAsState
 import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.BoxWithConstraints
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -42,7 +42,7 @@ public fun PasswordStrengthIndicator(
             LocalContentColor provides color,
             LocalTextStyle provides OrbitTheme.typography.bodySmallMedium,
         ) {
-            BoxWithConstraints(
+            Box(
                 modifier = Modifier.weight(1f),
                 contentAlignment = Alignment.CenterEnd,
             ) {

ui/src/androidMain/kotlin/kiwi/orbit/compose/ui/controls/Slider.kt

@@ -24,7 +24,8 @@ import androidx.compose.foundation.systemGestureExclusion
 import androidx.compose.material.ripple.rememberRipple
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.LocalMinimumInteractiveComponentEnforcement
-import androidx.compose.material3.SliderPositions
+import androidx.compose.material3.RangeSliderState
+import androidx.compose.material3.SliderState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.LaunchedEffect
@@ -41,8 +42,9 @@ import androidx.compose.ui.composed
 import androidx.compose.ui.geometry.Offset
 import androidx.compose.ui.geometry.Rect
 import androidx.compose.ui.geometry.lerp
-import androidx.compose.ui.graphics.PointMode
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.StrokeCap
+import androidx.compose.ui.graphics.drawscope.DrawScope
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.semantics.disabled
 import androidx.compose.ui.semantics.semantics
@@ -109,8 +111,8 @@ public fun Slider(
                     enabled = enabled,
                 )
             },
-            track = { sliderPositions ->
-                Track(enabled, sliderPositions)
+            track = { sliderState ->
+                Track(sliderState, enabled)
             },
         )
     }
@@ -166,8 +168,8 @@ public fun RangeSlider(
                     enabled = enabled,
                 )
             },
-            track = { sliderPositions ->
-                Track(enabled, sliderPositions)
+            track = { sliderState ->
+                Track(sliderState, enabled)
             },
             steps = steps,
         )
@@ -280,8 +282,65 @@ private fun Thumb(
     )
 }
 
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+private fun Track(
+    sliderState: SliderState,
+    enabled: Boolean,
+) {
+    Track(
+        steps = sliderState.steps,
+        activeRangeStart = {
+            calcFraction(
+                sliderState.valueRange.start,
+                sliderState.valueRange.endInclusive,
+                0f,
+            )
+        },
+        activeRangeEnd = {
+            calcFraction(
+                sliderState.valueRange.start,
+                sliderState.valueRange.endInclusive,
+                0f,
+            )
+        },
+        enabled = enabled,
+    )
+}
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+private fun Track(
+    rangeSliderState: RangeSliderState,
+    enabled: Boolean,
+) {
+    Track(
+        steps = rangeSliderState.steps,
+        activeRangeStart = {
+            calcFraction(
+                rangeSliderState.valueRange.start,
+                rangeSliderState.valueRange.endInclusive,
+                rangeSliderState.activeRangeStart,
+            )
+        },
+        activeRangeEnd = {
+            calcFraction(
+                rangeSliderState.valueRange.start,
+                rangeSliderState.valueRange.endInclusive,
+                rangeSliderState.activeRangeEnd,
+            )
+        },
+        enabled = enabled,
+    )
+}
+
 @Composable
-private fun Track(enabled: Boolean, sliderPositions: SliderPositions) {
+private fun Track(
+    steps: Int,
+    activeRangeStart: () -> Float,
+    activeRangeEnd: () -> Float,
+    enabled: Boolean,
+) {
     val activeTrackColor = when (enabled) {
         true -> OrbitTheme.colors.info.normal
         false -> OrbitTheme.colors.content.disabled.copy(alpha = 0.38f)
@@ -298,60 +357,80 @@ private fun Track(enabled: Boolean, sliderPositions: SliderPositions) {
         true -> contentColorFor(inactiveTrackColor).copy(alpha = 0.38f)
         false -> contentColorFor(OrbitTheme.colors.surface.strong).copy(alpha = 0.24f)
     }
+    val tickFractions = remember(steps) {
+        if (steps == 0) floatArrayOf() else FloatArray(steps + 2) { it.toFloat() / (steps + 1) }
+    }
     Canvas(
         Modifier
             .fillMaxWidth()
-            .height(TrackSize),
+            .height(TrackHeight),
     ) {
-        val isRtl = layoutDirection == LayoutDirection.Rtl
-        val sliderLeft = Offset(0f - 9.9.dp.roundToPx(), center.y)
-        val sliderRight = Offset(size.width + 9.9.dp.roundToPx(), center.y)
-        val sliderStart = if (isRtl) sliderRight else sliderLeft
-        val sliderEnd = if (isRtl) sliderLeft else sliderRight
-        val dotStart = if (isRtl) Offset(size.width, center.y) else Offset(0f, center.y)
-        val dotEnd = if (isRtl) Offset(0f, center.y) else Offset(size.width, center.y)
-        val tickSize = TickSize.toPx()
-        val trackStrokeWidth = TrackSize.toPx()
-        drawLine(
+        drawTrack(
+            tickFractions,
+            activeRangeStart(),
+            activeRangeEnd(),
             inactiveTrackColor,
-            sliderStart,
-            sliderEnd,
-            trackStrokeWidth,
-            StrokeCap.Round,
-        )
-        val sliderValueEnd = Offset(
-            sliderStart.x +
-                (sliderEnd.x - sliderStart.x) * sliderPositions.activeRange.endInclusive,
-            center.y,
+            activeTrackColor,
+            inactiveTickColor,
+            activeTickColor,
         )
+    }
+}
 
-        val sliderValueStart = Offset(
-            sliderStart.x +
-                (sliderEnd.x - sliderStart.x) * sliderPositions.activeRange.start,
-            center.y,
-        )
+private fun calcFraction(a: Float, b: Float, pos: Float) =
+    (if (b - a == 0f) 0f else (pos - a) / (b - a)).coerceIn(0f, 1f)
 
-        drawLine(
-            activeTrackColor,
-            sliderValueStart,
-            sliderValueEnd,
-            trackStrokeWidth,
-            StrokeCap.Round,
+private fun DrawScope.drawTrack(
+    tickFractions: FloatArray,
+    activeRangeStart: Float,
+    activeRangeEnd: Float,
+    inactiveTrackColor: Color,
+    activeTrackColor: Color,
+    inactiveTickColor: Color,
+    activeTickColor: Color,
+) {
+    val isRtl = layoutDirection == LayoutDirection.Rtl
+    val sliderLeft = Offset(0f - 9.9.dp.roundToPx(), center.y)
+    val sliderRight = Offset(size.width + 9.9.dp.roundToPx(), center.y)
+    val sliderStart = if (isRtl) sliderRight else sliderLeft
+    val sliderEnd = if (isRtl) sliderLeft else sliderRight
+    val dotStart = if (isRtl) Offset(size.width, center.y) else Offset(0f, center.y)
+    val dotEnd = if (isRtl) Offset(0f, center.y) else Offset(size.width, center.y)
+    val tickSize = TickSize.toPx()
+    val trackStrokeWidth = TrackHeight.toPx()
+    drawLine(
+        inactiveTrackColor,
+        sliderStart,
+        sliderEnd,
+        trackStrokeWidth,
+        StrokeCap.Round,
+    )
+    val sliderValueEnd = Offset(
+        sliderStart.x +
+            (sliderEnd.x - sliderStart.x) * activeRangeEnd,
+        center.y,
+    )
+
+    val sliderValueStart = Offset(
+        sliderStart.x +
+            (sliderEnd.x - sliderStart.x) * activeRangeStart,
+        center.y,
+    )
+
+    drawLine(
+        activeTrackColor,
+        sliderValueStart,
+        sliderValueEnd,
+        trackStrokeWidth,
+        StrokeCap.Round,
+    )
+    for (tick in tickFractions) {
+        val outsideFraction = tick > activeRangeEnd || tick < activeRangeStart
+        drawCircle(
+            color = if (outsideFraction) inactiveTickColor else activeTickColor,
+            center = Offset(lerp(dotStart, dotEnd, tick).x, center.y),
+            radius = tickSize / 2f,
         )
-        sliderPositions.tickFractions.groupBy {
-            it > sliderPositions.activeRange.endInclusive ||
-                it < sliderPositions.activeRange.start
-        }.forEach { (outsideFraction, list) ->
-            drawPoints(
-                list.map {
-                    Offset(lerp(dotStart, dotEnd, it).x, center.y)
-                },
-                PointMode.Points,
-                (if (outsideFraction) inactiveTickColor else activeTickColor),
-                tickSize,
-                StrokeCap.Round,
-            )
-        }
     }
 }
 
@@ -419,7 +498,7 @@ private fun Modifier.sliderSystemGestureExclusion(enabled: Boolean): Modifier {
     }
 }
 
-private val TrackSize = 4.dp
+private val TrackHeight = 4.dp
 private val TickSize = 2.dp
 
 @OrbitPreviews