Skip to content

Commit f114571

Browse files
committed
Fix the dialog APIs and sort out some composable conversion functions
- Add the `open` parameter. - Move to the `ext` package. - Move `toNullableTextComposable` and remove `toContentWithoutModifier` in TextField.composeUi.kt. Also add KDocs for the text components BTW. A corresponding commit: huanshankeji/compose-html-material@dd1e0984c2c0a5d2aef6a1a295e05a7e8d99623dnjh
1 parent f8edee7 commit f114571

File tree

12 files changed

+202
-144
lines changed

12 files changed

+202
-144
lines changed

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

Lines changed: 25 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -399,26 +399,33 @@ fun Material3(/*modifier: Modifier = Modifier*/
399399
}
400400

401401
// Dialog
402-
var showDialog by remember { mutableStateOf(false) }
403-
Button(onClick = { showDialog = true }) {
402+
var isAlertDialogOpen by remember { mutableStateOf(false) }
403+
Button(onClick = { isAlertDialogOpen = true }) {
404+
Text("Show Alert Dialog")
405+
}
406+
AlertDialog(
407+
isAlertDialogOpen,
408+
{ isAlertDialogOpen = false },
409+
{
410+
Button(onClick = { isAlertDialogOpen = false }) {
411+
Text("OK")
412+
}
413+
},
414+
dismissButton = {
415+
Button(onClick = { isAlertDialogOpen = false }) {
416+
Text("Cancel")
417+
}
418+
},
419+
icon = { Icon(Icons.Default.Add, null, it) },
420+
title = { Text("Alert Dialog", it) },
421+
text = { Text("This is a demo alert dialog with headline, content, and action buttons.", it) }
422+
)
423+
var isSimpleDialogOpen by remember { mutableStateOf(false) }
424+
Button(onClick = { isSimpleDialogOpen = true }) {
404425
Text("Show Dialog")
405426
}
406-
if (showDialog) {
407-
AlertDialog(
408-
onDismissRequest = { showDialog = false },
409-
confirmButton = {
410-
Button(onClick = { showDialog = false }) {
411-
Text("OK")
412-
}
413-
},
414-
dismissButton = {
415-
Button(onClick = { showDialog = false }) {
416-
Text("Cancel")
417-
}
418-
},
419-
title = { Text("Alert Dialog") },
420-
text = { Text("This is a demo alert dialog with headline, content, and action buttons.") }
421-
)
427+
SimpleDialog(isSimpleDialogOpen, { isSimpleDialogOpen = false }) {
428+
TaglessText("Dialog")
422429
}
423430

424431
// Tabs

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

Lines changed: 0 additions & 21 deletions
This file was deleted.

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

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
package com.huanshankeji.compose.material3
22

33
import androidx.compose.runtime.Composable
4+
import com.huanshankeji.compose.material3.ext.MaterialText
45
import com.huanshankeji.compose.material3.ext.TaglessText
56
import com.huanshankeji.compose.ui.Modifier
67
import com.huanshankeji.compose.ui.graphics.Color
@@ -11,7 +12,8 @@ import com.huanshankeji.compose.ui.graphics.Color
1112
* such as `androidx.compose.material3.Text` and `org.jetbrains.compose.web.dom.Text`
1213
* if not careful.
1314
* [TaglessText] is recommended over this one when there is no custom [modifier].
14-
* @see com.huanshankeji.compose.material3.ext.MaterialText
15+
* @see TaglessText
16+
* @see MaterialText
1517
*/
1618
@Composable
1719
expect fun Text(text: String, modifier: Modifier = Modifier, color: Color? = null)
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
package com.huanshankeji.compose.material3.ext
2+
3+
import androidx.compose.runtime.Composable
4+
import com.huanshankeji.compose.ui.Modifier
5+
6+
/**
7+
* Material Design dialog.
8+
*
9+
* @see <a href="https://m3.material.io/components/dialogs/overview">Material Design dialogs</a>
10+
* @see androidx.compose.material3.AlertDialog
11+
*/
12+
@Composable
13+
expect fun AlertDialog(
14+
isOpen: Boolean, // `open` from the web component, but named `isOpen` to follow Kotlin conventions
15+
onDismissRequest: () -> Unit,
16+
confirmButton: @Composable () -> Unit,
17+
modifier: Modifier = Modifier,
18+
dismissButton: @Composable (() -> Unit)? = null,
19+
icon: @Composable ((Modifier) -> Unit)? = null,
20+
title: @Composable ((Modifier) -> Unit)? = null,
21+
text: @Composable ((Modifier) -> Unit)? = null,
22+
)
23+
24+
/**
25+
* A simple dialog without the conventional components such as title, text, and buttons, showing just a [Card] overlay.
26+
* The corresponding Compose UI `Dialog` component is actually not in the `material3` package but in `androidx.compose.ui.window`.
27+
* Currently not completely visually consistent on both kinds of platforms. On Compose UI, it doesn't have a min width; while on JS DOM, it does.
28+
*/
29+
@Composable
30+
expect fun SimpleDialog(
31+
isOpen: Boolean, // `open` from the web component, but named `isOpen` to follow Kotlin conventions
32+
onDismissRequest: () -> Unit,
33+
modifier: Modifier = Modifier,
34+
content: @Composable () -> Unit,
35+
)

material3/src/commonMain/kotlin/com/huanshankeji/compose/material3/ext/Text.kt

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ fun InlineText(text: String) =
2121
/**
2222
* Delegates to raw text without any element on JS / Compose HTML.
2323
* @see com.huanshankeji.compose.foundation.text.ext.TaglessBasicText
24+
* @see Text
2425
*/
2526
@Composable
2627
expect fun TaglessText(text: String)

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

Lines changed: 0 additions & 24 deletions
This file was deleted.

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

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@ import com.huanshankeji.compose.ui.Modifier
55
import com.huanshankeji.compose.ui.graphics.Color
66
import com.huanshankeji.compose.ui.graphics.toPlatformValue
77

8+
/**
9+
* @see com.huanshankeji.compose.material3.ext.TaglessText
10+
*/
811
@Composable
912
actual fun Text(text: String, modifier: Modifier, color: Color?) =
1013
androidx.compose.material3.Text(text, modifier.platformModifier, color.toPlatformValue())
Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
package com.huanshankeji.compose.material3.ext
2+
3+
import androidx.compose.foundation.layout.Box
4+
import androidx.compose.foundation.layout.padding
5+
import androidx.compose.foundation.layout.sizeIn
6+
import androidx.compose.material3.AlertDialog
7+
import androidx.compose.material3.Card
8+
import androidx.compose.runtime.Composable
9+
import androidx.compose.ui.unit.dp
10+
import androidx.compose.ui.window.Dialog
11+
import com.huanshankeji.compose.ext.toNullableContentWithoutModifier
12+
import com.huanshankeji.compose.ui.Modifier
13+
import com.huanshankeji.compose.ui.PlatformModifier
14+
15+
/*
16+
https://developer.android.com/develop/ui/compose/components/dialog
17+
https://kotlinlang.org/api/compose-multiplatform/material3/androidx.compose.material3/-alert-dialog.html
18+
*/
19+
20+
@Composable
21+
actual fun AlertDialog(
22+
isOpen: Boolean,
23+
onDismissRequest: () -> Unit,
24+
confirmButton: @Composable () -> Unit,
25+
modifier: Modifier,
26+
dismissButton: @Composable (() -> Unit)?,
27+
icon: @Composable ((Modifier) -> Unit)?,
28+
title: @Composable ((Modifier) -> Unit)?,
29+
text: @Composable ((Modifier) -> Unit)?,
30+
) {
31+
if (isOpen)
32+
AlertDialog(
33+
onDismissRequest,
34+
confirmButton,
35+
modifier.platformModifier,
36+
dismissButton,
37+
icon.toNullableContentWithoutModifier(),
38+
title.toNullableContentWithoutModifier(),
39+
text.toNullableContentWithoutModifier()
40+
)
41+
}
42+
43+
@Composable
44+
actual fun SimpleDialog(
45+
isOpen: Boolean,
46+
onDismissRequest: () -> Unit,
47+
modifier: Modifier,
48+
content: @Composable () -> Unit,
49+
) {
50+
if (isOpen)
51+
// There is another overload that pops up a dialog with a new window: `fun Dialog(onCloseRequest: () -> Unit, state: DialogState = ..., visible: Boolean = ..., title: String = ..., icon: Painter? = ..., undecorated: Boolean = ..., transparent: Boolean = ..., resizable: Boolean = ..., enabled: Boolean = ..., focusable: Boolean = ..., onPreviewKeyEvent: (KeyEvent) -> Boolean = ..., onKeyEvent: (KeyEvent) -> Boolean = ..., content: ComposableFunction1<DialogWindowScope, Unit>): Unit`
52+
Dialog(onDismissRequest = onDismissRequest) {
53+
// https://github.com/androidx/androidx/blob/7b7fd0452b07808a084aee6c3246d7fda11d5604/compose/material3/material3/src/commonMain/kotlin/androidx/compose/material3/AlertDialog.kt#L410
54+
Card(modifier.platformModifier.sizeIn(minWidth = 280.dp)) {
55+
Box(PlatformModifier.padding(16.dp)) { content() }
56+
}
57+
}
58+
}
Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,14 @@
11
package com.huanshankeji.compose.material3.ext
22

3+
import androidx.compose.material3.Text
34
import androidx.compose.runtime.Composable
4-
import com.huanshankeji.compose.material3.Text
55

6+
/**
7+
* @see com.huanshankeji.compose.material3.Text
8+
*/
69
@Composable
710
actual fun TaglessText(text: String) =
811
Text(text)
12+
13+
fun String?.toNullableTextComposable(): @Composable (() -> Unit)? =
14+
this?.let { { Text(it) } }

material3/src/composeUiMain/kotlin/com/huanshankeji/compose/material3/ext/TextField.composeUi.kt

Lines changed: 15 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,11 @@
11
package com.huanshankeji.compose.material3.ext
22

3-
import androidx.compose.material3.Text
43
import androidx.compose.runtime.Composable
54
import com.huanshankeji.compose.foundation.text.KeyboardActions
65
import com.huanshankeji.compose.foundation.text.KeyboardOptions
76
import com.huanshankeji.compose.foundation.text.toPlatformValue
87
import com.huanshankeji.compose.ui.Modifier
9-
10-
// This function can be moved into a common file.
11-
fun String?.ToNullableTextComposable(): @Composable (() -> Unit)? =
12-
this?.let { { Text(it) } }
13-
14-
private fun (@Composable ((Modifier) -> Unit)?).toContentWithoutModifier(): @Composable (() -> Unit)? =
15-
this?.let { { it(Modifier) } }
16-
8+
import com.huanshankeji.compose.ext.toNullableContentWithoutModifier
179

1810
@Composable
1911
actual fun TextField(
@@ -41,13 +33,13 @@ actual fun TextField(
4133
modifier.platformModifier,
4234
enabled,
4335
readOnly,
44-
label = label.ToNullableTextComposable(),
45-
placeholder = placeholder.ToNullableTextComposable(),
46-
leadingIcon = leadingIcon.toContentWithoutModifier(),
47-
trailingIcon = trailingIcon.toContentWithoutModifier(),
48-
prefix = prefix.ToNullableTextComposable(),
49-
suffix = suffix.ToNullableTextComposable(),
50-
supportingText = supportingText.ToNullableTextComposable(),
36+
label = label.toNullableTextComposable(),
37+
placeholder = placeholder.toNullableTextComposable(),
38+
leadingIcon = leadingIcon.toNullableContentWithoutModifier(),
39+
trailingIcon = trailingIcon.toNullableContentWithoutModifier(),
40+
prefix = prefix.toNullableTextComposable(),
41+
suffix = suffix.toNullableTextComposable(),
42+
supportingText = supportingText.toNullableTextComposable(),
5143
isError = isError,
5244
keyboardOptions = keyboardOptions.toPlatformValue(),
5345
keyboardActions = keyboardActions.toPlatformValue(),
@@ -83,13 +75,13 @@ actual fun OutlinedTextField(
8375
modifier.platformModifier,
8476
enabled,
8577
readOnly,
86-
label = label.ToNullableTextComposable(),
87-
placeholder = placeholder.ToNullableTextComposable(),
88-
leadingIcon = leadingIcon.toContentWithoutModifier(),
89-
trailingIcon = trailingIcon.toContentWithoutModifier(),
90-
prefix = prefix.ToNullableTextComposable(),
91-
suffix = suffix.ToNullableTextComposable(),
92-
supportingText = supportingText.ToNullableTextComposable(),
78+
label = label.toNullableTextComposable(),
79+
placeholder = placeholder.toNullableTextComposable(),
80+
leadingIcon = leadingIcon.toNullableContentWithoutModifier(),
81+
trailingIcon = trailingIcon.toNullableContentWithoutModifier(),
82+
prefix = prefix.toNullableTextComposable(),
83+
suffix = suffix.toNullableTextComposable(),
84+
supportingText = supportingText.toNullableTextComposable(),
9385
isError = isError,
9486
keyboardOptions = keyboardOptions.toPlatformValue(),
9587
keyboardActions = keyboardActions.toPlatformValue(),

0 commit comments

Comments
 (0)