library: Add disabled state to super component

Author: YuKongA

composeApp/src/commonMain/kotlin/component/TextComponent.kt

@@ -205,6 +205,13 @@ fun TextComponent() {
             },
         )
 
+        SuperCheckbox(
+            title = "Disabled Checkbox",
+            checked = true,
+            enabled = false,
+            onCheckedChange = {},
+        )
+
         SuperSwitch(
             title = "Switch",
             summary = "Click to expand a Switch",
@@ -236,14 +243,27 @@ fun TextComponent() {
             )
         }
 
+        SuperSwitch(
+            title = "Disabled Switch",
+            checked = true,
+            enabled = false,
+            onCheckedChange = {},
+        )
+
         SuperArrow(
-            title = "Dialog",
+            title = "Arrow",
             summary = "Click to show Dialog 2",
             onClick = {
                 showDialog2.value = true
             }
         )
 
+        SuperArrow(
+            title = "Disabled Arrow",
+            onClick = {},
+            enabled = false
+        )
+
         SuperDropdown(
             title = "Dropdown",
             summary = "Popup near click",
@@ -261,6 +281,13 @@ fun TextComponent() {
             onSelectedIndexChange = { newOption -> dropdownSelectedOptionRight.value = newOption },
         )
 
+        SuperDropdown(
+            title = "Disabled Dropdown",
+            items = listOf("Option 1"),
+            selectedIndex = 0,
+            onSelectedIndexChange = {},
+            enabled = false
+        )
     }
 
     dialog(showDialog)

miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Component.kt

