style: merge to official recommended compose style

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

@@ -266,7 +266,9 @@ interface AppBarScope {
         val iconInflateSize = impl.style.actionIconSize + impl.style.actionIconPadding
         IconButton(
             onClick = onClick,
-            modifier = Modifier.size(iconInflateSize).then(modifier),
+            modifier = Modifier
+                .size(iconInflateSize)
+                .then(modifier),
             colors = colors,
             style = style,
             enabled = enabled,
@@ -303,7 +305,8 @@ private class AppBarImpl(
             ) {
                 val actionContentMaxWidth = if (actions != null) style.actionContentMaxWidth else 0.dp
                 Row(
-                    modifier = Modifier.padding(end = style.contentSpacing)
+                    modifier = Modifier
+                        .padding(end = style.contentSpacing)
                         .widthIn(max = contentMaxWidth - actionContentMaxWidth),
                     horizontalArrangement = Arrangement.spacedBy(style.contentSpacing),
                     verticalAlignment = Alignment.CenterVertically

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

@@ -117,18 +117,20 @@ fun Button(
         backgroundColor = Color.Transparent
     )
     Box(
-        modifier = Modifier.button(
+        modifier = Modifier
-            enabled = enabled,
+            .button(
-            colors = colors,
+                enabled = enabled,
-            style = style,
+                colors = colors,
-            then = modifier
+                style = style,
-        ).rippleClickable(
+                then = modifier
-            rippleStyle = style.rippleStyle,
+            )
-            enabled = enabled,
+            .rippleClickable(
-            role = Role.Button,
+                rippleStyle = style.rippleStyle,
-            interactionSource = interactionSource,
+                enabled = enabled,
-            onClick = onClick
+                role = Role.Button,
-        ),
+                interactionSource = interactionSource,
+                onClick = onClick
+            ),
         contentAlignment = Alignment.Center
     ) {
         CompositionLocalProvider(
@@ -171,18 +173,21 @@ fun IconButton(
     content: @Composable () -> Unit
 ) {
     Box(
-        modifier = Modifier.button(
+        modifier = Modifier
-            enabled = enabled,
+            .button(
-            colors = colors,
+                enabled = enabled,
-            style = style,
+                colors = colors,
-            then = modifier
+                style = style,
-        ).rippleClickable(
+                then = modifier
-            rippleStyle = style.rippleStyle,
+            )
-            enabled = enabled,
+            .rippleClickable(
-            role = Role.Button,
+                rippleStyle = style.rippleStyle,
-            interactionSource = interactionSource,
+                enabled = enabled,
-            onClick = onClick
+                role = Role.Button,
-        ).padding(style.padding),
+                interactionSource = interactionSource,
+                onClick = onClick
+            )
+            .padding(style.padding),
         contentAlignment = Alignment.Center,
     ) { IconButtonStyle(colors, content) }
 }
@@ -212,19 +217,22 @@ fun IconToggleButton(
     content: @Composable () -> Unit
 ) {
     Box(
-        modifier = Modifier.button(
+        modifier = Modifier
-            enabled = enabled,
+            .button(
-            colors = colors,
+                enabled = enabled,
-            style = style,
+                colors = colors,
-            then = modifier
+                style = style,
-        ).rippleToggleable(
+                then = modifier
-            value = checked,
+            )
-            rippleStyle = style.rippleStyle,
+            .rippleToggleable(
-            onValueChange = onCheckedChange,
+                value = checked,
-            enabled = enabled,
+                rippleStyle = style.rippleStyle,
-            role = Role.Checkbox,
+                onValueChange = onCheckedChange,
-            interactionSource = interactionSource
+                enabled = enabled,
-        ).padding(style.padding),
+                role = Role.Checkbox,
+                interactionSource = interactionSource
+            )
+            .padding(style.padding),
         contentAlignment = Alignment.Center
     ) { IconButtonStyle(colors, content) }
 }
@@ -304,11 +312,13 @@ object ButtonDefaults {
      */
     @Composable
     fun style(
-        rippleStyle: RippleStyle = InteractionDefaults.rippleStyle(color = when {
+        rippleStyle: RippleStyle = InteractionDefaults.rippleStyle(
-            LocalPrimaryButton.current -> ButtonProperties.PrimaryRippleColor
+            color = when {
-            LocalInAreaBox.current -> ButtonProperties.RippleColor
+                LocalPrimaryButton.current -> ButtonProperties.PrimaryRippleColor
-            else -> ButtonProperties.PrimaryRippleColor
+                LocalInAreaBox.current -> ButtonProperties.RippleColor
-        }.toColor()),
+                else -> ButtonProperties.PrimaryRippleColor
+            }.toColor()
+        ),
         padding: ComponentPadding = ButtonProperties.Padding.toPadding(),
         shape: Shape = AreaBoxDefaults.childShape(),
         borderWidth: Dp = ButtonProperties.BorderWidth.toDp()

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

@@ -117,13 +117,19 @@ fun CheckBox(
     val animatedContentScale by animateFloatAsState(if (hovered) style.hoveredGain else 1f)
     val animatedContentAlpha by animateFloatAsState(if (checked) 1f else 0f)
     val animatedContentLayer by animateFloatAsState(if (checked) 1f else 0f)
-    Row(modifier = Modifier.componentState(enabled).then(modifier), verticalAlignment = Alignment.CenterVertically) {
+    Row(
+        modifier = Modifier
+            .componentState(enabled)
+            .then(modifier),
+        verticalAlignment = Alignment.CenterVertically
+    ) {
         Box(
-            modifier = Modifier.clickable(
+            modifier = Modifier
-                interactionSource = interactionSource,
+                .clickable(
-                enabled = enabled,
+                    interactionSource = interactionSource,
-                role = Role.Checkbox
+                    enabled = enabled,
-            ) { onCheckedChange(!checked) }
+                    role = Role.Checkbox
+                ) { onCheckedChange(!checked) }
                 .size(style.strokeSize)
                 .scale(animatedStrokeScale)
                 .background(animatedColor, style.shape)
@@ -131,7 +137,8 @@ fun CheckBox(
             contentAlignment = Alignment.Center
         ) {
             Icon(
-                modifier = Modifier.size(style.contentSize)
+                modifier = Modifier
+                    .size(style.contentSize)
                     .scale(animatedContentScale)
                     .alpha(animatedContentAlpha)
                     .graphicsLayer(

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

@@ -250,9 +250,9 @@ fun DropdownList(
         ) {
             Box(modifier = Modifier.weight(1f, needInflatable)) { text() }
             Icon(
-                modifier = Modifier.graphicsLayer {
+                modifier = Modifier
-                    rotationZ = animatedDirection
+                    .graphicsLayer { rotationZ = animatedDirection }
-                }.size(style.endIconSize),
+                    .size(style.endIconSize),
                 imageVector = FlexiIcons.Dropdown,
                 style = IconDefaults.style(tint = animatedEndIconTint)
             )
@@ -261,7 +261,9 @@ fun DropdownList(
             expanded = expanded,
             onDismissRequest = { onExpandedChange(false) },
             offset = DpOffset(-style.padding.start, style.padding.end),
-            modifier = Modifier.width(menuMaxWidth).heightIn(max = menuMaxHeight),
+            modifier = Modifier
+                .width(menuMaxWidth)
+                .heightIn(max = menuMaxHeight),
             colors = menuColors,
             style = menuStyle,
             scrollState = scrollState,
@@ -405,7 +407,8 @@ fun DropdownMenuItem(
         ?: LocalDropdownMenuContentShape.current
         ?: DropdownMenuDefaults.style().contentShape
     AreaRow(
-        modifier = Modifier.componentState(enabled)
+        modifier = Modifier
+            .componentState(enabled)
             .then(modifier)
             .fillMaxWidth()
             .sizeIn(
@@ -473,7 +476,8 @@ private fun DropdownMenuContent(
         }
     ) { if (it) 1f else 0f }
     AreaColumn(
-        modifier = modifier.width(IntrinsicSize.Max)
+        modifier = modifier
+            .width(IntrinsicSize.Max)
             .verticalScroll(scrollState),
         initializer = {
             graphicsLayer {

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

@@ -110,7 +110,8 @@ fun Icon(
         }
     else Modifier
     Box(
-        modifier = modifier.toolingGraphicsLayer()
+        modifier = modifier
+            .toolingGraphicsLayer()
             .defaultSizeFor(currentStyle, painter)
             .paint(
                 painter,

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

@@ -115,7 +115,9 @@ fun NavigationBarRow(
 ) {
     NavigationBarStyleBox(modifier, horizontal = true, colors, style) {
         AreaRow(
-            modifier = Modifier.fillMaxWidth().selectableGroup(),
+            modifier = Modifier
+                .fillMaxWidth()
+                .selectableGroup(),
             colors = AreaBoxDefaults.colors(
                 backgroundColor = colors.backgroundColor,
                 borderColor = colors.borderColor
@@ -153,7 +155,9 @@ fun NavigationBarColumn(
 ) {
     NavigationBarStyleBox(modifier, horizontal = false, colors, style) {
         AreaColumn(
-            modifier = Modifier.fillMaxWidth().selectableGroup(),
+            modifier = Modifier
+                .fillMaxWidth()
+                .selectableGroup(),
             colors = AreaBoxDefaults.colors(
                 backgroundColor = colors.backgroundColor,
                 borderColor = colors.borderColor
@@ -219,7 +223,8 @@ fun NavigationBarItem(
     val currentIconStyle = LocalIconStyle.current.copy(tint = animatedContentColor)
     val currentTextStyle = LocalTextStyle.current.copy(color = animatedContentColor)
     Box(
-        modifier = Modifier.componentState(enabled)
+        modifier = Modifier
+            .componentState(enabled)
             .clip(currentContentShape)
             .then(modifier)
             .background(animatedIndicatorColor)

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

@@ -119,20 +119,28 @@ fun RadioButton(
     val animatedContentScale by animateFloatAsState(if (hovered) style.hoveredGain else 1f)
     val animatedContentShadow by animateDpAsState(if (selected) style.contentShadowSize else 0.dp)
     val animatedContentAlpha by animateFloatAsState(if (selected) 1f else 0f)
-    Row(modifier = Modifier.componentState(enabled).then(modifier), verticalAlignment = Alignment.CenterVertically) {
+    Row(
+        modifier = Modifier
+            .componentState(enabled)
+            .then(modifier),
+        verticalAlignment = Alignment.CenterVertically
+    ) {
         Box(
-            modifier = Modifier.clickable(
+            modifier = Modifier
-                interactionSource = interactionSource,
+                .clickable(
-                enabled = enabled,
+                    interactionSource = interactionSource,
-                role = Role.RadioButton,
+                    enabled = enabled,
-                onClick = onClick
+                    role = Role.RadioButton,
-            ).size(strokeDiameter)
+                    onClick = onClick
+                )
+                .size(strokeDiameter)
                 .scale(animatedStrokeScale)
                 .background(animatedColor, style.shape),
             contentAlignment = Alignment.Center
         ) {
             Box(
-                modifier = Modifier.size(contentDiameter)
+                modifier = Modifier
+                    .size(contentDiameter)
                     .scale(animatedContentScale)
                     .shadow(animatedContentShadow, style.shape)
                     .alpha(animatedContentAlpha)

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

@@ -68,7 +68,9 @@ fun Scaffold(
     content: @Composable (innerPadding: ComponentPadding) -> Unit
 ) {
     Surface(
-        modifier = Modifier.fillMaxSize().then(modifier),
+        modifier = Modifier
+            .fillMaxSize()
+            .then(modifier),
         colors = colors,
         padding = ComponentPadding.None
     ) {

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

@@ -213,9 +213,13 @@ private fun SliderLayout(
     @Composable
     fun Track(content: @Composable () -> Unit) {
         val cornerSize = (style.trackShape as? CornerBasedShape)?.topStart?.toPx(Size.Zero, LocalDensity.current) ?: 0f
-        Box(modifier = Modifier.width(trackWidth), contentAlignment = Alignment.Center) {
+        Box(
+            modifier = Modifier.width(trackWidth),
+            contentAlignment = Alignment.Center
+        ) {
             Box(
-                modifier = Modifier.size(trackAdoptWidth, style.trackHeight)
+                modifier = Modifier
+                    .size(trackAdoptWidth, style.trackHeight)
                     .background(colors.trackInactiveColor, style.trackShape)
                     .borderOrElse(style.trackBorderWidth, colors.trackBorderColor, style.trackShape)
                     .drawWithContent {
@@ -238,12 +242,12 @@ private fun SliderLayout(
             horizontalArrangement = Arrangement.SpaceBetween,
             verticalAlignment = Alignment.CenterVertically
         ) {
-            for (i in 0 until steps + 2)
+            for (i in 0 until steps + 2) Box(
-                Box(
+                modifier = Modifier
-                    modifier = Modifier.size(style.trackHeight)
+                    .size(style.trackHeight)
-                        .background(colors.stepColor, style.stepShape)
+                    .background(colors.stepColor, style.stepShape)
-                        .borderOrElse(style.stepBorderWidth, colors.stepBorderColor, style.stepShape)
+                    .borderOrElse(style.stepBorderWidth, colors.stepBorderColor, style.stepShape)
-                )
+            )
         }
     }
 
@@ -251,7 +255,8 @@ private fun SliderLayout(
     @Composable
     fun Thumb() {
         Box(
-            modifier = Modifier.size(thumbDiameter)
+            modifier = Modifier
+                .size(thumbDiameter)
                 .offset { IntOffset(adoptedOffsetX.roundToInt(), 0) }
                 .scale(animatedScale)
                 .shadow(style.thumbShadowSize, style.thumbShape)
@@ -286,7 +291,8 @@ private fun SliderLayout(
         )
     }
     Box(
-        modifier = Modifier.componentState(enabled)
+        modifier = Modifier
+            .componentState(enabled)
             .then(modifier)
             .hoverable(interactionSource, enabled)
             .pointerInput(Unit) {

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

@@ -98,7 +98,8 @@ fun StickyHeaderBar(
         val iconStyle = IconDefaults.style(size = style.iconSize, tint = colors.iconTint)
         val textStyle = style.textStyle.copy(color = colors.textColor)
         Box(
-            modifier = Modifier.clip(style.iconShape)
+            modifier = Modifier
+                .clip(style.iconShape)
                 .background(colors.iconBackgroundColor)
                 .padding(style.iconPadding)
         ) {

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

@@ -148,15 +148,17 @@ fun Switch(
     @Composable
     fun Track(content: @Composable RowScope.() -> Unit) {
         Row(
-            modifier = Modifier.clickable(
+            modifier = Modifier
-                interactionSource = interactionSource,
+                .clickable(
-                enabled = enabled,
+                    interactionSource = interactionSource,
-                role = Role.Switch
+                    enabled = enabled,
-            ) {
+                    role = Role.Switch
-                distance = maxOffsetX
+                ) {
-                offsetX = if (checked) 0f else maxOffsetX
+                    distance = maxOffsetX
-                onCheckedChange(!checked)
+                    offsetX = if (checked) 0f else maxOffsetX
-            }.background(if (efficientDragging) trackColor else animatedTrackColor, style.trackShape)
+                    onCheckedChange(!checked)
+                }
+                .background(if (efficientDragging) trackColor else animatedTrackColor, style.trackShape)
                 .borderOrElse(style.trackBorderWidth, colors.trackBorderColor, style.trackShape)
                 .size(style.trackWidth, style.trackHeight)
                 .padding(style.padding),
@@ -169,7 +171,8 @@ fun Switch(
     @Composable
     fun Thumb() {
         Box(
-            modifier = Modifier.size(thumbDiameter)
+            modifier = Modifier
+                .size(thumbDiameter)
                 .offset { IntOffset((if (efficientDragging) offsetX else animatedOffsetX).roundToInt(), 0) }
                 .scale(animatedScale)
                 .shadow(style.thumbShadowSize, style.thumbShape)
@@ -208,7 +211,11 @@ fun Switch(
                 )
         )
     }
-    Box(modifier = Modifier.componentState(enabled).then(modifier)) { Track { Thumb() } }
+    Box(
+        modifier = Modifier
+            .componentState(enabled)
+            .then(modifier)
+    ) { Track { Thumb() } }
 }
 
 /**
@@ -239,7 +246,8 @@ fun SwitchItem(
         verticalAlignment = Alignment.CenterVertically
     ) {
         Box(
-            modifier = Modifier.componentState(enabled)
+            modifier = Modifier
+                .componentState(enabled)
                 .weight(1f)
                 .clickable(enabled = enabled) { onCheckedChange(!checked) }
         ) { content() }

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

@@ -126,7 +126,11 @@ fun TabRow(
     tabs: @Composable () -> Unit
 ) {
     TabStyleBox(modifier, colors, style) {
-        SubcomposeLayout(Modifier.fillMaxWidth().selectableGroup()) { constraints ->
+        SubcomposeLayout(
+            modifier = Modifier
+                .fillMaxWidth()
+                .selectableGroup()
+        ) { constraints ->
             val maximumConstraints = Constraints()
             val tabRowWidth = constraints.maxWidth
             val tabMeasurables = subcompose(TabSlots.Tabs, tabs)
@@ -181,7 +185,8 @@ fun ScrollableTabRow(
     TabStyleBox(modifier, colors, style) {
         val scrollableTabData = rememberScrollableTabData(scrollState)
         SubcomposeLayout(
-            modifier = Modifier.fillMaxWidth()
+            modifier = Modifier
+                .fillMaxWidth()
                 .wrapContentSize(align = Alignment.CenterStart)
                 .horizontalScroll(scrollState)
                 .selectableGroup()
@@ -264,7 +269,8 @@ fun Tab(
         LocalTextStyle provides contentTextStyle
     ) {
         Row(
-            modifier = Modifier.componentState(enabled)
+            modifier = Modifier
+                .componentState(enabled)
                 .clip(currentContentShape)
                 .then(modifier)
                 .rippleClickable(

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

@@ -167,16 +167,18 @@ fun Text(
     BasicText(
         text = text,
         modifier = modifier,
-        style = currentStyle.copy(color = currentColor).merge(
+        style = currentStyle
-            fontSize = fontSize,
+            .copy(color = currentColor)
-            fontStyle = fontStyle,
+            .merge(
-            fontWeight = fontWeight,
+                fontSize = fontSize,
-            fontFamily = fontFamily,
+                fontStyle = fontStyle,
-            letterSpacing = letterSpacing,
+                fontWeight = fontWeight,
-            textDecoration = textDecoration,
+                fontFamily = fontFamily,
-            textAlign = textAlign,
+                letterSpacing = letterSpacing,
-            lineHeight = lineHeight
+                textDecoration = textDecoration,
-        ),
+                textAlign = textAlign,
+                lineHeight = lineHeight
+            ),
         onTextLayout = onTextLayout,
         overflow = overflow,
         softWrap = softWrap,

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

@@ -161,6 +161,7 @@ data class AutoCompleteOptions(
  * @see TextField
  * @see PasswordTextField
  * @see BackspaceTextField
+ * @see BasicTextField
  * @param value the text field value.
  * @param onValueChange the text field value change callback.
  * @param completionValues the auto complete values, when you want to use auto complete.
@@ -224,15 +225,17 @@ fun TextField(
     })
     val textColor = style.textStyle.color.orNull() ?: colors.textColor
     BoxWithConstraints(
-        modifier = Modifier.textField(
+        modifier = Modifier
-            enabled = enabled,
+            .textField(
-            colors = colors,
+                enabled = enabled,
-            style = style,
+                colors = colors,
-            borderColor = animatedBorderColor,
+                style = style,
-            borderWidth = animatedBorderWidth,
+                borderColor = animatedBorderColor,
-            interactionSource = interactionSource,
+                borderWidth = animatedBorderWidth,
-            then = modifier
+                interactionSource = interactionSource,
-        ).pointerHoverState(TextFieldPointerState.Text)
+                then = modifier
+            )
+            .pointerHoverState(TextFieldPointerState.Text)
     ) {
         // Note: If minWidth is not 0, a constant width is currently set.
         //       At this time, the child layout must be completely filled into the parent layout.
@@ -247,12 +250,17 @@ fun TextField(
                     content = it
                 )
             }
-            Box(modifier = Modifier.weight(1f, needInflatable).textFieldPadding(style)) {
+            Box(
+                modifier = Modifier
+                    .weight(1f, needInflatable)
+                    .textFieldPadding(style)
+            ) {
                 TextFieldStyle(colors) {
                     BasicTextField(
                         value = value,
                         onValueChange = onValueChange,
-                        modifier = Modifier.inflatable()
+                        modifier = Modifier
+                            .inflatable()
                             .focusRequester(focusRequester)
                             .onKeyEvent { keyEventFactory.onKeyEvent?.invoke(it) ?: false },
                         enabled = enabled,
@@ -307,6 +315,7 @@ fun TextField(
  * @see TextField
  * @see PasswordTextField
  * @see BackspaceTextField
+ * @see BasicTextField
  * @param value the value of text.
  * @param onValueChange the text field value change callback.
  * @param completionValues the auto complete values, when you want to use auto complete.
@@ -458,7 +467,9 @@ fun PasswordTextField(
                 if (pressed) focusRequester.requestFocus()
                 if (value.text.isEmpty() && animatedSize == 0.dp) passwordVisible = defaultPasswordVisible
                 IconToggleButton(
-                    modifier = Modifier.size(animatedSize).pointerHoverState(TextFieldPointerState.Common),
+                    modifier = Modifier
+                        .size(animatedSize)
+                        .pointerHoverState(TextFieldPointerState.Common),
                     style = IconButtonDefaults.style(padding = TextDecorIconPadding),
                     checked = passwordVisible,
                     onCheckedChange = {
@@ -630,7 +641,9 @@ fun BackspaceTextField(
                         }
                         focusRequester.requestFocus()
                     },
-                    modifier = Modifier.width(animatedSize).pointerHoverState(TextFieldPointerState.Common),
+                    modifier = Modifier
+                        .width(animatedSize)
+                        .pointerHoverState(TextFieldPointerState.Common),
                     style = IconButtonDefaults.style(padding = TextDecorIconPadding),
                     enabled = enabled,
                     interactionSource = cInteractionSource

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

@@ -230,7 +230,9 @@ fun FlexiDialog(
         ) {
             neutralButton?.also { button ->
                 AdaptiveRow(
-                    modifier = Modifier.fillMaxWidth().padding(bottom = style.buttonsSpacing),
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .padding(bottom = style.buttonsSpacing),
                     content = button
                 )
             }
@@ -327,9 +329,15 @@ private fun BasicFlexiDialog(
                 alpha = animatedAlpha
             }.then(modifier)
         else modifier
-        Box(modifier = Modifier.padding(insetsPadding).then(sModifier)) {
+        Box(
+            modifier = Modifier
+                .padding(insetsPadding)
+                .then(sModifier)
+        ) {
             AreaBox(
-                modifier = Modifier.widthIn(max = maxWidth).heightIn(max = maxHeight),
+                modifier = Modifier
+                    .widthIn(max = maxWidth)
+                    .heightIn(max = maxHeight),
                 colors = boxColors,
                 style = boxStyle,
                 contentAlignment = contentAlignment