Skip to content

Commit fdebfe1

Browse files
committed
Move the *SegmentedButtonRowScope.SegmentedButton functions to the ext package
1 parent 9c9bb55 commit fdebfe1

File tree

6 files changed

+186
-160
lines changed

6 files changed

+186
-160
lines changed

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

Lines changed: 2 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -52,44 +52,9 @@ class SegmentedButtonDefaultShapeArgs(val index: Int, val count: Int)
5252
/**
5353
* Scope for the content of a single-choice segmented button row.
5454
*/
55-
expect class SingleChoiceSegmentedButtonRowScope {
56-
57-
/**
58-
* Material Design segmented button.
59-
*
60-
* A segmented button represents a single option in a segmented button row.
61-
*
62-
* @param selected whether this segmented button is selected
63-
* @param onClick called when this segmented button is clicked
64-
* @param modifier the [Modifier] to be applied to this segmented button
65-
* @param enabled controls the enabled state of this segmented button
66-
* @param icon optional icon for this segmented button, typically an [Icon]
67-
* @param label the label content for this segmented button
68-
*/
69-
@Composable
70-
fun SegmentedButton(
71-
selected: Boolean,
72-
onClick: () -> Unit,
73-
defaultShapeArgs: SegmentedButtonDefaultShapeArgs,
74-
modifier: Modifier = Modifier,
75-
enabled: Boolean = true,
76-
icon: @Composable (() -> Unit)? = null,
77-
label: String //@Composable () -> Unit
78-
)
79-
}
55+
expect class SingleChoiceSegmentedButtonRowScope
8056

8157
/**
8258
* Scope for the content of a multi-choice segmented button row.
8359
*/
84-
expect class MultiChoiceSegmentedButtonRowScope {
85-
@Composable
86-
fun SegmentedButton(
87-
checked: Boolean,
88-
onCheckedChange: (Boolean) -> Unit,
89-
defaultShapeArgs: SegmentedButtonDefaultShapeArgs,
90-
modifier: Modifier = Modifier,
91-
enabled: Boolean = true,
92-
icon: @Composable (() -> Unit)? = null,
93-
label: String //@Composable () -> Unit
94-
)
95-
}
60+
expect class MultiChoiceSegmentedButtonRowScope
Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
package com.huanshankeji.compose.material3.ext
2+
3+
import androidx.compose.runtime.Composable
4+
import com.huanshankeji.compose.material3.Icon
5+
import com.huanshankeji.compose.material3.MultiChoiceSegmentedButtonRowScope
6+
import com.huanshankeji.compose.material3.SegmentedButtonDefaultShapeArgs
7+
import com.huanshankeji.compose.material3.SingleChoiceSegmentedButtonRowScope
8+
import com.huanshankeji.compose.ui.Modifier
9+
10+
/**
11+
* Material Design segmented button.
12+
*
13+
* A segmented button represents a single option in a segmented button row.
14+
*
15+
* @param selected whether this segmented button is selected
16+
* @param onClick called when this segmented button is clicked
17+
* @param modifier the [Modifier] to be applied to this segmented button
18+
* @param enabled controls the enabled state of this segmented button
19+
* @param icon optional icon for this segmented button, typically an [Icon]
20+
* @param label the label content for this segmented button
21+
*/
22+
@Composable
23+
expect fun SingleChoiceSegmentedButtonRowScope.SegmentedButton(
24+
selected: Boolean,
25+
onClick: () -> Unit,
26+
defaultShapeArgs: SegmentedButtonDefaultShapeArgs,
27+
modifier: Modifier = Modifier,
28+
enabled: Boolean = true,
29+
icon: @Composable (() -> Unit)? = null,
30+
label: String //@Composable () -> Unit
31+
)
32+
33+
// TODO add KDoc
34+
@Composable
35+
expect fun MultiChoiceSegmentedButtonRowScope.SegmentedButton(
36+
checked: Boolean,
37+
onCheckedChange: (Boolean) -> Unit,
38+
defaultShapeArgs: SegmentedButtonDefaultShapeArgs,
39+
modifier: Modifier = Modifier,
40+
enabled: Boolean = true,
41+
icon: @Composable (() -> Unit)? = null,
42+
label: String //@Composable () -> Unit
43+
)
44+
Lines changed: 2 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
package com.huanshankeji.compose.material3
22

