refactor: make Modifier function composed

flexiui-core/src/commonMain/kotlin/com/highcapable/flexiui/component/AreaBox.kt

@@ -40,6 +40,7 @@ import androidx.compose.runtime.ReadOnlyComposable
 import androidx.compose.runtime.compositionLocalOf
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.composed
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.graphics.Color
@@ -78,7 +79,7 @@ fun AreaBox(
         LocalAreaBoxShape provides style.shape
     ) {
         Box(
-            modifier = Modifier.box(style, color, modifier, initializer),
+            modifier = Modifier.areaBox(color, style, modifier, initializer),
             contentAlignment = contentAlignment,
             propagateMinConstraints = propagateMinConstraints,
             content = content
@@ -101,7 +102,7 @@ fun AreaRow(
         LocalAreaBoxShape provides style.shape
     ) {
         Row(
-            modifier = Modifier.box(style, color, modifier, initializer),
+            modifier = Modifier.areaBox(color, style, modifier, initializer),
             horizontalArrangement = horizontalArrangement,
             verticalAlignment = verticalAlignment,
             content = content
@@ -124,7 +125,7 @@ fun AreaColumn(
         LocalAreaBoxShape provides style.shape
     ) {
         Column(
-            modifier = Modifier.box(style, color, modifier, initializer),
+            modifier = Modifier.areaBox(color, style, modifier, initializer),
             verticalArrangement = verticalArrangement,
             horizontalAlignment = horizontalAlignment,
             content = content
@@ -132,23 +133,25 @@ fun AreaColumn(
     }
 }
 
-private fun Modifier.box(
+private fun Modifier.areaBox(
-    style: AreaBoxStyle,
     color: Color,
-    modifier: Modifier,
+    style: AreaBoxStyle,
+    then: Modifier,
     initializer: Modifier.() -> Modifier
-) = initializer()
+) = composed {
-    .shadow(style.shadowSize, style.shape)
+    initializer()
-    .clip(style.shape)
+        .shadow(style.shadowSize, style.shape)
-    .background(color, style.shape)
+        .clip(style.shape)
-    .borderOrNot(style.border, style.shape)
+        .background(color, style.shape)
-    .then(modifier)
+        .borderOrNot(style.border, style.shape)
-    .padding(
+        .then(then)
-        start = style.paddings.start,
+        .padding(
-        top = style.paddings.top,
+            start = style.paddings.start,
-        end = style.paddings.end,
+            top = style.paddings.top,
-        bottom = style.paddings.bottom
+            end = style.paddings.end,
-    )
+            bottom = style.paddings.bottom
+        )
+}
 
 object AreaBox {
     val color: Color

flexiui-core/src/commonMain/kotlin/com/highcapable/flexiui/component/Button.kt

@@ -38,6 +38,7 @@ import androidx.compose.runtime.ReadOnlyComposable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.composed
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
@@ -92,7 +93,7 @@ fun Button(
             enabled = enabled,
             colors = colors,
             style = style,
-            modifier = modifier
+            then = modifier
         ).rippleClickable(
             enabled = enabled,
             role = Role.Button,
@@ -133,7 +134,7 @@ fun IconButton(
             enabled = enabled,
             colors = colors,
             style = style,
-            modifier = modifier
+            then = modifier
         ).rippleClickable(
             rippleColor = colors.rippleColor,
             bounded = false,
@@ -162,7 +163,7 @@ fun IconToggleButton(
             enabled = enabled,
             colors = colors,
             style = style,
-            modifier = modifier
+            then = modifier
         ).rippleToggleable(
             value = checked,
             rippleColor = colors.rippleColor,
@@ -180,12 +181,14 @@ private fun Modifier.button(
     enabled: Boolean,
     colors: ButtonColors,
     style: ButtonStyle,
-    modifier: Modifier
+    then: Modifier
-) = status(enabled)
+) = composed {
-    .clip(style.shape)
+    status(enabled)
-    .background(colors.backgroundColor, style.shape)
+        .clip(style.shape)
-    .borderOrNot(style.border, style.shape)
+        .background(colors.backgroundColor, style.shape)
-    .then(modifier)
+        .borderOrNot(style.border, style.shape)
+        .then(then)
+}
 
 private fun Modifier.buttonPadding(style: ButtonStyle) = padding(
     start = style.paddings.start,

flexiui-core/src/commonMain/kotlin/com/highcapable/flexiui/component/Dropdown.kt

@@ -69,6 +69,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.composed
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.focus.FocusDirection
 import androidx.compose.ui.focus.FocusManager
@@ -193,7 +194,7 @@ fun DropdownList(
             enabled = enabled,
             focusRequester = focusRequester,
             interactionSource = interactionSource,
-            modifier = modifier.rippleClickable(
+            then = modifier.rippleClickable(
                 enabled = enabled,
                 role = Role.DropdownList,
                 interactionSource = interactionSource
@@ -416,21 +417,23 @@ private fun Modifier.dropdownList(
     enabled: Boolean,
     focusRequester: FocusRequester,
     interactionSource: MutableInteractionSource,
-    modifier: Modifier
+    then: Modifier
-) = status(enabled)
+) = composed {
-    .focusRequester(focusRequester)
+    status(enabled)
-    .focusable(enabled, interactionSource)
+        .focusRequester(focusRequester)
-    .hoverable(interactionSource, enabled)
+        .focusable(enabled, interactionSource)
-    .clip(style.shape)
+        .hoverable(interactionSource, enabled)
-    .background(colors.backgroundColor, style.shape)
+        .clip(style.shape)
-    .borderOrNot(border, style.shape)
+        .background(colors.backgroundColor, style.shape)
-    .then(modifier)
+        .borderOrNot(border, style.shape)
-    .padding(
+        .then(then)
-        start = style.paddings.start,
+        .padding(
-        top = style.paddings.top,
+            start = style.paddings.start,
-        end = style.paddings.end,
+            top = style.paddings.top,
-        bottom = style.paddings.bottom
+            end = style.paddings.end,
-    )
+            bottom = style.paddings.bottom
+        )
+}
 
 private fun calculateTransformOrigin(parentBounds: IntRect, menuBounds: IntRect): TransformOrigin {
     val pivotX = when {

flexiui-core/src/commonMain/kotlin/com/highcapable/flexiui/component/Icon.kt

@@ -29,6 +29,7 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.ReadOnlyComposable
 import androidx.compose.runtime.compositionLocalOf
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.composed
 import androidx.compose.ui.draw.paint
 import androidx.compose.ui.geometry.Size
 import androidx.compose.ui.graphics.Color
@@ -84,12 +85,13 @@ fun Icon(
 
 internal val LocalIconTint = compositionLocalOf { Color.Unspecified }
 
-@Composable
+private fun Modifier.defaultSizeFor(painter: Painter) = composed {
-private fun Modifier.defaultSizeFor(painter: Painter) = then(
+    then(
-    if (painter.intrinsicSize == Size.Unspecified || painter.intrinsicSize.isInfinite())
+        if (painter.intrinsicSize == Size.Unspecified || painter.intrinsicSize.isInfinite())
-        Modifier.size(defaultIconSize())
+            Modifier.size(defaultIconSize())
-    else Modifier
+        else Modifier
-)
+    )
+}
 
 @Composable
 @ReadOnlyComposable

flexiui-core/src/commonMain/kotlin/com/highcapable/flexiui/component/Surface.kt

@@ -32,6 +32,7 @@ import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.Immutable
 import androidx.compose.runtime.ReadOnlyComposable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.composed
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.Dp
 import com.highcapable.flexiui.LocalColors
@@ -72,17 +73,19 @@ fun Surface(
 private fun Modifier.surface(
     colors: SurfaceColors,
     style: SurfaceStyle,
-    modifier: Modifier,
+    then: Modifier,
     initializer: Modifier.() -> Modifier
-) = initializer()
+) = composed {
-    .background(colors.backgroundColor)
+    initializer()
-    .then(modifier)
+        .background(colors.backgroundColor)
-    .padding(
+        .then(then)
-        start = style.paddings.start,
+        .padding(
-        top = style.paddings.top,
+            start = style.paddings.start,
-        end = style.paddings.end,
+            top = style.paddings.top,
-        bottom = style.paddings.bottom
+            end = style.paddings.end,
-    )
+            bottom = style.paddings.bottom
+        )
+}
 
 object Surface {
     val colors: SurfaceColors

flexiui-core/src/commonMain/kotlin/com/highcapable/flexiui/component/TextField.kt

@@ -58,6 +58,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.composed
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.focus.FocusRequester
@@ -184,7 +185,7 @@ fun TextField(
             border = border,
             enabled = enabled,
             interactionSource = interactionSource,
-            modifier = modifier
+            then = modifier
         ).pointerHoverState(TextFieldPointerState.TEXT)
     ) {
         // Note: If minWidth is not 0, a constant width is currently set.
@@ -716,29 +717,33 @@ private fun Modifier.textField(
     border: BorderStroke,
     enabled: Boolean,
     interactionSource: MutableInteractionSource,
-    modifier: Modifier
+    then: Modifier
-) = status(enabled)
+) = composed {
-    .focusable(enabled, interactionSource)
+    status(enabled)
-    .hoverable(interactionSource, enabled)
+        .focusable(enabled, interactionSource)
-    .clip(style.shape)
+        .hoverable(interactionSource, enabled)
-    .background(colors.backgroundColor, style.shape)
+        .clip(style.shape)
-    .borderOrNot(border, style.shape)
+        .background(colors.backgroundColor, style.shape)
-    .then(modifier)
+        .borderOrNot(border, style.shape)
+        .then(then)
+}
 
 private fun Modifier.textFieldPadding(
     style: TextFieldStyle,
     fitStart: Boolean = false,
     fitEnd: Boolean = false
-) = when {
+) = composed {
-    !fitStart && !fitEnd -> padding(
+    when {
-        start = style.paddings.start,
+        !fitStart && !fitEnd -> padding(
-        top = style.paddings.top,
+            start = style.paddings.start,
-        end = style.paddings.end,
+            top = style.paddings.top,
-        bottom = style.paddings.bottom
+            end = style.paddings.end,
-    )
+            bottom = style.paddings.bottom
-    fitStart -> padding(start = style.paddings.start)
+        )
-    fitEnd -> padding(end = style.paddings.end)
+        fitStart -> padding(start = style.paddings.start)
-    else -> this
+        fitEnd -> padding(end = style.paddings.end)
+        else -> this
+    }
 }
 
 object TextField {

flexiui-core/src/desktopMain/kotlin/com/highcapable/flexiui/component/TextField.desktop.kt

@@ -24,11 +24,12 @@
 package com.highcapable.flexiui.component
 
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.composed
 import androidx.compose.ui.input.pointer.PointerIcon
 import androidx.compose.ui.input.pointer.pointerHoverIcon
 import java.awt.Cursor
 
-internal actual fun Modifier.pointerHoverState(state: TextFieldPointerState) =
+internal actual fun Modifier.pointerHoverState(state: TextFieldPointerState) = composed {
     pointerHoverIcon(
         PointerIcon(
             Cursor.getPredefinedCursor(when (state) {
@@ -36,4 +37,5 @@ internal actual fun Modifier.pointerHoverState(state: TextFieldPointerState) =
                 TextFieldPointerState.TEXT -> Cursor.TEXT_CURSOR
             })
         )
-    )
+    )
+}