diff --git a/composeApp/src/commonMain/kotlin/MainPage.kt b/composeApp/src/commonMain/kotlin/MainPage.kt
index 8fdd1a17..c023206d 100644
--- a/composeApp/src/commonMain/kotlin/MainPage.kt
+++ b/composeApp/src/commonMain/kotlin/MainPage.kt
@@ -65,7 +65,7 @@ fun MainPage(
                                 label = "Search",
                                 leadingIcon = {
                                     Icon(
-                                        modifier = Modifier.padding(horizontal = 16.dp),
+                                        modifier = Modifier.padding(start = 12.dp, end = 8.dp),
                                         imageVector = MiuixIcons.Search,
                                         tint = MiuixTheme.colorScheme.onSurfaceContainer,
                                         contentDescription = "Search"
diff --git a/composeApp/src/commonMain/kotlin/component/OtherComponent.kt b/composeApp/src/commonMain/kotlin/component/OtherComponent.kt
index 9585e1f9..ec7a49f8 100644
--- a/composeApp/src/commonMain/kotlin/component/OtherComponent.kt
+++ b/composeApp/src/commonMain/kotlin/component/OtherComponent.kt
@@ -19,7 +19,6 @@ import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.text.input.TextFieldValue
-import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import top.yukonga.miuix.kmp.basic.ButtonDefaults
@@ -141,7 +140,7 @@ fun OtherComponent(padding: PaddingValues) {
             .padding(horizontal = 12.dp)
             .padding(bottom = 12.dp),
         color = MiuixTheme.colorScheme.primaryVariant,
-        insideMargin = DpSize(16.dp, 16.dp)
+        insideMargin = PaddingValues(16.dp)
     ) {
         Text(
             color = MiuixTheme.colorScheme.onPrimary,
@@ -156,7 +155,7 @@ fun OtherComponent(padding: PaddingValues) {
             .fillMaxWidth()
             .padding(horizontal = 12.dp)
             .padding(bottom = 12.dp + padding.calculateBottomPadding()),
-        insideMargin = DpSize(16.dp, 16.dp)
+        insideMargin = PaddingValues(16.dp)
     ) {
         Text(
             color = MiuixTheme.colorScheme.onSurface,
diff --git a/composeApp/src/commonMain/kotlin/component/TextComponent.kt b/composeApp/src/commonMain/kotlin/component/TextComponent.kt
index eb819fc0..81730726 100644
--- a/composeApp/src/commonMain/kotlin/component/TextComponent.kt
+++ b/composeApp/src/commonMain/kotlin/component/TextComponent.kt
@@ -72,11 +72,14 @@ fun TextComponent() {
             title = "Title",
             summary = "Summary",
             leftAction = {
-                Text(text = "Left")
+                Text(
+                    text = "Left",
+                    modifier = Modifier.padding(end = 16.dp)
+                )
             },
             rightActions = {
                 Text(text = "Right1")
-                Spacer(Modifier.width(6.dp))
+                Spacer(Modifier.width(10.dp))
                 Text(text = "Right2")
             },
             onClick = {},
@@ -88,6 +91,7 @@ fun TextComponent() {
             leftAction = {
                 Text(
                     text = "Left",
+                    modifier = Modifier.padding(end = 16.dp),
                     color = MiuixTheme.colorScheme.disabledOnSecondaryVariant
                 )
             },
@@ -96,7 +100,7 @@ fun TextComponent() {
                     text = "Right1",
                     color = MiuixTheme.colorScheme.disabledOnSecondaryVariant
                 )
-                Spacer(Modifier.width(6.dp))
+                Spacer(Modifier.width(10.dp))
                 Text(
                     text = "Right2",
                     color = MiuixTheme.colorScheme.disabledOnSecondaryVariant
@@ -116,6 +120,7 @@ fun TextComponent() {
             leftAction = {
                 Box(
                     contentAlignment = Alignment.TopStart,
+                    modifier = Modifier.padding(end = 16.dp)
                 ) {
                     Icon(
                         imageVector = Icons.Rounded.AccountBox,
@@ -154,7 +159,7 @@ fun TextComponent() {
         Row(
             modifier = Modifier
                 .fillMaxWidth()
-                .padding(horizontal = 12.dp, vertical = 12.dp),
+                .padding(16.dp),
             horizontalArrangement = Arrangement.SpaceBetween
         ) {
             Checkbox(
@@ -186,7 +191,7 @@ fun TextComponent() {
             checked = miuixSuperRightCheckboxState,
             rightActions = {
                 Text(
-                    modifier = Modifier.padding(end = 6.dp),
+                    modifier = Modifier.padding(end = 10.dp),
                     text = miuixSuperRightCheckbox,
                     color = MiuixTheme.colorScheme.onSurfaceVariantActions
                 )
@@ -224,7 +229,7 @@ fun TextComponent() {
         Row(
             modifier = Modifier
                 .fillMaxWidth()
-                .padding(horizontal = 12.dp, vertical = 12.dp),
+                .padding(16.dp),
             horizontalArrangement = Arrangement.SpaceBetween
         ) {
             Switch(
diff --git a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Button.kt b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Button.kt
index 62a639c5..7b44bb59 100644
--- a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Button.kt
+++ b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Button.kt
@@ -1,6 +1,7 @@
 package top.yukonga.miuix.kmp.basic
 
 import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.defaultMinSize
@@ -15,7 +16,6 @@ import androidx.compose.ui.semantics.Role
 import androidx.compose.ui.semantics.role
 import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.unit.Dp
-import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.dp
 import top.yukonga.miuix.kmp.theme.MiuixTheme
 import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
@@ -42,7 +42,7 @@ fun Button(
     minWidth: Dp = ButtonDefaults.MinWidth,
     minHeight: Dp = ButtonDefaults.MinHeight,
     colors: ButtonColors = ButtonDefaults.buttonColors(),
-    insideMargin: DpSize = ButtonDefaults.InsideMargin,
+    insideMargin: PaddingValues = ButtonDefaults.InsideMargin,
     content: @Composable RowScope.() -> Unit
 ) {
     Surface(
@@ -57,7 +57,7 @@ fun Button(
         Row(
             Modifier
                 .defaultMinSize(minWidth = minWidth, minHeight = minHeight)
-                .padding(insideMargin.width, insideMargin.height),
+                .padding(insideMargin),
             horizontalArrangement = Arrangement.Center,
             verticalAlignment = Alignment.CenterVertically,
             content = content
@@ -88,7 +88,7 @@ fun TextButton(
     cornerRadius: Dp = ButtonDefaults.ConorRadius,
     minWidth: Dp = ButtonDefaults.MinWidth,
     minHeight: Dp = ButtonDefaults.MinHeight,
-    insideMargin: DpSize = ButtonDefaults.InsideMargin,
+    insideMargin: PaddingValues = ButtonDefaults.InsideMargin,
 ) {
     Surface(
         onClick = {
@@ -102,7 +102,7 @@ fun TextButton(
         Row(
             Modifier
                 .defaultMinSize(minWidth = minWidth, minHeight = minHeight)
-                .padding(insideMargin.width, insideMargin.height),
+                .padding(insideMargin),
             horizontalArrangement = Arrangement.Center,
             verticalAlignment = Alignment.CenterVertically,
             content = {
@@ -138,7 +138,7 @@ object ButtonDefaults {
     /**
      * The default inside margin applied for all buttons.
      */
-    val InsideMargin = DpSize(16.dp, 16.dp)
+    val InsideMargin = PaddingValues(16.dp)
 
     /**
      * The default [ButtonColors] for all buttons.
diff --git a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Card.kt b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Card.kt
index ede4af7e..34c3f4be 100644
--- a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Card.kt
+++ b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Card.kt
@@ -2,13 +2,13 @@ package top.yukonga.miuix.kmp.basic
 
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ColumnScope
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.Dp
-import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.dp
 import top.yukonga.miuix.kmp.theme.MiuixTheme
 import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
@@ -29,14 +29,11 @@ import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
 fun Card(
     modifier: Modifier = Modifier,
     cornerRadius: Dp = CardDefaults.ConorRadius,
-    insideMargin: DpSize = CardDefaults.InsideMargin,
+    insideMargin: PaddingValues = CardDefaults.InsideMargin,
     color: Color = CardDefaults.DefaultColor(),
     content: @Composable ColumnScope.() -> Unit
 ) {
     val shape = remember { SmoothRoundedCornerShape(cornerRadius) }
-    val paddingModifier = remember(insideMargin) {
-        Modifier.padding(vertical = insideMargin.height, horizontal = insideMargin.width)
-    }
 
     Surface(
         modifier = modifier,
@@ -44,7 +41,7 @@ fun Card(
         color = color,
     ) {
         Column(
-            modifier = paddingModifier,
+            modifier = Modifier.padding(insideMargin),
             content = content
         )
     }
@@ -60,7 +57,7 @@ object CardDefaults {
     /**
      * The default margin inside the [Card].
      */
-    val InsideMargin = DpSize(0.dp, 0.dp)
+    val InsideMargin = PaddingValues(0.dp)
 
     /**
      * The default color width of the [Card].
diff --git a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Component.kt b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Component.kt
index ccfec5e0..b14c09b9 100644
--- a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Component.kt
+++ b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Component.kt
@@ -5,6 +5,7 @@ import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -23,7 +24,6 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.input.pointer.PointerEventType
 import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.dp
 import top.yukonga.miuix.kmp.theme.MiuixTheme
 
@@ -45,7 +45,7 @@ import top.yukonga.miuix.kmp.theme.MiuixTheme
 @Composable
 fun BasicComponent(
     modifier: Modifier = Modifier,
-    insideMargin: DpSize = BasicComponentDefaults.InsideMargin,
+    insideMargin: PaddingValues = BasicComponentDefaults.InsideMargin,
     title: String? = null,
     titleColor: BasicComponentColors = BasicComponentDefaults.titleColor(),
     summary: String? = null,
@@ -80,19 +80,12 @@ fun BasicComponent(
             }
             .heightIn(min = 56.dp)
             .fillMaxWidth()
-            .padding(
-                horizontal = insideMargin.width,
-                vertical = insideMargin.height
-            ),
+            .padding(insideMargin),
         verticalAlignment = Alignment.CenterVertically,
         horizontalArrangement = Arrangement.SpaceBetween
     ) {
         leftAction?.let {
-            Box(
-                modifier = Modifier.padding(end = 16.dp)
-            ) {
-                it()
-            }
+            it()
         }
         Column(
             modifier = Modifier.weight(1f)
@@ -130,7 +123,7 @@ object BasicComponentDefaults {
     /**
      * The default margin inside the [BasicComponent].
      */
-    val InsideMargin = DpSize(16.dp, 16.dp)
+    val InsideMargin = PaddingValues(16.dp)
 
     /**
      * The default color of the title.
diff --git a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Scaffold.kt b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Scaffold.kt
index 56ab6444..303a6f8c 100644
--- a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Scaffold.kt
+++ b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/Scaffold.kt
@@ -29,6 +29,7 @@ import androidx.compose.ui.util.fastMap
 import androidx.compose.ui.util.fastMapNotNull
 import androidx.compose.ui.util.fastMaxBy
 import top.yukonga.miuix.kmp.theme.MiuixTheme
+import top.yukonga.miuix.kmp.utils.MiuixPopupUtil
 import top.yukonga.miuix.kmp.utils.MiuixPopupUtil.Companion.MiuixPopupHost
 
 /**
@@ -45,6 +46,8 @@ import top.yukonga.miuix.kmp.utils.MiuixPopupUtil.Companion.MiuixPopupHost
  * @param floatingActionButtonPosition position of the floating action button.
  * @param snackbarHost component to host [Snackbar]s that are pushed to be shown via
  *   [SnackbarHostState.showSnackbar], typically a [SnackbarHost].
+ * @param popupHost component to host [SuperDropdown]s & [SuperDialog]s that are pushed to be shown via
+ *   [MiuixPopupUtil.showPopup] & [MiuixPopupUtil.showDialog], typically a [MiuixPopupHost].
  * @param containerColor the color used for the background of this scaffold. Use [Color.Transparent]
  *   to have no color.
  * @param contentWindowInsets window insets to be passed to [content] slot via [PaddingValues]
@@ -65,6 +68,7 @@ fun Scaffold(
     floatingActionButton: @Composable () -> Unit = {},
     floatingActionButtonPosition: MiuixFabPosition = MiuixFabPosition.End,
     snackbarHost: @Composable () -> Unit = {},
+    popupHost: @Composable () -> Unit = { MiuixPopupHost() },
     containerColor: Color = MiuixTheme.colorScheme.background,
     contentWindowInsets: WindowInsets = WindowInsets.statusBars,
     content: @Composable (PaddingValues) -> Unit
@@ -91,7 +95,7 @@ fun Scaffold(
             snackbar = snackbarHost,
             fab = floatingActionButton,
             fabPosition = floatingActionButtonPosition,
-            popup = { MiuixPopupHost() },
+            popup = popupHost,
             contentWindowInsets = safeInsets,
         )
     }
diff --git a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/SearchBar.kt b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/SearchBar.kt
index e731956a..a7bfe635 100644
--- a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/SearchBar.kt
+++ b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/SearchBar.kt
@@ -129,7 +129,7 @@ fun InputField(
     val interactionSource = interactionSource ?: remember { MutableInteractionSource() }
 
     val paddingModifier = remember(insideMargin, leadingIcon, trailingIcon) {
-        if (leadingIcon == null && trailingIcon == null) Modifier.padding(insideMargin.width, vertical = insideMargin.height)
+        if (leadingIcon == null && trailingIcon == null) Modifier.padding(horizontal = insideMargin.width, vertical = insideMargin.height)
         else if (leadingIcon == null) Modifier.padding(start = insideMargin.width).padding(vertical = insideMargin.height)
         else if (trailingIcon == null) Modifier.padding(end = insideMargin.width).padding(vertical = insideMargin.height)
         else Modifier.padding(vertical = insideMargin.height)
diff --git a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/SmallTitle.kt b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/SmallTitle.kt
index c35ad4d7..1fc89049 100644
--- a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/SmallTitle.kt
+++ b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/SmallTitle.kt
@@ -1,12 +1,12 @@
 package top.yukonga.miuix.kmp.basic
 
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.dp
 import top.yukonga.miuix.kmp.theme.MiuixTheme
 
@@ -23,10 +23,10 @@ fun SmallTitle(
     text: String,
     modifier: Modifier = Modifier,
     textColor: Color = MiuixTheme.colorScheme.onBackgroundVariant,
-    insideMargin: DpSize = DpSize(28.dp, 8.dp)
+    insideMargin: PaddingValues = PaddingValues(28.dp, 8.dp)
 ) {
     val paddingModifier = remember(insideMargin) {
-        Modifier.padding(horizontal = insideMargin.width, vertical = insideMargin.height)
+        Modifier.padding(insideMargin)
     }
     Text(
         modifier = modifier.then(paddingModifier),
diff --git a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperArrow.kt b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperArrow.kt
index 7d50d4c7..7a3ebde6 100644
--- a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperArrow.kt
+++ b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperArrow.kt
@@ -1,6 +1,7 @@
 package top.yukonga.miuix.kmp.extra
 
 import androidx.compose.foundation.Image
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.runtime.Composable
@@ -12,7 +13,6 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.text.style.TextAlign
-import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.dp
 import top.yukonga.miuix.kmp.basic.BasicComponent
 import top.yukonga.miuix.kmp.basic.BasicComponentColors
@@ -48,7 +48,7 @@ fun SuperArrow(
     rightText: String? = null,
     rightActionColor: RightActionColors = SuperArrowDefaults.rightActionColors(),
     onClick: (() -> Unit)? = null,
-    insideMargin: DpSize = BasicComponentDefaults.InsideMargin,
+    insideMargin: PaddingValues = BasicComponentDefaults.InsideMargin,
     enabled: Boolean = true
 ) {
     val updatedOnClick by rememberUpdatedState(onClick)
diff --git a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperCheckbox.kt b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperCheckbox.kt
index 37d36949..51828cf6 100644
--- a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperCheckbox.kt
+++ b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperCheckbox.kt
@@ -1,6 +1,8 @@
 package top.yukonga.miuix.kmp.extra
 
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.RowScope
+import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -8,7 +10,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberUpdatedState
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.unit.DpSize
+import androidx.compose.ui.unit.dp
 import top.yukonga.miuix.kmp.basic.BasicComponent
 import top.yukonga.miuix.kmp.basic.BasicComponentColors
 import top.yukonga.miuix.kmp.basic.BasicComponentDefaults
@@ -43,7 +45,7 @@ fun SuperCheckbox(
     checkboxColors: CheckboxColors = CheckboxDefaults.checkboxColors(),
     rightActions: @Composable RowScope.() -> Unit = {},
     checkboxLocation: CheckboxLocation = CheckboxLocation.Left,
-    insideMargin: DpSize = BasicComponentDefaults.InsideMargin,
+    insideMargin: PaddingValues = BasicComponentDefaults.InsideMargin,
     enabled: Boolean = true
 ) {
     var isChecked by remember { mutableStateOf(checked) }
@@ -61,6 +63,7 @@ fun SuperCheckbox(
         leftAction = if (checkboxLocation == CheckboxLocation.Left) {
             {
                 Checkbox(
+                    modifier = Modifier.padding(end = 16.dp),
                     checked = isChecked,
                     onCheckedChange = updatedOnCheckedChange,
                     enabled = enabled,
diff --git a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperDropdown.kt b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperDropdown.kt
index 1201231c..8cc476d5 100644
--- a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperDropdown.kt
+++ b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperDropdown.kt
@@ -6,6 +6,7 @@ import androidx.compose.foundation.clickable
 import androidx.compose.foundation.gestures.detectTapGestures
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.WindowInsetsSides
@@ -57,7 +58,6 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.rememberTextMeasurer
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.Dp
-import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.LayoutDirection
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
@@ -77,6 +77,7 @@ import top.yukonga.miuix.kmp.utils.MiuixPopupUtil.Companion.dismissPopup
 import top.yukonga.miuix.kmp.utils.MiuixPopupUtil.Companion.showPopup
 import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
 import top.yukonga.miuix.kmp.utils.getWindowSize
+import kotlin.math.max
 import kotlin.math.roundToInt
 
 /**
@@ -110,7 +111,7 @@ fun SuperDropdown(
     summaryColor: BasicComponentColors = BasicComponentDefaults.summaryColor(),
     alwaysRight: Boolean = false,
     horizontalPadding: Dp = 0.dp,
-    insideMargin: DpSize = BasicComponentDefaults.InsideMargin,
+    insideMargin: PaddingValues = BasicComponentDefaults.InsideMargin,
     defaultWindowInsetsPadding: Boolean = true,
     enabled: Boolean = true
 ) {
@@ -231,8 +232,18 @@ fun SuperDropdown(
         val dropdownElevation by rememberUpdatedState(with(density) {
             11.dp.toPx()
         })
-        val insideWidthPx by rememberUpdatedState(with(density) { insideMargin.width.toPx() }.roundToInt())
-        val insideHeightPx by rememberUpdatedState(with(density) { insideMargin.height.toPx() }.roundToInt())
+        val insideLeftPx by rememberUpdatedState(with(density) {
+            insideMargin.calculateLeftPadding(LayoutDirection.Ltr).toPx()
+        }.roundToInt())
+        val insideRightPx by rememberUpdatedState(with(density) {
+            insideMargin.calculateRightPadding(LayoutDirection.Ltr).toPx()
+        }.roundToInt())
+        val insideTopPx by rememberUpdatedState(with(density) {
+            insideMargin.calculateTopPadding().toPx()
+        }.roundToInt())
+        val insideBottomPx by rememberUpdatedState(with(density) {
+            insideMargin.calculateBottomPadding().toPx()
+        }.roundToInt())
         val displayCutoutLeftSize = rememberUpdatedState(with(density) {
             WindowInsets.displayCutout.asPaddingValues(density).calculateLeftPadding(LayoutDirection.Ltr).toPx()
         }.roundToInt())
@@ -265,16 +276,17 @@ fun SuperDropdown(
                         modifier = Modifier
                             .onGloballyPositioned { layoutCoordinates ->
                                 offsetXPx = if (alwaysRight || !alignLeft) {
-                                    dropdownOffsetXPx + componentWidthPx - insideWidthPx - layoutCoordinates.size.width - paddingPx - if (defaultWindowInsetsPadding) displayCutoutLeftSize.value else 0
+                                    dropdownOffsetXPx + componentWidthPx - insideRightPx - layoutCoordinates.size.width - paddingPx - if (defaultWindowInsetsPadding) displayCutoutLeftSize.value else 0
                                 } else {
-                                    dropdownOffsetXPx + paddingPx + insideWidthPx - if (defaultWindowInsetsPadding) displayCutoutLeftSize.value else 0
+                                    dropdownOffsetXPx + paddingPx + insideLeftPx - if (defaultWindowInsetsPadding) displayCutoutLeftSize.value else 0
                                 }
                                 offsetYPx = calculateOffsetYPx(
                                     windowHeightPx,
                                     dropdownOffsetYPx,
                                     layoutCoordinates.size.height,
                                     componentHeightPx,
-                                    insideHeightPx,
+                                    insideTopPx,
+                                    insideBottomPx,
                                     statusBarPx,
                                     navigationBarPx,
                                     captionBarPx
@@ -385,7 +397,8 @@ fun DropdownImpl(
  * @param dropdownOffsetPx The default offset of the dropdown.
  * @param dropdownHeightPx The height of the dropdown.
  * @param componentHeightPx The height of the component.
- * @param insideHeightPx The height of the component inside.
+ * @param insideTopHeightPx The height of the top component inside.
+ * @param insideBottomHeightPx The height of the bottom component inside.
  * @param statusBarPx The height of the status bar padding.
  * @param navigationBarPx The height of the navigation bar padding.
  * @param captionBarPx The height of the caption bar padding.
@@ -396,25 +409,29 @@ fun calculateOffsetYPx(
     dropdownOffsetPx: Int,
     dropdownHeightPx: Int,
     componentHeightPx: Int,
-    insideHeightPx: Int,
+    insideTopHeightPx: Int,
+    insideBottomHeightPx: Int,
     statusBarPx: Int,
     navigationBarPx: Int,
     captionBarPx: Int
 ): Int {
     return if (windowHeightPx - captionBarPx - navigationBarPx - dropdownOffsetPx - componentHeightPx > dropdownHeightPx) {
         // Show below
-        dropdownOffsetPx + componentHeightPx - insideHeightPx / 2
+        dropdownOffsetPx + componentHeightPx - insideBottomHeightPx / 2
     } else if (dropdownOffsetPx - statusBarPx > dropdownHeightPx) {
         // Show above
-        dropdownOffsetPx - dropdownHeightPx + insideHeightPx / 2
+        dropdownOffsetPx - dropdownHeightPx + insideTopHeightPx / 2
     } else if (windowHeightPx - statusBarPx - captionBarPx - navigationBarPx <= dropdownHeightPx) {
         // Special handling when the height of the popup is maxsize (== windowHeightPx)
         statusBarPx
-    } else if (windowHeightPx - dropdownOffsetPx < dropdownHeightPx / 2 + captionBarPx + navigationBarPx + insideHeightPx + componentHeightPx / 2) {
-        windowHeightPx - dropdownHeightPx - insideHeightPx - captionBarPx - navigationBarPx
     } else {
-        val offset = dropdownOffsetPx - dropdownHeightPx / 2 + componentHeightPx / 2
-        if (offset > insideHeightPx + statusBarPx) offset else insideHeightPx + statusBarPx
+        val maxInsideHeight = max(insideTopHeightPx, insideBottomHeightPx)
+        if (windowHeightPx - dropdownOffsetPx < dropdownHeightPx / 2 + captionBarPx + navigationBarPx + maxInsideHeight + componentHeightPx / 2) {
+            windowHeightPx - dropdownHeightPx - maxInsideHeight - captionBarPx - navigationBarPx
+        } else {
+            val offset = dropdownOffsetPx - dropdownHeightPx / 2 + componentHeightPx / 2
+            if (offset > maxInsideHeight + statusBarPx) offset else maxInsideHeight + statusBarPx
+        }
     }
 }
 
diff --git a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperSwitch.kt b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperSwitch.kt
index 042c7589..dfa51481 100644
--- a/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperSwitch.kt
+++ b/miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperSwitch.kt
@@ -1,5 +1,6 @@
 package top.yukonga.miuix.kmp.extra
 
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -10,7 +11,6 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.hapticfeedback.HapticFeedbackType
 import androidx.compose.ui.platform.LocalHapticFeedback
-import androidx.compose.ui.unit.DpSize
 import top.yukonga.miuix.kmp.basic.BasicComponent
 import top.yukonga.miuix.kmp.basic.BasicComponentColors
 import top.yukonga.miuix.kmp.basic.BasicComponentDefaults
@@ -46,7 +46,7 @@ fun SuperSwitch(
     switchColors: SwitchColors = SwitchDefaults.switchColors(),
     leftAction: @Composable (() -> Unit)? = null,
     rightActions: @Composable RowScope.() -> Unit = {},
-    insideMargin: DpSize = BasicComponentDefaults.InsideMargin,
+    insideMargin: PaddingValues = BasicComponentDefaults.InsideMargin,
     enabled: Boolean = true
 ) {
     var isChecked by remember { mutableStateOf(checked) }