Partially fix Badge

Author: ShreckYe

demo/src/commonMain/kotlin/com/huanshankeji/compose/material/demo/Material3.kt

@@ -306,12 +306,9 @@ fun Material3(/*modifier: Modifier = Modifier*/
 
         // Badge
         Row {
-            Badge {
-                TaglessText("3")
-            }
-            Badge {
-                TaglessText("New")
-            }
+            // not shown at the right position
+            Badge(content = "3")
+            Badge(content = "New")
         }
 
         // Chips - showing all 4 types as per M3 design

material3/src/commonMain/kotlin/com/huanshankeji/compose/material3/Badge.kt

@@ -11,8 +11,13 @@ import com.huanshankeji.compose.ui.Modifier
  * @see <a href="https://m3.material.io/components/badge/overview">Material Design badge</a>
  * @see androidx.compose.material3.Badge
  */
+@Deprecated(
+    "This component is not displayed correctly on JS DOM. " +
+            "It seems to be displayed with absolute position. " +
+            "See https://github.com/material-components/material-web/blob/main/labs/badge/internal/_badge.scss#L40."
+)
 @Composable
 expect fun Badge(
     modifier: Modifier = Modifier,
-    content: @Composable (() -> Unit)? = null
+    content: String
 )

material3/src/composeUiMain/kotlin/com/huanshankeji/compose/material3/Badge.composeUi.kt

@@ -1,14 +1,14 @@
 package com.huanshankeji.compose.material3
 
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import com.huanshankeji.compose.ui.Modifier
 
 @Composable
 actual fun Badge(
     modifier: Modifier,
-    content: @Composable (() -> Unit)?
+    content: String
 ) =
     androidx.compose.material3.Badge(
-        modifier.platformModifier,
-        content = content?.let { { it() } }
-    )
+        modifier.platformModifier
+    ) { Text(content) }

material3/src/jsMain/kotlin/com/huanshankeji/compose/material3/Badge.js.kt

@@ -1,18 +1,18 @@
 package com.huanshankeji.compose.material3
 
 import androidx.compose.runtime.Composable
-import com.huanshankeji.compose.html.material3.MdBadge
 import com.huanshankeji.compose.html.material3.MaterialWebLabsApi
+import com.huanshankeji.compose.html.material3.MdBadge
 import com.huanshankeji.compose.ui.Modifier
 import com.huanshankeji.compose.ui.toAttrs
 
 @MaterialWebLabsApi
 @Composable
 actual fun Badge(
     modifier: Modifier,
-    content: @Composable (() -> Unit)?
+    content: String
 ) =
     MdBadge(
-        attrs = modifier.toAttrs(),
-        content = content?.let { { it() } }
+        content,
+        modifier.toAttrs()
     )