chore: allow previews of components with defined shared{Element/Bounds}Transition

Signed-off-by: Brandon McAnsh <git@bmcreations.dev>

Author: bmc08gt

apps/flipcash/app/src/main/kotlin/com/flipcash/app/internal/ui/App.kt

@@ -63,7 +63,7 @@ import com.getcode.ui.components.OnLifecycleEvent
 import com.getcode.ui.components.bars.rememberBarManager
 import com.getcode.ui.core.RestrictionType
 import com.flipcash.app.core.extensions.navigateTo
-import com.getcode.navigation.animation.LocalSharedTransitionScope
+import com.getcode.animation.LocalSharedTransitionScope
 import com.getcode.navigation.scrim.LocalScrimController
 import com.getcode.navigation.scrim.ScrimController
 import com.getcode.navigation.scrim.ScrimOverlay

apps/flipcash/core/src/main/kotlin/com/flipcash/app/core/ui/transitions/SharedTransitions.kt

@@ -19,17 +19,16 @@ import androidx.compose.animation.core.spring
 import androidx.compose.animation.fadeIn
 import androidx.compose.animation.fadeOut
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.compositionLocalOf
-import androidx.compose.runtime.staticCompositionLocalOf
 import androidx.compose.ui.Alignment.Companion.Center
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.geometry.Rect
 import androidx.compose.ui.graphics.Path
 import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.LocalInspectionMode
 import androidx.compose.ui.unit.Density
 import androidx.compose.ui.unit.LayoutDirection
 import androidx.navigation3.ui.LocalNavAnimatedContentScope
