🚀 Improve Settings' animations

* Smoother expanding/collapsing animation

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/appearance/components/settings/ColorPresetSetting.kt

@@ -21,7 +21,6 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.foundation.lazy.LazyRow
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.text.BasicTextField
@@ -78,7 +77,7 @@ import ua.acclorite.book_story.presentation.ui.Transitions
  */
 @OptIn(ExperimentalFoundationApi::class)
 @Composable
-fun LazyItemScope.ColorPresetSetting(
+fun ColorPresetSetting(
     state: State<SettingsState>,
     onEvent: (SettingsEvent) -> Unit,
     backgroundColor: Color,
@@ -96,7 +95,6 @@ fun LazyItemScope.ColorPresetSetting(
 
     Column(
         Modifier
-            .animateItem()
             .fillMaxWidth()
             .padding(vertical = verticalPadding)
     ) {

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/appearance/components/settings/DarkThemeSetting.kt

@@ -1,10 +1,8 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.appearance.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.domain.model.ButtonItem
@@ -18,13 +16,12 @@ import ua.acclorite.book_story.presentation.ui.DarkTheme
  * If true, dark theme applied to the app's theme.
  */
 @Composable
-fun LazyItemScope.DarkThemeSetting(
+fun DarkThemeSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SegmentedButtonWithTitle(
         title = stringResource(id = R.string.dark_theme_option),
-        modifier = Modifier.animateItem(),
         buttons = DarkTheme.entries.map {
             ButtonItem(
                 it.toString(),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/appearance/components/settings/FastColorPresetChangeSetting.kt

@@ -1,9 +1,7 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.appearance.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
@@ -15,13 +13,12 @@ import ua.acclorite.book_story.presentation.screens.settings.components.SwitchWi
  * If true, user can fast change color presets in Reader with swipes.
  */
 @Composable
-fun LazyItemScope.FastColorPresetChangeSetting(
+fun FastColorPresetChangeSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SwitchWithTitle(
         selected = state.value.fastColorPresetChange!!,
-        modifier = Modifier.animateItem(),
         title = stringResource(id = R.string.fast_color_preset_change_option),
         description = stringResource(id = R.string.fast_color_preset_change_option_desc),
         onClick = {

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/appearance/components/settings/PureDarkSetting.kt

@@ -1,18 +1,16 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.appearance.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.domain.model.ButtonItem
 import ua.acclorite.book_story.presentation.data.MainEvent
 import ua.acclorite.book_story.presentation.data.MainState
 import ua.acclorite.book_story.presentation.screens.settings.components.SegmentedButtonWithTitle
+import ua.acclorite.book_story.presentation.ui.ExpandingTransition
 import ua.acclorite.book_story.presentation.ui.PureDark
-import ua.acclorite.book_story.presentation.ui.SlidingTransition
 import ua.acclorite.book_story.presentation.ui.isDark
 
 /**
@@ -20,17 +18,11 @@ import ua.acclorite.book_story.presentation.ui.isDark
  * If true, enables Pure Dark (OLED) theme.
  */
 @Composable
-fun LazyItemScope.PureDarkSetting(
+fun PureDarkSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
-    SlidingTransition(
+    ExpandingTransition(visible = state.value.darkTheme!!.isDark()) {
-        modifier = Modifier.animateItem(
-            fadeInSpec = null,
-            fadeOutSpec = null
-        ),
-        visible = state.value.darkTheme!!.isDark(),
-    ) {
         SegmentedButtonWithTitle(
             title = stringResource(id = R.string.pure_dark_option),
             buttons = PureDark.entries.map {

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/appearance/components/settings/ThemeContrastSetting.kt

@@ -1,13 +1,11 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.appearance.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.State
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
@@ -16,7 +14,7 @@ import ua.acclorite.book_story.presentation.data.MainEvent
 import ua.acclorite.book_story.presentation.data.MainState
 import ua.acclorite.book_story.presentation.screens.settings.components.SegmentedButtonWithTitle
 import ua.acclorite.book_story.presentation.ui.BookStoryTheme
-import ua.acclorite.book_story.presentation.ui.SlidingTransition
+import ua.acclorite.book_story.presentation.ui.ExpandingTransition
 import ua.acclorite.book_story.presentation.ui.Theme
 import ua.acclorite.book_story.presentation.ui.ThemeContrast
 import ua.acclorite.book_story.presentation.ui.isDark
@@ -27,7 +25,7 @@ import ua.acclorite.book_story.presentation.ui.isPureDark
  * Lets user change theme contrast levels.
  */
 @Composable
-fun LazyItemScope.ThemeContrastSetting(
+fun ThemeContrastSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
@@ -45,13 +43,7 @@ fun LazyItemScope.ThemeContrastSetting(
         isPureDark = state.value.pureDark!!.isPureDark(context = LocalContext.current),
         themeContrast = state.value.themeContrast!!
     ) {
-        SlidingTransition(
+        ExpandingTransition(visible = state.value.theme != Theme.DYNAMIC) {
-            modifier = Modifier.animateItem(
-                fadeInSpec = null,
-                fadeOutSpec = null
-            ),
-            visible = state.value.theme != Theme.DYNAMIC,
-        ) {
             SegmentedButtonWithTitle(
                 title = stringResource(id = R.string.theme_contrast_option),
                 enabled = state.value.theme != Theme.DYNAMIC,

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/appearance/components/settings/ThemeSetting.kt

@@ -18,7 +18,6 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.foundation.lazy.LazyRow
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
@@ -57,7 +56,7 @@ import ua.acclorite.book_story.presentation.ui.isPureDark
  * Lets user change app's theme from available in [Constants.THEMES].
  */
 @Composable
-fun LazyItemScope.ThemeSetting(
+fun ThemeSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit,
     verticalPadding: Dp = 8.dp,
@@ -70,7 +69,6 @@ fun LazyItemScope.ThemeSetting(
 
     Column(
         Modifier
-            .animateItem()
             .fillMaxWidth()
             .padding(vertical = verticalPadding)
     ) {

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/appearance/components/subcategories/ColorsSubcategory.kt

@@ -46,7 +46,6 @@ fun LazyListScope.ColorsSubcategory(
                 title = title.invoke(),
                 color = titleColor.invoke(),
                 modifier = Modifier
-                    .animateItem()
                     .padding(
                         top = topPadding,
                         bottom = 8.dp
@@ -54,9 +53,7 @@ fun LazyListScope.ColorsSubcategory(
             )
         } else {
             Spacer(
-                modifier = Modifier
+                modifier = Modifier.height((topPadding - 8.dp).coerceAtLeast(0.dp))
-                    .animateItem()
-                    .height((topPadding - 8.dp).coerceAtLeast(0.dp))
             )
         }
     }
@@ -78,9 +75,7 @@ fun LazyListScope.ColorsSubcategory(
 
     item {
         Spacer(
-            modifier = Modifier
+            modifier = Modifier.height(bottomPadding)
-                .animateItem()
-                .height(bottomPadding)
         )
     }
 }

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/appearance/components/subcategories/ThemePreferencesSubcategory.kt

@@ -43,7 +43,6 @@ fun LazyListScope.ThemePreferencesSubcategory(
                 title = title.invoke(),
                 color = titleColor.invoke(),
                 modifier = Modifier
-                    .animateItem()
                     .padding(
                         top = topPadding,
                         bottom = 8.dp
@@ -51,9 +50,7 @@ fun LazyListScope.ThemePreferencesSubcategory(
             )
         } else {
             Spacer(
-                modifier = Modifier
+                modifier = Modifier.height((topPadding - 8.dp).coerceAtLeast(0.dp))
-                    .animateItem()
-                    .height((topPadding - 8.dp).coerceAtLeast(0.dp))
             )
         }
     }
@@ -88,9 +85,7 @@ fun LazyListScope.ThemePreferencesSubcategory(
 
     item {
         Spacer(
-            modifier = Modifier
+            modifier = Modifier.height(bottomPadding)
-                .animateItem()
-                .height(bottomPadding)
         )
     }
 }

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/browse/components/settings/BrowseFilesStructureSetting.kt

@@ -1,10 +1,8 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.browse.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.domain.model.ButtonItem
@@ -18,13 +16,12 @@ import ua.acclorite.book_story.presentation.screens.settings.nested.browse.data.
  * Lets user choose between all and folders structure for Browse.
  */
 @Composable
-fun LazyItemScope.BrowseFilesStructureSetting(
+fun BrowseFilesStructureSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SegmentedButtonWithTitle(
         title = stringResource(id = R.string.browse_files_structure_option),
-        modifier = Modifier.animateItem(),
         buttons = BrowseFilesStructure.entries.map {
             ButtonItem(
                 it.toString(),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/browse/components/settings/BrowseFilterSetting.kt

@@ -8,7 +8,6 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.foundation.lazy.LazyListScope
 import androidx.compose.material3.Checkbox
 import androidx.compose.material3.MaterialTheme
@@ -55,14 +54,13 @@ fun LazyListScope.BrowseFilterSetting(
  * @param onClick OnClick callback.
  */
 @Composable
-private fun LazyItemScope.FilterItem(
+private fun FilterItem(
     item: String,
     isSelected: Boolean,
     onClick: () -> Unit
 ) {
     Row(
         modifier = Modifier
-            .animateItem()
             .fillMaxWidth()
             .clickable {
                 onClick()

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/browse/components/settings/BrowseGridSizeSetting.kt

@@ -1,39 +1,30 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.browse.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
 import ua.acclorite.book_story.presentation.data.MainState
 import ua.acclorite.book_story.presentation.screens.settings.components.SliderWithTitle
 import ua.acclorite.book_story.presentation.screens.settings.nested.browse.data.BrowseLayout
-import ua.acclorite.book_story.presentation.ui.SlidingTransition
+import ua.acclorite.book_story.presentation.ui.ExpandingTransition
 
 /**
  * Browse Grid Size setting.
  * Lets user specify grid size to be displayed.
  */
 @Composable
-fun LazyItemScope.BrowseGridSizeSetting(
+fun BrowseGridSizeSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
-    SlidingTransition(
+    ExpandingTransition(visible = state.value.browseLayout == BrowseLayout.GRID) {
-        modifier = Modifier.animateItem(
-            fadeInSpec = null,
-            fadeOutSpec = null
-        ),
-        visible = state.value.browseLayout == BrowseLayout.GRID,
-    ) {
         SliderWithTitle(
             value = state.value.browseGridSize!!
                     to " ${stringResource(R.string.browse_grid_size_per_row)}",
             valuePlaceholder = stringResource(id = R.string.browse_grid_size_auto),
             showPlaceholder = state.value.browseAutoGridSize!!,
-            modifier = Modifier.animateItem(),
             fromValue = 0,
             toValue = 10,
             title = stringResource(id = R.string.browse_grid_size_option),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/browse/components/settings/BrowseLayoutSetting.kt

@@ -1,10 +1,8 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.browse.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.domain.model.ButtonItem
@@ -18,13 +16,12 @@ import ua.acclorite.book_story.presentation.screens.settings.nested.browse.data.
  * Lets user choose between layouts(list, grid).
  */
 @Composable
-fun LazyItemScope.BrowseLayoutSetting(
+fun BrowseLayoutSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SegmentedButtonWithTitle(
         title = stringResource(id = R.string.browse_layout_option),
-        modifier = Modifier.animateItem(),
         buttons = BrowseLayout.entries.map {
             ButtonItem(
                 it.toString(),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/browse/components/settings/BrowsePinFavoriteDirectoriesSetting.kt

@@ -1,33 +1,25 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.browse.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
 import ua.acclorite.book_story.presentation.data.MainState
 import ua.acclorite.book_story.presentation.screens.settings.components.SwitchWithTitle
 import ua.acclorite.book_story.presentation.screens.settings.nested.browse.data.BrowseFilesStructure
-import ua.acclorite.book_story.presentation.ui.SlidingTransition
+import ua.acclorite.book_story.presentation.ui.ExpandingTransition
 
 /**
  * Browse Pin Favorite Directories setting.
  * If true, shows all favorite directories in root directory and moves them to the top in nested directories.
  */
 @Composable
-fun LazyItemScope.BrowsePinFavoriteDirectoriesSetting(
+fun BrowsePinFavoriteDirectoriesSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
-    SlidingTransition(
+    ExpandingTransition(visible = state.value.browseFilesStructure == BrowseFilesStructure.DIRECTORIES) {
-        modifier = Modifier.animateItem(
-            fadeInSpec = null,
-            fadeOutSpec = null
-        ),
-        visible = state.value.browseFilesStructure == BrowseFilesStructure.DIRECTORIES
-    ) {
         SwitchWithTitle(
             selected = state.value.browsePinFavoriteDirectories!!,
             title = stringResource(id = R.string.browse_pin_favorite_directories_option),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/browse/components/settings/BrowseSortOrderSetting.kt

@@ -9,7 +9,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.foundation.lazy.LazyListScope
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ArrowDownward
@@ -69,7 +68,7 @@ fun LazyListScope.BrowseSortOrderSetting(
  * @param onClick OnClick callback.
  */
 @Composable
-private fun LazyItemScope.SortItem(
+private fun SortItem(
     item: BrowseSortOrder,
     isSelected: Boolean,
     isDescending: Boolean,
@@ -77,7 +76,6 @@ private fun LazyItemScope.SortItem(
 ) {
     Row(
         modifier = Modifier
-            .animateItem()
             .fillMaxWidth()
             .clickable {
                 onClick()

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/browse/components/subcategories/BrowseFilterSubcategory.kt

@@ -40,7 +40,6 @@ fun LazyListScope.BrowseFilterSubcategory(
                 title = title.invoke(),
                 color = titleColor.invoke(),
                 modifier = Modifier
-                    .animateItem()
                     .padding(
                         top = topPadding,
                         bottom = 8.dp
@@ -48,9 +47,7 @@ fun LazyListScope.BrowseFilterSubcategory(
             )
         } else {
             Spacer(
-                modifier = Modifier
+                modifier = Modifier.height((topPadding - 8.dp).coerceAtLeast(0.dp))
-                    .animateItem()
-                    .height((topPadding - 8.dp).coerceAtLeast(0.dp))
             )
         }
     }
@@ -62,9 +59,7 @@ fun LazyListScope.BrowseFilterSubcategory(
 
     item {
         Spacer(
-            modifier = Modifier
+            modifier = Modifier.height(bottomPadding)
-                .animateItem()
-                .height(bottomPadding)
         )
     }
 }

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/browse/components/subcategories/BrowseGeneralSubcategory.kt

@@ -43,7 +43,6 @@ fun LazyListScope.BrowseGeneralSubcategory(
                 title = title.invoke(),
                 color = titleColor.invoke(),
                 modifier = Modifier
-                    .animateItem()
                     .padding(
                         top = topPadding,
                         bottom = 8.dp
@@ -51,9 +50,7 @@ fun LazyListScope.BrowseGeneralSubcategory(
             )
         } else {
             Spacer(
-                modifier = Modifier
+                modifier = Modifier.height((topPadding - 8.dp).coerceAtLeast(0.dp))
-                    .animateItem()
-                    .height((topPadding - 8.dp).coerceAtLeast(0.dp))
             )
         }
     }
@@ -88,9 +85,7 @@ fun LazyListScope.BrowseGeneralSubcategory(
 
     item {
         Spacer(
-            modifier = Modifier
+            modifier = Modifier.height(bottomPadding)
-                .animateItem()
-                .height(bottomPadding)
         )
     }
 }

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/browse/components/subcategories/BrowseSortSubcategory.kt

@@ -40,7 +40,6 @@ fun LazyListScope.BrowseSortSubcategory(
                 title = title.invoke(),
                 color = titleColor.invoke(),
                 modifier = Modifier
-                    .animateItem()
                     .padding(
                         top = topPadding,
                         bottom = 8.dp
@@ -48,9 +47,7 @@ fun LazyListScope.BrowseSortSubcategory(
             )
         } else {
             Spacer(
-                modifier = Modifier
+                modifier = Modifier.height((topPadding - 8.dp).coerceAtLeast(0.dp))
-                    .animateItem()
-                    .height((topPadding - 8.dp).coerceAtLeast(0.dp))
             )
         }
     }
@@ -62,9 +59,7 @@ fun LazyListScope.BrowseSortSubcategory(
 
     item {
         Spacer(
-            modifier = Modifier
+            modifier = Modifier.height(bottomPadding)
-                .animateItem()
-                .height(bottomPadding)
         )
     }
 }

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/general/components/GeneralSettingsCategory.kt

@@ -36,9 +36,7 @@ fun LazyListScope.GeneralSettingsCategory(
 ) {
     item {
         Spacer(
-            modifier = Modifier
+            modifier = Modifier.height((topPadding - 8.dp).coerceAtLeast(0.dp))
-                .animateItem()
-                .height((topPadding - 8.dp).coerceAtLeast(0.dp))
         )
     }
 
@@ -66,9 +64,7 @@ fun LazyListScope.GeneralSettingsCategory(
 
     item {
         Spacer(
-            modifier = Modifier
+            modifier = Modifier.height(bottomPadding)
-                .animateItem()
-                .height(bottomPadding)
         )
     }
 }

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/general/components/settings/AppLanguageSetting.kt

@@ -1,10 +1,8 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.general.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.domain.model.ButtonItem
@@ -18,13 +16,12 @@ import ua.acclorite.book_story.presentation.screens.settings.components.ChipsWit
  * Changes app's language.
  */
 @Composable
-fun LazyItemScope.AppLanguageSetting(
+fun AppLanguageSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     ChipsWithTitle(
         title = stringResource(id = R.string.language_option),
-        modifier = Modifier.animateItem(),
         chips = Constants.LANGUAGES.sortedBy { it.second }.map {
             ButtonItem(
                 it.first,

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/general/components/settings/CheckForUpdatesSetting.kt

@@ -3,14 +3,12 @@ package ua.acclorite.book_story.presentation.screens.settings.nested.general.com
 import android.Manifest
 import android.annotation.SuppressLint
 import androidx.activity.ComponentActivity
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Security
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
 import com.google.accompanist.permissions.ExperimentalPermissionsApi
@@ -29,7 +27,7 @@ import ua.acclorite.book_story.presentation.screens.settings.data.SettingsEvent
 @OptIn(ExperimentalPermissionsApi::class)
 @SuppressLint("InlinedApi")
 @Composable
-fun LazyItemScope.CheckForUpdatesSetting(
+fun CheckForUpdatesSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit,
     onSettingsEvent: (SettingsEvent) -> Unit
@@ -62,7 +60,6 @@ fun LazyItemScope.CheckForUpdatesSetting(
 
     SwitchWithTitle(
         selected = state.value.checkForUpdates!!,
-        modifier = Modifier.animateItem(),
         title = stringResource(id = R.string.check_for_updates_option),
         description = stringResource(id = R.string.check_for_updates_option_desc)
     ) {

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/general/components/settings/DoublePressExitSetting.kt

@@ -1,10 +1,8 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.general.components.settings
 
 import android.annotation.SuppressLint
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
@@ -17,13 +15,12 @@ import ua.acclorite.book_story.presentation.screens.settings.components.SwitchWi
  */
 @SuppressLint("InlinedApi")
 @Composable
-fun LazyItemScope.DoublePressExitSetting(
+fun DoublePressExitSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SwitchWithTitle(
         selected = state.value.doublePressExit!!,
-        modifier = Modifier.animateItem(),
         title = stringResource(id = R.string.double_press_exit_option),
         description = stringResource(id = R.string.double_press_exit_option_desc)
     ) {

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/settings/DoubleClickTranslationSetting.kt

@@ -1,9 +1,7 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
@@ -15,13 +13,12 @@ import ua.acclorite.book_story.presentation.screens.settings.components.SwitchWi
  * Changes Reader's double click translation.
  */
 @Composable
-fun LazyItemScope.DoubleClickTranslationSetting(
+fun DoubleClickTranslationSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SwitchWithTitle(
         selected = state.value.doubleClickTranslation!!,
-        modifier = Modifier.animateItem(),
         title = stringResource(id = R.string.double_click_translation_option),
         description = stringResource(id = R.string.double_click_translation_option_desc),
         onClick = {

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/settings/FontFamilySetting.kt

@@ -1,11 +1,9 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
 import androidx.compose.runtime.remember
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.domain.model.ButtonItem
@@ -19,7 +17,7 @@ import ua.acclorite.book_story.presentation.screens.settings.components.ChipsWit
  * Changes Reader's font, uses fonts from [Constants.FONTS].
  */
 @Composable
-fun LazyItemScope.FontFamilySetting(
+fun FontFamilySetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
@@ -31,7 +29,6 @@ fun LazyItemScope.FontFamilySetting(
 
     ChipsWithTitle(
         title = stringResource(id = R.string.font_family_option),
-        modifier = Modifier.animateItem(),
         chips = Constants.FONTS
             .map {
                 ButtonItem(

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/settings/FontSizeSetting.kt

@@ -1,9 +1,7 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
@@ -15,13 +13,12 @@ import ua.acclorite.book_story.presentation.screens.settings.components.SliderWi
  * Changes Reader's font size.
  */
 @Composable
-fun LazyItemScope.FontSizeSetting(
+fun FontSizeSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SliderWithTitle(
         value = state.value.fontSize!! to "pt",
-        modifier = Modifier.animateItem(),
         fromValue = 10,
         toValue = 35,
         title = stringResource(id = R.string.font_size_option),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/settings/FontStyleSetting.kt

@@ -1,11 +1,9 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
 import androidx.compose.runtime.remember
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontStyle
 import ua.acclorite.book_story.R
@@ -20,7 +18,7 @@ import ua.acclorite.book_story.presentation.screens.settings.components.Segmente
  * Changes Reader's font style (Normal/Italic).
  */
 @Composable
-fun LazyItemScope.FontStyleSetting(
+fun FontStyleSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
@@ -32,7 +30,6 @@ fun LazyItemScope.FontStyleSetting(
 
     SegmentedButtonWithTitle(
         title = stringResource(id = R.string.font_style_option),
-        modifier = Modifier.animateItem(),
         buttons = listOf(
             ButtonItem(
                 id = "normal",

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/settings/LetterSpacingSetting.kt

@@ -1,9 +1,7 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
@@ -15,13 +13,12 @@ import ua.acclorite.book_story.presentation.screens.settings.components.SliderWi
  * Changes Reader's letter spacing.
  */
 @Composable
-fun LazyItemScope.LetterSpacingSetting(
+fun LetterSpacingSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SliderWithTitle(
         value = state.value.letterSpacing!! to "pt",
-        modifier = Modifier.animateItem(),
         fromValue = -8,
         toValue = 16,
         title = stringResource(id = R.string.letter_spacing_option),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/settings/LineHeightSetting.kt

@@ -1,9 +1,7 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
@@ -15,13 +13,12 @@ import ua.acclorite.book_story.presentation.screens.settings.components.SliderWi
  * Changes Reader's line height.
  */
 @Composable
-fun LazyItemScope.LineHeightSetting(
+fun LineHeightSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SliderWithTitle(
         value = state.value.lineHeight!! to "pt",
-        modifier = Modifier.animateItem(),
         fromValue = 1,
         toValue = 24,
         title = stringResource(id = R.string.line_height_option),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/settings/ParagraphHeightSetting.kt

@@ -1,9 +1,7 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
@@ -15,13 +13,12 @@ import ua.acclorite.book_story.presentation.screens.settings.components.SliderWi
  * Changes Reader's paragraph height.
  */
 @Composable
-fun LazyItemScope.ParagraphHeightSetting(
+fun ParagraphHeightSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SliderWithTitle(
         value = state.value.paragraphHeight!! to "pt",
-        modifier = Modifier.animateItem(),
         fromValue = 0,
         toValue = 36,
         title = stringResource(id = R.string.paragraph_height_option),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/settings/ParagraphIndentationSetting.kt

@@ -1,9 +1,7 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
@@ -15,13 +13,12 @@ import ua.acclorite.book_story.presentation.screens.settings.components.SwitchWi
  * Changes Reader's paragraph indentation.
  */
 @Composable
-fun LazyItemScope.ParagraphIndentationSetting(
+fun ParagraphIndentationSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SwitchWithTitle(
         selected = state.value.paragraphIndentation!!,
-        modifier = Modifier.animateItem(),
         title = stringResource(id = R.string.paragraph_indentation_option)
     ) {
         onMainEvent(

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/settings/SidePaddingSetting.kt

@@ -1,9 +1,7 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.presentation.data.MainEvent
@@ -15,13 +13,12 @@ import ua.acclorite.book_story.presentation.screens.settings.components.SliderWi
  * Changes Reader's side padding.
  */
 @Composable
-fun LazyItemScope.SidePaddingSetting(
+fun SidePaddingSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SliderWithTitle(
         value = state.value.sidePadding!! to "pt",
-        modifier = Modifier.animateItem(),
         fromValue = 1,
         toValue = 20,
         title = stringResource(id = R.string.side_padding_option),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/settings/TextAlignmentSetting.kt

@@ -1,10 +1,8 @@
 package ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.settings
 
-import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import ua.acclorite.book_story.R
 import ua.acclorite.book_story.domain.model.ButtonItem
@@ -18,13 +16,12 @@ import ua.acclorite.book_story.presentation.screens.settings.nested.reader.data.
  * Changes Reader's text alignment (Start/Justify/Center/End).
  */
 @Composable
-fun LazyItemScope.TextAlignmentSetting(
+fun TextAlignmentSetting(
     state: State<MainState>,
     onMainEvent: (MainEvent) -> Unit
 ) {
     SegmentedButtonWithTitle(
         title = stringResource(id = R.string.text_alignment_option),
-        modifier = Modifier.animateItem(),
         buttons = ReaderTextAlignment.entries.map {
             ButtonItem(
                 id = it.toString(),

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/subcategories/FontSubcategory.kt

@@ -43,7 +43,6 @@ fun LazyListScope.FontSubcategory(
                 title = title.invoke(),
                 color = titleColor.invoke(),
                 modifier = Modifier
-                    .animateItem()
                     .padding(
                         top = topPadding,
                         bottom = 8.dp
@@ -51,9 +50,7 @@ fun LazyListScope.FontSubcategory(
             )
         } else {
             Spacer(
-                modifier = Modifier
+                modifier = Modifier.height((topPadding - 8.dp).coerceAtLeast(0.dp))
-                    .animateItem()
-                    .height((topPadding - 8.dp).coerceAtLeast(0.dp))
             )
         }
     }
@@ -88,9 +85,7 @@ fun LazyListScope.FontSubcategory(
 
     item {
         Spacer(
-            modifier = Modifier
+            modifier = Modifier.height(bottomPadding)
-                .animateItem()
-                .height(bottomPadding)
         )
     }
 }

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/subcategories/TextSubcategory.kt

@@ -44,7 +44,6 @@ fun LazyListScope.TextSubcategory(
                 title = title.invoke(),
                 color = titleColor.invoke(),
                 modifier = Modifier
-                    .animateItem()
                     .padding(
                         top = topPadding,
                         bottom = 8.dp
@@ -52,9 +51,7 @@ fun LazyListScope.TextSubcategory(
             )
         } else {
             Spacer(
-                modifier = Modifier
+                modifier = Modifier.height((topPadding - 8.dp).coerceAtLeast(0.dp))
-                    .animateItem()
-                    .height((topPadding - 8.dp).coerceAtLeast(0.dp))
             )
         }
     }
@@ -96,9 +93,7 @@ fun LazyListScope.TextSubcategory(
 
     item {
         Spacer(
-            modifier = Modifier
+            modifier = Modifier.height(bottomPadding)
-                .animateItem()
-                .height(bottomPadding)
         )
     }
 }

app/src/main/java/ua/acclorite/book_story/presentation/screens/settings/nested/reader/components/subcategories/TranslatorSubcategory.kt

@@ -40,7 +40,6 @@ fun LazyListScope.TranslatorSubcategory(
                 title = title.invoke(),
                 color = titleColor.invoke(),
                 modifier = Modifier
-                    .animateItem()
                     .padding(
                         top = topPadding,
                         bottom = 8.dp
@@ -48,9 +47,7 @@ fun LazyListScope.TranslatorSubcategory(
             )
         } else {
             Spacer(
-                modifier = Modifier
+                modifier = Modifier.height((topPadding - 8.dp).coerceAtLeast(0.dp))
-                    .animateItem()
-                    .height((topPadding - 8.dp).coerceAtLeast(0.dp))
             )
         }
     }
@@ -64,9 +61,7 @@ fun LazyListScope.TranslatorSubcategory(
 
     item {
         Spacer(
-            modifier = Modifier
+            modifier = Modifier.height(bottomPadding)
-                .animateItem()
-                .height(bottomPadding)
         )
     }
 }