3-
import androidx.compose.material3.SegmentedButton
43
import androidx.compose.material3.SegmentedButtonDefaults
5-
import androidx.compose.material3.Text
64
import androidx.compose.runtime.Composable
75
import androidx.compose.ui.unit.Dp
86
import com.huanshankeji.compose.ui.Modifier
@@ -31,54 +29,6 @@ actual fun MultiChoiceSegmentedButtonRow(
3129
MultiChoiceSegmentedButtonRowScope(this).content()
3230
}
3331

34-
actual class SingleChoiceSegmentedButtonRowScope(val platformScope: androidx.compose.material3.SingleChoiceSegmentedButtonRowScope) {
35-
@Composable
36-
actual fun SegmentedButton(
37-
selected: Boolean,
38-
onClick: () -> Unit,
39-
defaultShapeArgs: SegmentedButtonDefaultShapeArgs,
40-
modifier: Modifier,
41-
enabled: Boolean,
42-
icon: @Composable (() -> Unit)?,
43-
label: String //@Composable () -> Unit
44-
) =
45-
platformScope.SegmentedButton(
46-
selected,
47-
onClick,
48-
SegmentedButtonDefaults.itemShape(
49-
defaultShapeArgs.index,
50-
defaultShapeArgs.count
51-
),
52-
modifier.platformModifier,
53-
enabled,
54-
icon = icon ?: { SegmentedButtonDefaults.Icon(selected) },
55-
) {
56-
Text(label)
57-
}
58-
}
32+
actual class SingleChoiceSegmentedButtonRowScope(val platformScope: androidx.compose.material3.SingleChoiceSegmentedButtonRowScope)
5933

60-
actual class MultiChoiceSegmentedButtonRowScope(val platformScope: androidx.compose.material3.MultiChoiceSegmentedButtonRowScope) {
61-
@Composable
62-
actual fun SegmentedButton(
63-
checked: Boolean,
64-
onCheckedChange: (Boolean) -> Unit,
65-
defaultShapeArgs: SegmentedButtonDefaultShapeArgs,
66-
modifier: Modifier,
67-
enabled: Boolean,
68-
icon: @Composable (() -> Unit)?,
69-
label: String //@Composable () -> Unit
70-
) =
71-
platformScope.SegmentedButton(
72-
checked,
73-
onCheckedChange,
74-
SegmentedButtonDefaults.itemShape(
75-
defaultShapeArgs.index,
76-
defaultShapeArgs.count
77-
),
78-
modifier.platformModifier,
79-
enabled,
80-
icon = icon ?: { SegmentedButtonDefaults.Icon(checked) },
81-
) {
82-
Text(label)
83-
}
84-
}
34+
actual class MultiChoiceSegmentedButtonRowScope(val platformScope: androidx.compose.material3.MultiChoiceSegmentedButtonRowScope)
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.material3.SegmentedButton
4+
import androidx.compose.material3.SegmentedButtonDefaults
5+
import androidx.compose.material3.Text
6+
import androidx.compose.runtime.Composable
7+
import com.huanshankeji.compose.material3.MultiChoiceSegmentedButtonRowScope
8+
import com.huanshankeji.compose.material3.SegmentedButtonDefaultShapeArgs
9+
import com.huanshankeji.compose.material3.SingleChoiceSegmentedButtonRowScope
10+
import com.huanshankeji.compose.ui.Modifier
11+
12+
@Composable
13+
actual fun SingleChoiceSegmentedButtonRowScope.SegmentedButton(
14+
selected: Boolean,
15+
onClick: () -> Unit,
16+
defaultShapeArgs: SegmentedButtonDefaultShapeArgs,
17+
modifier: Modifier,
18+
enabled: Boolean,
19+
icon: @Composable (() -> Unit)?,
20+
label: String //@Composable () -> Unit
21+
) =
22+
platformScope.SegmentedButton(
23+
selected,
24+
onClick,
25+
SegmentedButtonDefaults.itemShape(
26+
defaultShapeArgs.index,
27+
defaultShapeArgs.count
28+
),
29+
modifier.platformModifier,
30+
enabled,
31+
icon = icon ?: { SegmentedButtonDefaults.Icon(selected) },
32+
) {
33+
Text(label)
34+
}
35+
36+
@Composable
37+
actual fun MultiChoiceSegmentedButtonRowScope.SegmentedButton(
38+
checked: Boolean,
39+
onCheckedChange: (Boolean) -> Unit,
40+
defaultShapeArgs: SegmentedButtonDefaultShapeArgs,
41+
modifier: Modifier,
42+
enabled: Boolean,
43+
icon: @Composable (() -> Unit)?,
44+
label: String //@Composable () -> Unit
45+
) =
46+
platformScope.SegmentedButton(
47+
checked,
48+
onCheckedChange,
49+
SegmentedButtonDefaults.itemShape(
50+
defaultShapeArgs.index,
51+
defaultShapeArgs.count
52+
),
53+
modifier.platformModifier,
54+
enabled,
55+
icon = icon ?: { SegmentedButtonDefaults.Icon(checked) },
56+
) {
57+
Text(label)
58+
}

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