-import com.getcode.navigation.animation.LocalSharedTransitionScope
+import com.getcode.animation.LocalSharedTransitionScope
 
 sealed class SharedTransition(
     val key: String,
@@ -84,7 +83,7 @@ val CircleOverlayClip: OverlayClip =
 @Composable
 fun Modifier.sharedBoundsTransition(
     key: String,
-    animatedVisibilityScope: AnimatedVisibilityScope = LocalNavAnimatedContentScope.current,
+    animatedVisibilityScope: AnimatedVisibilityScope? = null,
     sharedTransitionScope: SharedTransitionScope = LocalSharedTransitionScope.current,
     enter: EnterTransition = fadeIn(),
     exit: ExitTransition = fadeOut(),
@@ -95,12 +94,18 @@ fun Modifier.sharedBoundsTransition(
     placeholderSize: PlaceholderSize = AnimatedSize,
     clipInOverlayDuringTransition: OverlayClip = ParentClip,
 ): Modifier {
+    if(LocalInspectionMode.current) {
+        return this
+    }
+
+    val animatedScope = animatedVisibilityScope ?: LocalNavAnimatedContentScope.current
+
     return with(sharedTransitionScope) {
         this@sharedBoundsTransition.sharedBounds(
             sharedContentState = rememberSharedContentState(key = key),
             enter = enter,
             exit = exit,
-            animatedVisibilityScope = animatedVisibilityScope,
+            animatedVisibilityScope = animatedScope,
             boundsTransform = boundsTransform,
             renderInOverlayDuringTransition = renderInOverlayDuringTransition,
             resizeMode = resizeMode,
@@ -114,7 +119,7 @@ fun Modifier.sharedBoundsTransition(
 @Composable
 fun Modifier.sharedBoundsTransition(
     transition: SharedTransition,
-    animatedVisibilityScope: AnimatedVisibilityScope = LocalNavAnimatedContentScope.current,
+    animatedVisibilityScope: AnimatedVisibilityScope? = null,
     sharedTransitionScope: SharedTransitionScope = LocalSharedTransitionScope.current,
     zIndexInOverlay: Float = 0f,
     renderInOverlayDuringTransition: Boolean = true,
@@ -139,17 +144,23 @@ fun Modifier.sharedBoundsTransition(
 @Composable
 fun Modifier.sharedElementTransition(
     key: String,
-    animatedVisibilityScope: AnimatedVisibilityScope = LocalNavAnimatedContentScope.current,
+    animatedVisibilityScope: AnimatedVisibilityScope? = null,
     sharedTransitionScope: SharedTransitionScope = LocalSharedTransitionScope.current,
     boundsTransform: BoundsTransform = DefaultTransform,
     placeholderSize: PlaceholderSize = AnimatedSize,
     zIndexInOverlay: Float = 0f,
     renderInOverlayDuringTransition: Boolean = true,
 ): Modifier {
+    if(LocalInspectionMode.current) {
+        return this
+    }
+
+    val animatedScope = animatedVisibilityScope ?: LocalNavAnimatedContentScope.current
+
     return with(sharedTransitionScope) {
         this@sharedElementTransition.sharedElement(
             sharedContentState = rememberSharedContentState(key = key),
-            animatedVisibilityScope = animatedVisibilityScope,
+            animatedVisibilityScope = animatedScope,
             boundsTransform = boundsTransform,
             placeholderSize = placeholderSize,
             zIndexInOverlay = zIndexInOverlay,
@@ -161,7 +172,7 @@ fun Modifier.sharedElementTransition(
 @Composable
 fun Modifier.sharedElementTransition(
     transition: SharedTransition,
-    animatedVisibilityScope: AnimatedVisibilityScope = LocalNavAnimatedContentScope.current,
+    animatedVisibilityScope: AnimatedVisibilityScope? = null,
     boundsTransform: BoundsTransform? = null,
     sharedTransitionScope: SharedTransitionScope = LocalSharedTransitionScope.current,
     placeholderSize: PlaceholderSize = AnimatedSize,
@@ -190,6 +201,10 @@ fun Modifier.sharedElementTransitionWithCallerManagedVisibility(
     renderInOverlayDuringTransition: Boolean = true,
     clipInOverlayDuringTransition: OverlayClip = ParentClip,
 ): Modifier {
+    if(LocalInspectionMode.current) {
+        return this
+    }
+
     return with(sharedTransitionScope) {
         this@sharedElementTransitionWithCallerManagedVisibility.sharedElementWithCallerManagedVisibility(
             sharedContentState = rememberSharedContentState(key = key),

apps/flipcash/features/currency-creator/src/main/kotlin/com/flipcash/app/currencycreator/internal/screens/DescriptionSelectionScreen.kt

@@ -172,6 +172,8 @@ internal fun DescriptionSelectionContent(
                 )
 
                 Text(
+                    modifier = Modifier
+                        .fillMaxWidth(0.65f),
                     text = stringResource(R.string.title_currencyCreatorDescription),
                     style = CodeTheme.typography.textLarge,
                     color = CodeTheme.colors.textMain,

apps/flipcash/shared/theme/src/main/kotlin/com/flipcash/app/theme/FlipcashPreview.kt

@@ -1,11 +1,14 @@
 package com.flipcash.app.theme
 
+import androidx.compose.animation.SharedTransitionLayout
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import com.getcode.animation.LocalSharedTransitionScope
 import com.flipcash.app.theme.internal.Flipcash2DesignSystem
 import com.flipcash.app.theme.internal.FlipcashLegacyDesignSystem
 import com.getcode.theme.CodeTheme
@@ -17,12 +20,18 @@ fun FlipcashPreview(
     content: @Composable () -> Unit
 ) {
     val previewContent = @Composable {
-        Box(
-            modifier = Modifier
-                .wrapContentSize()
-                .background(if (showBackground) CodeTheme.colors.background else Color.Transparent)
-        ) {
-            content()
+        SharedTransitionLayout {
+            CompositionLocalProvider(
+                LocalSharedTransitionScope provides this,
+            ) {
+                Box(
+                    modifier = Modifier
+                        .wrapContentSize()
+                        .background(if (showBackground) CodeTheme.colors.background else Color.Transparent)
+                ) {
+                    content()
+                }
+            }
         }
     }
 

ui/navigation/src/main/kotlin/com/getcode/navigation/scenes/ModalBottomSheetSceneStrategy.kt

@@ -3,7 +3,6 @@ package com.getcode.navigation.scenes
 import android.os.Build
 import android.os.Parcelable
 import androidx.compose.animation.SharedTransitionLayout
-import androidx.compose.foundation.LocalOverscrollFactory
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxHeight
@@ -34,8 +33,8 @@ import androidx.navigation3.scene.OverlayScene
 import androidx.navigation3.scene.Scene
 import androidx.navigation3.scene.SceneStrategy
 import androidx.navigation3.scene.SceneStrategyScope
+import com.getcode.animation.LocalSharedTransitionScope
 import com.getcode.navigation.NavMetadataKeys
-import com.getcode.navigation.animation.LocalSharedTransitionScope
 import com.getcode.navigation.core.CodeNavigator
 import com.getcode.navigation.core.LocalCodeNavigator
 import com.getcode.navigation.results.NavResultKey

…ation/animation/SharedTransitionScope.kt …tcode/animation/SharedTransitionScope.ktui/navigation/src/main/kotlin/com/getcode/navigation/animation/SharedTransitionScope.kt renamed to ui/theme/src/main/kotlin/com/getcode/animation/SharedTransitionScope.kt ui/navigation/src/main/kotlin/com/getcode/navigation/animation/SharedTransitionScope.kt renamed to ui/theme/src/main/kotlin/com/getcode/animation/SharedTransitionScope.kt

@@ -1,4 +1,4 @@
-package com.getcode.navigation.animation
+package com.getcode.animation
 
 import androidx.compose.animation.SharedTransitionScope
 import androidx.compose.runtime.staticCompositionLocalOf