Update modified official files to use latest compose changes

android/build.gradle.kts

@@ -21,7 +21,11 @@ android {
 }
 
 dependencies {
+    implementation(project(":compose-native-theme"))
+
+    // These are redundant, because native-theme depends on them
     implementation(project(":compose-macos-theme"))
+    implementation(project(":compose-windows-theme"))
 
     implementation("androidx.appcompat:appcompat:1.3.0-beta01")
     // See https://stackoverflow.com/a/66146595/4672107

android/src/main/java/io/chozzle/composemacostheme/MainActivity.kt

@@ -4,7 +4,6 @@ import android.os.Bundle
 import androidx.activity.compose.setContent
 import androidx.appcompat.app.AppCompatActivity
 
-
 class MainActivity : AppCompatActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)

compose-macos-theme/src/commonMain/kotlin/io/chozzle/composemacostheme/modifiedofficial/Button.kt

@@ -30,7 +30,8 @@ import androidx.compose.ui.semantics.Role
 import androidx.compose.ui.unit.dp
 
 // Copied from compose source to work around https://issuetracker.google.com/issues/179543603
-// Can be removed when this issue is fixed
+// Basically just want to remove the ripple effect
+@OptIn(ExperimentalMaterialApi::class)
 @Composable
 fun Button(
     onClick: () -> Unit,
@@ -44,24 +45,19 @@ fun Button(
     contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
     content: @Composable RowScope.() -> Unit
 ) {
-    // TODO(aelias): Avoid manually putting the clickable above the clip and
-    // the ripple below the clip once http://b/157687898 is fixed and we have
-    // more flexibility to move the clickable modifier (see candidate approach
-    // aosp/1361921)
     val contentColor by colors.contentColor(enabled)
     Surface(
+        modifier = modifier,
         shape = shape,
         color = colors.backgroundColor(enabled).value,
         contentColor = contentColor.copy(alpha = 1f),
         border = border,
         elevation = elevation?.elevation(enabled, interactionSource)?.value ?: 0.dp,
-        modifier = modifier.clickable(
-            onClick = onClick,
-            enabled = enabled,
-            role = Role.Button,
-            interactionSource = interactionSource,
-            indication = null
-        )
+        onClick = onClick,
+        enabled = enabled,
+        role = Role.Button,
+        interactionSource = interactionSource,
+        indication = LocalIndication.current
     ) {
         CompositionLocalProvider(LocalContentAlpha provides contentColor.alpha) {
             ProvideTextStyle(
@@ -73,7 +69,6 @@ fun Button(
                             minWidth = ButtonDefaults.MinWidth,
                             minHeight = ButtonDefaults.MinHeight
                         )
-                        .indication(interactionSource, LocalIndication.current)
                         .padding(contentPadding),
                     horizontalArrangement = Arrangement.Center,
                     verticalAlignment = Alignment.CenterVertically,

compose-macos-theme/src/commonMain/kotlin/io/chozzle/composemacostheme/modifiedofficial/MacOutlinedTextField.kt

@@ -90,39 +90,31 @@ import kotlin.math.roundToInt
  * container
  * @param trailingIcon the optional trailing icon to be displayed at the end of the text field
  * container
- * @param isErrorValue indicates if the text field's current value is in error. If set to true, the
- * label, bottom indicator and trailing icon will be displayed in [errorColor] color
- * @param visualTransformation transforms the visual representation of the input [value].
+ * @param isError indicates if the text field's current value is in error. If set to true, the
+ * label, bottom indicator and trailing icon by default will be displayed in error color
+ * @param visualTransformation transforms the visual representation of the input [value]
  * For example, you can use [androidx.compose.ui.text.input.PasswordVisualTransformation] to create a password
  * text field. By default no visual transformation is applied
  * @param keyboardOptions software keyboard options that contains configuration such as
- * [KeyboardType] and [ImeAction].
+ * [KeyboardType] and [ImeAction]
  * @param keyboardActions when the input service emits an IME action, the corresponding callback
  * is called. Note that this IME action may be different from what you specified in
- * [KeyboardOptions.imeAction].
+ * [KeyboardOptions.imeAction]
  * @param singleLine when set to true, this text field becomes a single horizontally scrolling
  * text field instead of wrapping onto multiple lines. The keyboard will be informed to not show
  * the return key as the [ImeAction]. Note that [maxLines] parameter will be ignored as the
- * maxLines attribute will be automatically set to 1.
+ * maxLines attribute will be automatically set to 1
  * @param maxLines the maximum height in terms of maximum number of visible lines. Should be
  * equal or greater than 1. Note that this parameter will be ignored and instead maxLines will be
- * set to 1 if [singleLine] is set to true.
- * [KeyboardOptions.imeAction] field. The callback also exposes a [SoftwareKeyboardController]
- * instance as a parameter that can be used to request to hide the software keyboard
- * @param onTextInputStarted a callback to be invoked when the connection with the platform's text
- * input service (e.g. software keyboard on Android) has been established. Called with the
- * [SoftwareKeyboardController] instance that can be used to request to show or hide the software
- * keyboard
- * @param interactionState the [InteractionState] representing the different [Interaction]s
- * present on this OutlinedTextField. You can create and pass in your own remembered
- * [InteractionState] if you want to read the [InteractionState] and customize the appearance /
- * behavior of this OutlinedTextField in different [Interaction]s.
- * @param activeColor the color of the label, bottom indicator and the cursor when the text field is
- * in focus
- * @param inactiveColor the color of either the input text or placeholder when the text field is in
- * focus, and the color of the label and bottom indicator when the text field is not in focus
- * @param errorColor the alternative color of the label, bottom indicator, cursor and trailing icon
- * used when [isErrorValue] is set to true
+ * set to 1 if [singleLine] is set to true
+ * [KeyboardOptions.imeAction] field.
+ * @param interactionSource the [MutableInteractionSource] representing the stream of
+ * [Interaction]s for this OutlinedTextField. You can create and pass in your own remembered
+ * [MutableInteractionSource] if you want to observe [Interaction]s and customize the
+ * appearance / behavior of this OutlinedTextField in different [Interaction]s.
+ * @param colors [TextFieldColors] that will be used to resolve color of the text and content
+ * (including label, placeholder, leading and trailing icons, border) for this text field in
+ * different states. See [TextFieldDefaults.outlinedTextFieldColors]
  */
 @Composable
 fun MacOutlinedTextField(
@@ -182,6 +174,14 @@ fun MacOutlinedTextField(
  * Mac themed modification of a Material Design implementation of an
  * [Outlined TextField](https://material.io/components/text-fields/#outlined-text-field)
  *
+ * <a href="https://material.io/components/text-fields#outlined-text-field" class="external" target="_blank">Material Design outlined text field</a>.
+ *
+ * Outlined text fields have less visual emphasis than filled text fields. When they appear in
+ * places like forms, where many text fields are placed together, their reduced emphasis helps
+ * simplify the layout.
+ *
+ * ![Outlined text field image](https://developer.android.com/images/reference/androidx/compose/material/outlined-text-field.png)
+ *
  * See example usage:
  * @sample androidx.compose.material.samples.OutlinedTextFieldSample
  *
@@ -403,7 +403,10 @@ private fun IconsWithTextFieldLayout(
                 placeholder(Modifier.layoutId(PlaceholderId).padding(horizontal = TextFieldPadding))
             }
 
-            Box(Modifier.layoutId(TextFieldId).padding(horizontal = TextFieldPadding)) {
+            Box(
+                modifier = Modifier.layoutId(TextFieldId).padding(horizontal = TextFieldPadding),
+                propagateMinConstraints = true
+            ) {
                 textField()
             }
 

compose-macos-theme/src/commonMain/kotlin/io/chozzle/composemacostheme/modifiedofficial/MacTextFieldDefaults.kt

@@ -4,9 +4,8 @@ import androidx.compose.animation.animateColorAsState
 import androidx.compose.animation.core.FastOutLinearInEasing
 import androidx.compose.animation.core.keyframes
 import androidx.compose.animation.core.tween
-import androidx.compose.foundation.interaction.FocusInteraction
-import androidx.compose.foundation.interaction.Interaction
 import androidx.compose.foundation.interaction.InteractionSource
+import androidx.compose.foundation.interaction.collectIsFocusedAsState
 import androidx.compose.material.ContentAlpha
 import androidx.compose.material.LocalContentAlpha
 import androidx.compose.material.LocalContentColor
@@ -16,14 +15,11 @@ import androidx.compose.material.TextFieldColors
 import androidx.compose.material.TextFieldDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.Immutable
-import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.State
-import androidx.compose.runtime.mutableStateListOf
-import androidx.compose.runtime.remember
+import androidx.compose.runtime.getValue
 import androidx.compose.runtime.rememberUpdatedState
 import androidx.compose.ui.graphics.Color
 import io.chozzle.composemacostheme.MacTheme
-import kotlinx.coroutines.flow.collect
 
 
 object MacTextFieldDefaults {
@@ -140,25 +136,12 @@ private class DefaultTextFieldColors(
         isError: Boolean,
         interactionSource: InteractionSource
     ): State<Color> {
-        val interactions = remember { mutableStateListOf<Interaction>() }
-        LaunchedEffect(interactionSource) {
-            interactionSource.interactions.collect { interaction ->
-                when (interaction) {
-                    is FocusInteraction.Focus -> {
-                        interactions.add(interaction)
-                    }
-                    is FocusInteraction.Unfocus -> {
-                        interactions.remove(interaction.focus)
-                    }
-                }
-            }
-        }
-        val interaction = interactions.lastOrNull()
+        val focused by interactionSource.collectIsFocusedAsState()
 
         val targetValue = when {
             !enabled -> disabledIndicatorColor
             isError -> errorIndicatorColor
-            interaction is FocusInteraction.Focus -> focusedIndicatorColor
+            focused -> focusedIndicatorColor
             else -> unfocusedIndicatorColor
         }
         return if (enabled) {
@@ -194,25 +177,12 @@ private class DefaultTextFieldColors(
         error: Boolean,
         interactionSource: InteractionSource
     ): State<Color> {
-        val interactions = remember { mutableStateListOf<Interaction>() }
-        LaunchedEffect(interactionSource) {
-            interactionSource.interactions.collect { interaction ->
-                when (interaction) {
-                    is FocusInteraction.Focus -> {
-                        interactions.add(interaction)
-                    }
-                    is FocusInteraction.Unfocus -> {
-                        interactions.remove(interaction.focus)
-                    }
-                }
-            }
-        }
-        val interaction = interactions.lastOrNull()
+        val focused by interactionSource.collectIsFocusedAsState()
 
         val targetValue = when {
             !enabled -> disabledLabelColor
             error -> errorLabelColor
-            interaction is FocusInteraction.Focus -> focusedLabelColor
+            focused -> focusedLabelColor
             else -> unfocusedLabelColor
         }
         return if (enabled) {

compose-macos-theme/src/commonMain/kotlin/io/chozzle/composemacostheme/modifiedofficial/MacTextFieldImpl.kt

@@ -47,6 +47,7 @@ import androidx.compose.ui.layout.MeasureScope
 import androidx.compose.ui.layout.Placeable
 import androidx.compose.ui.platform.InspectorValueInfo
 import androidx.compose.ui.platform.debugInspectorInfo
+import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.input.TextFieldValue
 import androidx.compose.ui.text.input.VisualTransformation
@@ -106,8 +107,7 @@ internal fun TextFieldImpl(
     }
 
     TextFieldTransitionScope.Transition(
-        inputState = inputState,
-        showLabel = label != null,
+        inputState = inputState, showLabel = label != null
     ) { labelProgress, indicatorWidth, placeholderAlphaProgress ->
 
         val decoratedLabel: @Composable (() -> Unit)? =
@@ -139,10 +139,14 @@ internal fun TextFieldImpl(
                 }
             } else null
 
+        // Developers need to handle invalid input manually. But since we don't provide error
+        // message slot API, we can set the default error message in case developers forget about
+        // it.
+        val textFieldModifier = modifier.semantics { if (isError) error("Invalid input") }
         when (type) {
             TextFieldType.Filled -> {
                 TextFieldLayout(
-                    modifier = modifier,
+                    modifier = textFieldModifier,
                     value = value,
                     onValueChange = onValueChange,
                     enabled = enabled,
@@ -171,11 +175,7 @@ internal fun TextFieldImpl(
             }
             TextFieldType.Outlined -> {
                 OutlinedTextFieldLayout(
-                    modifier = modifier
-                        .sizeIn(
-                            minWidth = TextFieldMinWidth,
-                            minHeight = TextFieldMinHeight + OutlinedTextFieldTopPadding
-                        ),
+                    modifier = textFieldModifier,
                     value = value,
                     onValueChange = onValueChange,
                     enabled = enabled,
@@ -205,13 +205,6 @@ internal fun TextFieldImpl(
     }
 }
 
-/**
- * Set alpha if the color is not translucent
- */
-internal fun Color.applyAlpha(alpha: Float): Color {
-    return if (this.alpha != 1f) this else this.copy(alpha = alpha)
-}
-
 /**
  * Set content color, typography and emphasis for [content] composable
  */
@@ -249,6 +242,7 @@ internal fun heightOrZero(placeable: Placeable?) = placeable?.height ?: 0
  */
 internal fun Modifier.iconPadding(start: Dp = 0.dp, end: Dp = 0.dp) =
     this.then(
+        @Suppress("ModifierInspectorInfo")
         object : LayoutModifier, InspectorValueInfo(
             debugInspectorInfo {
                 name = "iconPadding"
@@ -389,9 +383,6 @@ internal val TextFieldVerticalPadding = 1.dp
 internal val TextFieldPadding = 3.dp
 internal val HorizontalIconPadding = 6.dp
 
-// Filled text field uses 42% opacity to meet the contrast requirements for accessibility reasons
-private const val IndicatorInactiveAlpha = 0.42f
-
 /*
 This padding is used to allow label not overlap with the content above it. This 8.dp will work
 for default cases when developers do not override the label's font size. If they do, they will

compose-macos-theme/src/commonMain/kotlin/io/chozzle/composemacostheme/modifiedofficial/TextField.kt

@@ -61,8 +61,12 @@ import kotlin.math.max
 import kotlin.math.roundToInt
 
 /**
- * Material Design implementation of a
- * [Filled TextField](https://material.io/components/text-fields/#filled-text-field)
+ * <a href="https://material.io/components/text-fields#filled-text-field" class="external" target="_blank">Material Design filled text field</a>.
+ *
+ * Filled text fields have more visual emphasis than outlined text fields, making them stand out
+ * when surrounded by other content and components.
+ *
+ * ![Filled text field image](https://developer.android.com/images/reference/androidx/compose/material/filled-text-field.png)
  *
  * If you are looking for an outlined version, see [OutlinedTextField].
  *
@@ -199,8 +203,12 @@ fun TextField(
 }
 
 /**
- * Material Design implementation of a
- * [Filled TextField](https://material.io/components/text-fields/#filled-text-field)
+ * <a href="https://material.io/components/text-fields#filled-text-field" class="external" target="_blank">Material Design filled text field</a>.
+ *
+ * Filled text fields have more visual emphasis than outlined text fields, making them stand out
+ * when surrounded by other content and components.
+ *
+ * ![Filled text field image](https://developer.android.com/images/reference/androidx/compose/material/filled-text-field.png)
  *
  * If you are looking for an outlined version, see [OutlinedTextField].
  *
@@ -332,6 +340,7 @@ internal fun TextFieldLayout(
     cursorColor: Color,
     shape: Shape
 ) {
+
     BasicTextField(
         value = value,
         modifier = modifier
@@ -417,7 +426,12 @@ private fun IconsWithTextFieldLayout(
                         )
                 ) { label() }
             }
-            Box(Modifier.layoutId(TextFieldId).then(padding)) { textField() }
+            Box(
+                modifier = Modifier.layoutId(TextFieldId).then(padding),
+                propagateMinConstraints = true,
+            ) {
+                textField()
+            }
         }
     ) { measurables, incomingConstraints ->
         val topBottomPadding = TextFieldPadding.roundToPx()
@@ -691,4 +705,4 @@ internal fun Modifier.drawIndicatorLine(lineWidth: Dp, color: Color): Modifier {
 
 private val FirstBaselineOffset = 20.dp
 private val LastBaselineOffset = 10.dp
-private val TextFieldTopPadding = 4.dp
+private val TextFieldTopPadding = 4.dp