Lines changed: 2 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,9 @@ package com.huanshankeji.compose.material3
33
import androidx.compose.runtime.Composable
44
import androidx.compose.ui.unit.Dp
55
import com.huanshankeji.compose.html.material3.MaterialWebLabsApi
6-
import com.huanshankeji.compose.html.material3.MdOutlinedSegmentedButton
76
import com.huanshankeji.compose.html.material3.MdOutlinedSegmentedButtonSet
8-
import com.huanshankeji.compose.html.material3.MdSegmentedButtonScope.Slot
97
import com.huanshankeji.compose.ui.Modifier
108
import com.huanshankeji.compose.ui.toAttrs
11-
import com.huanshankeji.compose.web.attributes.isFalseOrNull
12-
import com.huanshankeji.compose.web.attributes.isTrueOrNull
13-
import org.jetbrains.compose.web.dom.Div
149
import org.jetbrains.compose.web.dom.ElementScope
1510
import org.w3c.dom.HTMLElement
1611

@@ -36,70 +31,6 @@ actual fun MultiChoiceSegmentedButtonRow(
3631
MultiChoiceSegmentedButtonRowScope(this).content()
3732
}
3833

39-
@MaterialWebLabsApi
40-
@Composable
41-
private fun CommonSegmentedButton(
42-
selected: Boolean,
43-
onClick: () -> Unit,
44-
defaultShapeArgs: SegmentedButtonDefaultShapeArgs, // not used here
45-
modifier: Modifier,
46-
enabled: Boolean,
47-
icon: @Composable (() -> Unit)?,
48-
label: String //@Composable () -> Unit
49-
) {
50-
val hasIcon = (icon != null).isTrueOrNull()
51-
MdOutlinedSegmentedButton(
52-
enabled.isFalseOrNull(),
53-
selected.isTrueOrNull(),
54-
label,
55-
hasIcon,
56-
hasIcon,
57-
modifier.toAttrs {
58-
onClick { onClick() }
59-
}
60-
) {
61-
icon?.let { iconContent ->
62-
Div({ slot(Slot.Icon) }) {
63-
iconContent()
64-
}
65-
}
66-
/*
67-
// For `label: @Composable () -> Unit` by Copilot. Might not work.
68-
// Render label in the default slot
69-
label()
70-
*/
71-
}
72-
}
73-
74-
actual class SingleChoiceSegmentedButtonRowScope(val elementScope: ElementScope<HTMLElement>) {
75-
@MaterialWebLabsApi
76-
@Composable
77-
actual fun SegmentedButton(
78-
selected: Boolean,
79-
onClick: () -> Unit,
80-
defaultShapeArgs: SegmentedButtonDefaultShapeArgs, // not used here
81-
modifier: Modifier,
82-
enabled: Boolean,
83-
icon: @Composable (() -> Unit)?,
84-
label: String //@Composable () -> Unit
85-
) =
86-
CommonSegmentedButton(selected, onClick, defaultShapeArgs, modifier, enabled, icon, label)
87-
}
34+
actual class SingleChoiceSegmentedButtonRowScope(val elementScope: ElementScope<HTMLElement>)
8835