@@ -48,15 +48,17 @@ fun BasicComponent(
     rightActions: @Composable RowScope.() -> Unit = {},
     onClick: (() -> Unit)? = null,
     interactionSource: MutableInteractionSource? = null,
-    indication: Indication? = null
+    indication: Indication? = null,
+    enabled: Boolean = true
 ) {
     val interactionSource = interactionSource ?: remember { MutableInteractionSource() }
     val indication = indication ?: createRipple()
     val insideMargin = remember { insideMargin } ?: remember { DpSize(16.dp, 16.dp) }
     val paddingModifier = remember(insideMargin) {
         Modifier.padding(horizontal = insideMargin.width, vertical = insideMargin.height)
     }
-
+    val titleColor = if (enabled) titleColor else MiuixTheme.colorScheme.disabledOnSecondaryVariant
+    val summaryColor = if (enabled) summaryColor else MiuixTheme.colorScheme.disabledOnSecondaryVariant
     Row(
         modifier = if (onClick != null) {
             modifier

miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Slider.kt

@@ -67,7 +67,7 @@ fun Slider(
             (round(newValue * factor) / factor).coerceIn(minValue, maxValue)
         }
     }
-    val color = rememberUpdatedState(if (enabled) MiuixTheme.colorScheme.primary else MiuixTheme.colorScheme.disabledPrimarySlider)
+    val foregroundColor = rememberUpdatedState(if (enabled) MiuixTheme.colorScheme.primary else MiuixTheme.colorScheme.disabledPrimarySlider)
     val backgroundColor = rememberUpdatedState(MiuixTheme.colorScheme.tertiaryContainerVariant)
 
     Box(
@@ -105,11 +105,11 @@ fun Slider(
         SliderBackground(
             modifier = Modifier.fillMaxWidth().height(height),
             backgroundColor = backgroundColor.value,
+            foregroundColor = foregroundColor.value,
             effect = effect,
             progress = progress,
             minValue = minValue,
             maxValue = maxValue,
-            color = color.value
         )
     }
 }
@@ -118,11 +118,11 @@ fun Slider(
 fun SliderBackground(
     modifier: Modifier,
     backgroundColor: Color,
+    foregroundColor: Color,
     effect: Boolean,
     progress: Float,
     minValue: Float,
     maxValue: Float,
-    color: Color
 ) {
     Canvas(modifier = modifier.clip(SquircleShape(100.dp)).background(backgroundColor)) {
         val barHeight = size.height
@@ -131,7 +131,7 @@ fun SliderBackground(
         val cornerRadius = if (effect) CornerRadius(barHeight / 2) else CornerRadius.Zero
 
         drawRoundRect(
-            color = color,
+            color = foregroundColor,
             size = Size(progressWidth, barHeight),
             topLeft = Offset(0f, center.y - barHeight / 2),
             cornerRadius = cornerRadius

miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperArrow.kt

@@ -32,6 +32,7 @@ import top.yukonga.miuix.kmp.theme.MiuixTheme
  * @param rightText The text on the right side of the [SuperArrow].
  * @param onClick The callback when the [SuperArrow] is clicked.
  * @param insideMargin The margin inside the [SuperArrow].
+ * @param enabled Whether the [SuperArrow] is clickable.
  */
 @Composable
 fun SuperArrow(
@@ -43,7 +44,8 @@ fun SuperArrow(
     leftAction: @Composable (() -> Unit)? = null,
     rightText: String? = null,
     onClick: (() -> Unit)? = null,
-    insideMargin: DpSize = DpSize(16.dp, 16.dp)
+    insideMargin: DpSize = DpSize(16.dp, 16.dp),
+    enabled: Boolean = true
 ) {
     val updatedOnClick by rememberUpdatedState(onClick)
     BasicComponent(
@@ -55,7 +57,8 @@ fun SuperArrow(
         summaryColor = summaryColor,
         leftAction = leftAction,
         rightActions = { createRightActions(rightText) },
-        onClick = updatedOnClick
+        onClick = updatedOnClick,
+        enabled = enabled
     )
 }
 

miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperCheckbox.kt

@@ -81,7 +81,8 @@ fun SuperCheckbox(
                 isChecked = !isChecked
                 updatedOnCheckedChange?.invoke(isChecked)
             }
-        }
+        },
+        enabled = enabled
     )
 }
 

miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperDropdown.kt

@@ -90,6 +90,7 @@ expect fun modifierPlatform(modifier: Modifier, isHovered: MutableState<Boolean>
  * @param defaultWindowInsetsPadding Whether to apply default window insets padding to the [SuperDropdown].
  * @param selectedIndex The index of the selected option.
  * @param onSelectedIndexChange The callback when the index is selected.
+ * @param enabled Whether the [SuperDropdown] is enabled.
  */
 @Composable
 fun SuperDropdown(
@@ -103,7 +104,8 @@ fun SuperDropdown(
     insideMargin: DpSize = DpSize(16.dp, 16.dp),
     defaultWindowInsetsPadding: Boolean = true,
     selectedIndex: Int,
-    onSelectedIndexChange: (Int) -> Unit
+    onSelectedIndexChange: (Int) -> Unit,
+    enabled: Boolean = true
 ) {
     val hapticFeedback = LocalHapticFeedback.current
     val density = LocalDensity.current
@@ -157,7 +159,7 @@ fun SuperDropdown(
                         }
                     },
                     onTap = { offset ->
-                        isDropdownExpanded.value = true
+                        isDropdownExpanded.value = enabled
                         alignLeft = offset.x < (size.width / 2)
                     }
                 )
@@ -177,7 +179,7 @@ fun SuperDropdown(
                 modifier = Modifier.padding(end = 6.dp),
                 text = items[selectedIndex],
                 fontSize = 15.sp,
-                color = MiuixTheme.colorScheme.onSurfaceVariantActions,
+                color = if (enabled) MiuixTheme.colorScheme.onSurfaceVariantActions else MiuixTheme.colorScheme.disabledOnSecondaryVariant,
                 textAlign = TextAlign.End,
             )
             Image(
@@ -186,12 +188,13 @@ fun SuperDropdown(
                     .align(Alignment.CenterVertically),
                 imageVector = MiuixIcons.ArrowUpDown,
                 colorFilter = BlendModeColorFilter(
-                    MiuixTheme.colorScheme.onSurfaceVariantActions,
+                    if (enabled) MiuixTheme.colorScheme.onSurfaceVariantActions else MiuixTheme.colorScheme.disabledOnSecondaryVariant,
                     BlendMode.SrcIn
                 ),
                 contentDescription = null
             )
-        }
+        },
+        enabled = enabled
     )
     BackHandler(
         enabled = isDropdownExpanded.value

miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperSwitch.kt

@@ -72,6 +72,7 @@ fun SuperSwitch(
                 isChecked = !isChecked
                 updatedOnCheckedChange?.invoke(isChecked)
             }
-        }
+        },
+        enabled = enabled
     )
 }