Support different types of buttons and make Button default to Contained

Author: ShreckYe

compose-multiplatform-material/src/commonMain/kotlin/com/huanshankeji/compose/material/Button.kt

@@ -11,9 +11,14 @@ expect /*value*/ class ButtonScope {
 
 expect abstract class ButtonElement : Element
 
+enum class ButtonType {
+    Contained, Outlined, Text
+}
+
 @Composable
 expect fun Button(
     onClick: () -> Unit,
+    buttonType: ButtonType = ButtonType.Contained,
     modifierOrAttrs: ModifierOrAttrs<ButtonElement> = null,
     content: @Composable ButtonScope.() -> Unit
 )

compose-multiplatform-material/src/jsMain/kotlin/com/huanshankeji/compose/material/Button.kt

@@ -1,13 +1,15 @@
 package com.huanshankeji.compose.material
 
 import androidx.compose.runtime.Composable
+import com.huanshankeji.compose.material.ButtonType.*
 import com.huanshankeji.compose.ui.ModifierOrAttrs
 import com.huanshankeji.compose.ui.toAttrs
 import com.huanshankeji.compose.web.attributes.attrs
 import com.huanshankeji.compose.web.attributes.plus
 import dev.petuska.kmdc.button.Label
 import dev.petuska.kmdc.button.MDCButton
 import dev.petuska.kmdc.button.MDCButtonScope
+import dev.petuska.kmdc.button.MDCButtonType
 import org.w3c.dom.HTMLButtonElement
 
 actual class ButtonScope(val mdcButtonScope: MDCButtonScope<HTMLButtonElement>) {
@@ -18,13 +20,24 @@ actual class ButtonScope(val mdcButtonScope: MDCButtonScope<HTMLButtonElement>)
 
 actual typealias ButtonElement = HTMLButtonElement
 
+fun ButtonType.toMDCButtonType() =
+    when (this) {
+        Contained -> MDCButtonType.Raised
+        Outlined -> MDCButtonType.Outlined
+        Text -> MDCButtonType.Text
+    }
+
 @Composable
 actual fun Button(
-    onClick: () -> Unit, modifierOrAttrs: ModifierOrAttrs<ButtonElement>, content: @Composable ButtonScope.() -> Unit
+    onClick: () -> Unit,
+    buttonType: ButtonType,
+    modifierOrAttrs: ModifierOrAttrs<ButtonElement>,
+    content: @Composable ButtonScope.() -> Unit
 ) =
-    MDCButton(attrs = attrs<ButtonElement> {
-        onClick { onClick() }
-    } + modifierOrAttrs.toAttrs()) {
+    MDCButton(buttonType.toMDCButtonType(),
+        attrs = attrs<ButtonElement> {
+            onClick { onClick() }
+        } + modifierOrAttrs.toAttrs()) {
         ButtonScope(this).content()
     }
 

compose-multiplatform-material/src/jvmMain/kotlin/com/huanshankeji/compose/material/Button.kt

@@ -1,7 +1,10 @@
 package com.huanshankeji.compose.material
 
 import androidx.compose.foundation.layout.RowScope
+import androidx.compose.material.OutlinedButton
+import androidx.compose.material.TextButton
 import androidx.compose.runtime.Composable
+import com.huanshankeji.compose.material.ButtonType.*
 import com.huanshankeji.compose.ui.Element
 import com.huanshankeji.compose.ui.ModifierOrAttrs
 import com.huanshankeji.compose.ui.toModifier
@@ -17,7 +20,15 @@ actual abstract class ButtonElement : Element()
 @Composable
 actual fun Button(
     onClick: () -> Unit,
+    buttonType: ButtonType,
     modifierOrAttrs: ModifierOrAttrs<ButtonElement>,
     content: @Composable ButtonScope.() -> Unit
-) =
-    androidx.compose.material.Button(onClick, modifierOrAttrs.toModifier()) { ButtonScope(this).content() }
+) {
+    val modifier = modifierOrAttrs.toModifier()
+    val androidxContent: @Composable RowScope.() -> Unit = { ButtonScope(this).content() }
+    when (buttonType) {
+        Contained -> androidx.compose.material.Button(onClick, content = androidxContent)
+        Outlined -> OutlinedButton(onClick, content = androidxContent)
+        Text -> TextButton(onClick, content = androidxContent)
+    }
+}