89-
actual class MultiChoiceSegmentedButtonRowScope(val elementScope: ElementScope<HTMLElement>) {
90-
@MaterialWebLabsApi
91-
@Composable
92-
actual fun SegmentedButton(
93-
checked: Boolean,
94-
onCheckedChange: (Boolean) -> Unit,
95-
defaultShapeArgs: SegmentedButtonDefaultShapeArgs, // not used here
96-
modifier: Modifier,
97-
enabled: Boolean,
98-
icon: @Composable (() -> Unit)?,
99-
label: String //@Composable () -> Unit
100-
) =
101-
CommonSegmentedButton(
102-
checked, { onCheckedChange(!checked) },
103-
defaultShapeArgs, modifier, enabled, icon, label
104-
)
105-
}
36+
actual class MultiChoiceSegmentedButtonRowScope(val elementScope: ElementScope<HTMLElement>)
Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
package com.huanshankeji.compose.material3.ext
2+
3+
import androidx.compose.runtime.Composable
4+
import com.huanshankeji.compose.html.material3.MaterialWebLabsApi
5+
import com.huanshankeji.compose.html.material3.MdOutlinedSegmentedButton
6+
import com.huanshankeji.compose.html.material3.MdSegmentedButtonScope.Slot
7+
import com.huanshankeji.compose.material3.MultiChoiceSegmentedButtonRowScope
8+
import com.huanshankeji.compose.material3.SegmentedButtonDefaultShapeArgs
9+
import com.huanshankeji.compose.material3.SingleChoiceSegmentedButtonRowScope
10+
import com.huanshankeji.compose.ui.Modifier
11+
import com.huanshankeji.compose.ui.toAttrs
12+
import com.huanshankeji.compose.web.attributes.isFalseOrNull
13+
import com.huanshankeji.compose.web.attributes.isTrueOrNull
14+
import org.jetbrains.compose.web.dom.Div
15+
16+
@MaterialWebLabsApi
17+
@Composable
18+
private fun CommonSegmentedButton(
19+
selected: Boolean,
20+
onClick: () -> Unit,
21+
defaultShapeArgs: SegmentedButtonDefaultShapeArgs, // not used here
22+
modifier: Modifier,
23+
enabled: Boolean,
24+
icon: @Composable (() -> Unit)?,
25+
label: String //@Composable () -> Unit
26+
) {
27+
val hasIcon = (icon != null).isTrueOrNull()
28+
MdOutlinedSegmentedButton(
29+
enabled.isFalseOrNull(),
30+
selected.isTrueOrNull(),
31+
label,
32+
hasIcon,
33+
hasIcon,
34+
modifier.toAttrs {
35+
onClick { onClick() }
36+
}
37+
) {
38+
icon?.let { iconContent ->
39+
Div({ slot(Slot.Icon) }) {
40+
iconContent()
41+
}
42+
}
43+
/*
44+
// For `label: @Composable () -> Unit` by Copilot. Might not work.
45+
// Render label in the default slot
46+
label()
47+
*/
48+
}
49+
}
50+
51+
@MaterialWebLabsApi
52+
@Composable
53+
actual fun SingleChoiceSegmentedButtonRowScope.SegmentedButton(
54+
selected: Boolean,
55+
onClick: () -> Unit,
56+
defaultShapeArgs: SegmentedButtonDefaultShapeArgs, // not used here
57+
modifier: Modifier,
58+
enabled: Boolean,
59+
icon: @Composable (() -> Unit)?,
60+
label: String //@Composable () -> Unit
61+
) =
62+
CommonSegmentedButton(selected, onClick, defaultShapeArgs, modifier, enabled, icon, label)
63+
64+
@MaterialWebLabsApi
65+
@Composable
66+
actual fun MultiChoiceSegmentedButtonRowScope.SegmentedButton(
67+
checked: Boolean,
68+
onCheckedChange: (Boolean) -> Unit,
69+
defaultShapeArgs: SegmentedButtonDefaultShapeArgs, // not used here
70+
modifier: Modifier,
71+
enabled: Boolean,
72+
icon: @Composable (() -> Unit)?,
73+
label: String //@Composable () -> Unit
74+
) =
75+
CommonSegmentedButton(
76+
checked, { onCheckedChange(!checked) },
77+
defaultShapeArgs, modifier, enabled, icon, label
78+
)

0 commit comments

Comments
 (0)