feat(ui): update MillenniumModalBottomSheet with compact padding and spacing adjustments

composeApp/src/commonMain/kotlin/dev/krtirtho/spotube/core/ui/component/AdaptiveDialogBottomSheet.kt

@@ -40,7 +40,6 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.padding
 import com.composeunstyled.SheetDetent
 import com.composeunstyled.rememberModalBottomSheetState
 import androidx.compose.runtime.Composable
@@ -94,10 +93,7 @@ fun AdaptiveDialogBottomSheet(
         }
         MillenniumModalBottomSheet(state = sheetState) {
             Column(
-                modifier = Modifier
-                    .fillMaxWidth()
-                    .padding(horizontal = 16.dp)
-                    .padding(top = 16.dp),
+                modifier = Modifier.fillMaxWidth(),
                 horizontalAlignment = Alignment.Start) {
                 title?.let {
                     Row(
@@ -130,7 +126,6 @@ fun AdaptiveDialogBottomSheet(
                     it()
                 }
             }
-            Spacer(Modifier.height(24.dp))
         }
     }
 }

composeApp/src/commonMain/kotlin/dev/krtirtho/spotube/core/ui/component/AdaptiveDropdownBottomSheet.kt

@@ -22,6 +22,7 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.widthIn
@@ -165,7 +166,10 @@ private fun AdaptiveBottomSheetContent(
             onDismiss()
         }
     }
-    MillenniumModalBottomSheet(state = sheetState) {
+    MillenniumModalBottomSheet(
+        state = sheetState,
+        contentPadding = PaddingValues(top = 10.dp, bottom = 8.dp),
+        contentSpacing = 4.dp) {
         Column(
             modifier = Modifier.fillMaxWidth()) {
             header?.invoke()

composeApp/src/commonMain/kotlin/dev/krtirtho/spotube/core/ui/component/TrackOptions.kt

@@ -30,6 +30,7 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 
@@ -144,7 +145,10 @@ fun TrackOptionsBottomSheet(
             onDismiss()
         }
     }
-    MillenniumModalBottomSheet(state = sheetState) {
+    MillenniumModalBottomSheet(
+        state = sheetState,
+        contentPadding = PaddingValues(top = 10.dp, bottom = 8.dp),
+        contentSpacing = 4.dp) {
         Column(modifier = Modifier.fillMaxWidth()) {
             TrackOptionsSheetHeader(track = track)
 

composeApp/src/commonMain/kotlin/dev/krtirtho/spotube/core/ui/theming/AppTheme.kt

@@ -18,6 +18,7 @@
 package dev.krtirtho.spotube.core.ui.theming
 
 import androidx.compose.foundation.isSystemInDarkTheme
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
@@ -35,9 +36,11 @@ import androidx.compose.ui.unit.sp
 
 import dev.krtirtho.spotube.modules.settings.Theme
 import dev.krtirtho.spotube.modules.settings.UserSettings
+import org.spotube.millennium.composables.MillenniumModalBottomSheetTheme
 import org.spotube.millennium.composables.MillenniumTooltipHost
 import org.spotube.millennium.composables.MillenniumTopAppBarTheme
 import org.spotube.millennium.composables.MillenniumTopAppBarThemeProperties
+import org.spotube.millennium.composables.defaultMillenniumModalBottomSheetTheme
 import org.spotube.millennium.composables.defaultMillenniumTopAppBarTheme
 import org.spotube.millennium.theme.MillenniumColors
 import org.spotube.millennium.theme.MillenniumDarkThemeComponents
@@ -218,14 +221,16 @@ fun SpotubeTheme(
                     properties = darkTheme.topAppBarTheme.properties.copy(
                         separatorColor = Color.Transparent
                     )
-                )
+                ),
+                modalBottomSheetTheme = compactModalBottomSheetTheme()
             ),
             light = lightTheme.copy(
                 topAppBarTheme = MillenniumTopAppBarTheme(
                     properties = lightTheme.topAppBarTheme.properties.copy(
                         separatorColor = Color.Transparent
                     )
-                )
+                ),
+                modalBottomSheetTheme = compactModalBottomSheetTheme()
             )
         )
     ) {
@@ -241,6 +246,23 @@ fun SpotubeTheme(
     }
 }
 
+/** Library default is 24dp padding + 16dp spacing, which is far too roomy on phones. */
+private fun compactModalBottomSheetTheme(): MillenniumModalBottomSheetTheme {
+    val padding = PaddingValues(start = 16.dp, end = 16.dp, top = 10.dp, bottom = 8.dp)
+    fun org.spotube.millennium.composables.MillenniumModalBottomSheetThemeProperties.compact() =
+        copy(contentPadding = padding, contentSpacing = 8.dp)
+    val states = defaultMillenniumModalBottomSheetTheme().states
+    return MillenniumModalBottomSheetTheme(
+        states = org.spotube.millennium.theme.MillenniumControlStateProperty(
+            default = states.default.compact(),
+            hovered = states.hovered.compact(),
+            focused = states.focused.compact(),
+            pressed = states.pressed.compact(),
+            disabled = states.disabled.compact(),
+            selected = states.selected.compact(),
+            error = states.error.compact()))
+}
+
 /** Whether the active Millennium appearance is light. */
 @Composable
 fun isLightAppearance(): Boolean = MillenniumTheme.colors.background.luminance() > 0.5f

composeApp/src/commonMain/kotlin/dev/krtirtho/spotube/modules/shell/AppExpandedPlayer.kt

@@ -289,7 +289,8 @@ fun AppExpandedPlayer(
         if (playerOptionsUiState.isMoreOptionsSheetOpen) {
             MillenniumModalBottomSheet(
                 state = moreOptionsSheetState,
-                contentPadding = PaddingValues(horizontal = 0.dp, vertical = 8.dp)
+                contentPadding = PaddingValues(horizontal = 0.dp, vertical = 8.dp),
+                contentSpacing = 4.dp
             ) {
                 // Grid of Options
                 LazyVerticalGrid(

composeApp/src/commonMain/kotlin/dev/krtirtho/spotube/modules/shell/player_queue/QueueSheet.kt

@@ -99,7 +99,8 @@ internal fun BottomSheetContent(
     }
     MillenniumModalBottomSheet(
         state = sheetState,
-        contentPadding = PaddingValues(horizontal = 12.dp, vertical = 8.dp)
+        contentPadding = PaddingValues(horizontal = 12.dp, vertical = 8.dp),
+        contentSpacing = 8.dp
     ) {
         content()
     }