@expo/ui 0.2.0-beta.8 → 0.2.0-beta.9

package/CHANGELOG.md

@@ -10,54 +10,11 @@
 
 ### 💡 Others
 
-## 0.2.0-beta.8 — 2025-11-06
+## 0.2.0-beta.9 — 2025-12-05
 
-### 🛠 Breaking changes
-
-- [Android] Move all `jetpack-compose-primitives` components to `jetpack-compose` namespace. ([#40272](https://github.com/expo/expo/pull/40272) by [@aleqsio](https://github.com/aleqsio))
-
-### 🎉 New features
-
-- [iOS] Add `refreshable` modifier. ([#40201](https://github.com/expo/expo/pull/40201) by [@christianwooldridge](https://github.com/christianwooldridge))
-- [iOS] Add RTL support in swiftui. ([#40335](https://github.com/expo/expo/pull/40335) by [@kfirfitousi](https://github.com/kfirfitousi))
-- [Android] Add Carousel component. ([#40325](https://github.com/expo/expo/pull/40325) by [@aleqsio](https://github.com/aleqsio))
-- [iOS] Add `scrollDismissesKeyboard` modifier. ([#40201](https://github.com/expo/expo/pull/40201) by [@christianwooldridge](https://github.com/christianwooldridge))
-- [Android] Add Android BottomSheet ([#37553](https://github.com/expo/expo/pull/37553) by [@Jeroen-G](https://github.com/Jeroen-G))
-- [Android] Move all components to use Host ([#40244](https://github.com/expo/expo/pull/40244) by [@aleqsio](https://github.com/aleqsio))
-- [Android] Add support for modifiers in primitives, add clip modifier. ([#40164](https://github.com/expo/expo/pull/40164) by [@aleqsio](https://github.com/aleqsio))
-- Add scoped compose modifiers, move testID to modifiers. ([#39155](https://github.com/expo/expo/pull/39155) by [@aleqsio](https://github.com/aleqsio))
-- [Android] Add custom button shapes. ([#40163](https://github.com/expo/expo/pull/40163) by [@aleqsio](https://github.com/aleqsio))
-- [iOS] Add ref methods and onChangeFocus to TextField and SecureField. ([#39898](https://github.com/expo/expo/pull/39898) by [@aleqsio](https://github.com/aleqsio))
-- [iOS] Add SF symbol typings ([#39802](https://github.com/expo/expo/pull/39802) by [@nishan](https://github.com/intergalacticspacehighway))
-- [iOS] Add `scrollContentBackground` and `listRowBackground` modifier. ([#40195](https://github.com/expo/expo/pull/40195) by [@doombladeoff](https://github.com/doombladeoff))
-- Added `onAppear` and `onDisappear` modifiers to `swift-ui`. ([#40056](https://github.com/expo/expo/pull/40056) by [@kudo](https://github.com/kudo))
-- [iOS] Add Stepper component. ([#39813](https://github.com/expo/expo/pull/39813) by [@hryhoriiK97](https://github.com/hryhoriiK97))
-- [ios] Add text modifiers (`truncationMode`, `kerning`, `allowsTightening`, `textCase`, `underline`, `strikethrough`, `multilineTextAlignment`,`textSelection` and `lineSpacing`) ([#40282](https://github.com/expo/expo/pull/40282) by [@doombladeoff](https://github.com/doombladeoff))
-- [iOS] Added `header` and `footer` props for sections, support for collapsible sections, and headerProminence modifier ([#40340](https://github.com/expo/expo/pull/40340) by [@doombladeoff](https://github.com/doombladeoff))
-- [iOS] Add new modifiers (`listRowInsets`, `listSectionMargins`, `badgeProminence`, `badge`) ([#40329](https://github.com/expo/expo/pull/40329) by [@doombladeoff](https://github.com/doombladeoff))
-- Add Interpolated string support in button ([#40416](https://github.com/expo/expo/pull/40416) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
-- [iOS] Added Popover component ([#40454](https://github.com/expo/expo/pull/40454) by [@doombladeoff](https://github.com/doombladeoff))
-- [iOS] Add RectangleMark and RuleMark support to Chart component ([#40046](https://github.com/expo/expo/pull/40046) by [@hryhoriiK97](https://github.com/hryhoriiK97))
-- Adds selection API in text field, autoFocus, onSubmit event and rounded rectangle (squircle) support in glassEffect. ([#40455](https://github.com/expo/expo/pull/40455) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
-- [iOS] Add `font` modifier ([#40553](https://github.com/expo/expo/pull/40553) by [@nishan](https://github.com/intergalacticspacehighway))
-- [iOS] Add `getItemAsync` to `ShareLink` ([#40391](https://github.com/expo/expo/pull/40391) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
-- [iOS] Add Grid component and modifiers `gridCellUnsizedAxes`, `gridCellColumns`, `gridColumnAlignment`, `gridCellAnchor` ([#40485](https://github.com/expo/expo/pull/40485) by [@doombladeoff](https://github.com/doombladeoff))
-- [iOS] Add `labelView` to LabeledContent component ([#40798](https://github.com/expo/expo/pull/40798) by [@focux](https://github.com/focux))
-- [iOS] - Add shape in `background` modifier and fix `foregroundStyle` modifer in `Label` ([#40748](https://github.com/expo/expo/pull/40748) by [@nishan](https://github.com/intergalacticspacehighway))
-- [iOS] - Add `systemImage` property to `Switch` component ([#40838](https://github.com/expo/expo/pull/40838) by [@focux](https://github.com/focux))
-
-### 🐛 Bug fixes
-
-- [iOS] remove empty section header spacing when no title provided ([#40296](https://github.com/expo/expo/pull/40296) by [@dylancom](https://github.com/dylancom))
-- [iOS] Merge edge and axis paddings correctly in PaddingModifier ([#40414](https://github.com/expo/expo/pull/40414) by [@lucabc2000](https://github.com/lucabc2000))
-- [iOS] Enhance PaddingModifier to support default SwiftUI padding when no custom values are provided ([#40715](https://github.com/expo/expo/pull/40715) by [@betomoedano](https://github.com/betomoedano))
-
-### 💡 Others
-
-- [docs] Improve consistency and remove invalid platform checks. ([#40362](https://github.com/expo/expo/pull/40362) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
-- Refactored `CommonViewProps` to `UIBaseViewProps` and reduced duplicated code. ([#40492](https://github.com/expo/expo/pull/40492) by [@kudo](https://github.com/kudo))
+_This version does not introduce any user-facing changes._
 
-## 0.2.0-beta.7 - 2025-10-09
+## 0.2.0-beta.7 — 2025-10-09
 
 ### 🎉 New features
 
@@ -68,24 +25,23 @@
 
 - [iOS] Make `ContextMenu` more composable. ([#40254](https://github.com/expo/expo/pull/40254) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
 
-## 0.2.0-beta.6 - 2025-10-01
+## 0.2.0-beta.6 — 2025-10-01
 
 ### 🐛 Bug fixes
 
-- [iOS] Add `buttonStyle` modifier. ([#40119](https://github.com/expo/expo/pull/40119) by [@nishan](https://github.com/intergalacticspacehighway)) ([#40119](https://github.com/expo/expo/pull/40119) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
+- [iOS] Add `buttonStyle` modifier. ([#40119](https://github.com/expo/expo/pull/40119) by [@nishan](https://github.com/intergalacticspacehighway))
 
-## 0.2.0-beta.5 - 2025-10-01
+## 0.2.0-beta.5 — 2025-10-01
 
 ### 🎉 New features
 
 - [iOS] Add `variableValue` prop to Image component for SF Symbols with variable color support ([#39852](https://github.com/expo/expo/pull/39852) by [@morellodev](https://github.com/morellodev))
-- [iOS] Adds `Rectangle`, `RoundedRectangle`, `UnevenRoundedRectangle`, `Circle`, `Ellipse`, `Capsule` shape components and `fill` modifier ([#39793](https://github.com/expo/expo/pull/39793) by [@nishan](https://github.com/intergalacticspacehighway)) ([#39793](https://github.com/expo/expo/pull/39793) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
-- [iOS] Add `ignoreSafeArea` modifier ([#39804](https://github.com/expo/expo/pull/39804) by [@nishan](https://github.com/intergalacticspacehighway)) ([#39804](https://github.com/expo/expo/pull/39804) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
-- [iOS] Add `presentationDetents`, `presentationDragIndicator`, `interactiveDismissDisabled` props to `BottomSheet`. ([#39952](https://github.com/expo/expo/pull/39952) by [@nishan](https://github.com/intergalacticspacehighway)) ([#39952](https://github.com/expo/expo/pull/39952) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
-- [iOS] Add `ConcentricRectangle` shape ([#39907](https://github.com/expo/expo/pull/39907) by [@nishan](https://github.com/intergalacticspacehighway)) ([#39907](https://github.com/expo/expo/pull/39907) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
+- [iOS] Adds `Rectangle`, `RoundedRectangle`, `UnevenRoundedRectangle`, `Circle`, `Ellipse`, `Capsule` shape components and `fill` modifier ([#39793](https://github.com/expo/expo/pull/39793) by [@nishan](https://github.com/intergalacticspacehighway))
+- [iOS] Add `ignoreSafeArea` modifier ([#39804](https://github.com/expo/expo/pull/39804) by [@nishan](https://github.com/intergalacticspacehighway))
+- [iOS] Add `presentationDetents`, `presentationDragIndicator`, `interactiveDismissDisabled` props to `BottomSheet`. ([#39952](https://github.com/expo/expo/pull/39952) by [@nishan](https://github.com/intergalacticspacehighway))
+- [iOS] Add `ConcentricRectangle` shape ([#39907](https://github.com/expo/expo/pull/39907) by [@nishan](https://github.com/intergalacticspacehighway))
 - [iOS] Add disabled modifier for swiftui. ([#39864](https://github.com/expo/expo/pull/39864) by [@hryhoriiK97](https://github.com/hryhoriiK97))
-- Add Interpolated string support in button ([#39932](https://github.com/expo/expo/pull/39932) by [@nishan](https://github.com/intergalacticspacehighway)) ([#39932](https://github.com/expo/expo/pull/39932) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
-- [iOS] list section spacing modifier ([#40291](https://github.com/expo/expo/pull/40291) by [@dylancom](https://github.com/dylancom))
+- Add Interpolated string support in button ([#39932](https://github.com/expo/expo/pull/39932) by [@nishan](https://github.com/intergalacticspacehighway))
 
 ### 🐛 Bug fixes
 
@@ -93,13 +49,16 @@
 
 ### 💡 Others
 
-- [ios] - Set host dimension synchronously on native ([#40017](https://github.com/expo/expo/pull/40017) by [@nishan](https://github.com/intergalacticspacehighway)) ([#40017](https://github.com/expo/expo/pull/40017) by [@intergalacticspacehighway](https://github.com/intergalacticspacehighway))
+- [ios] - Set host dimension synchronously on native ([#40017](https://github.com/expo/expo/pull/40017) by [@nishan](https://github.com/intergalacticspacehighway))
+
+## 0.2.0-beta.4 — 2025-09-22
+
+### 🎉 New features
 
-## 0.2.0-beta.4 - 2025-09-22
+- Add SF symbol typings ([#39802](https://github.com/expo/expo/pull/39802) by [@nishan](https://github.com/intergalacticspacehighway))
 
 ### 🐛 Bug fixes
 
-- [iOS] Add correct color value types. ([#39899](https://github.com/expo/expo/pull/39899) by [@EvanBacon](https://github.com/EvanBacon))
 - [iOS] Updated description for glass button styles availability ([#39736](https://github.com/expo/expo/pull/39736) by [@terijaki](https://github.com/terijaki))
 
 ## 0.2.0-beta.3 — 2025-09-16

package/android/build.gradle

@@ -12,13 +12,13 @@ apply plugin: 'expo-module-gradle-plugin'
 apply plugin: 'org.jetbrains.kotlin.plugin.compose'
 
 group = 'expo.modules.ui'
-version = '0.2.0-beta.8'
+version = '0.2.0-beta.9'
 
 android {
   namespace "expo.modules.ui"
   defaultConfig {
     versionCode 1
-    versionName "0.2.0-beta.8"
+    versionName "0.2.0-beta.9"
   }
   buildFeatures {
     compose true
@@ -29,11 +29,11 @@ android {
 }
 
 dependencies {
-  implementation 'androidx.compose.foundation:foundation-android:1.9.1'
-  implementation 'androidx.compose.ui:ui-android:1.9.1'
-  implementation "androidx.compose.material3:material3:1.3.2"
-  implementation 'androidx.lifecycle:lifecycle-runtime:2.9.3'
-  implementation 'androidx.fragment:fragment-ktx:1.8.9'
-  implementation 'androidx.compose.material3:material3-android:1.3.2'
+  implementation 'androidx.compose.foundation:foundation-android:1.7.6'
+  implementation 'androidx.compose.ui:ui-android:1.7.6'
+  implementation "androidx.compose.material3:material3:1.3.1"
+  implementation 'androidx.lifecycle:lifecycle-runtime:2.8.7'
+  implementation 'androidx.fragment:fragment-ktx:1.8.5'
+  implementation 'androidx.compose.material3:material3-android:1.3.1'
   implementation "androidx.graphics:graphics-shapes:1.0.1"
 }

package/android/src/main/java/expo/modules/ui/AlertDialogView.kt

@@ -13,7 +13,6 @@ import androidx.compose.ui.Modifier
 import expo.modules.kotlin.views.ExpoComposeView
 import expo.modules.kotlin.viewevent.EventDispatcher
 import expo.modules.kotlin.records.Record
-import expo.modules.kotlin.views.ComposableScope
 import java.io.Serializable
 
 open class AlertDialogButtonPressedEvent() : Record, Serializable
@@ -28,13 +27,13 @@ data class AlertDialogProps(
 ) : ComposeProps
 
 class AlertDialogView(context: Context, appContext: AppContext) :
-  ExpoComposeView<AlertDialogProps>(context, appContext) {
+  ExpoComposeView<AlertDialogProps>(context, appContext, withHostingView = true) {
   override val props = AlertDialogProps()
   private val onDismissPressed by EventDispatcher<AlertDialogButtonPressedEvent>()
   private val onConfirmPressed by EventDispatcher<AlertDialogButtonPressedEvent>()
 
   @Composable
-  override fun ComposableScope.Content() {
+  override fun Content(modifier: Modifier) {
     val (title) = props.title
     val (text) = props.text
     val (confirmButtonText) = props.confirmButtonText

package/android/src/main/java/expo/modules/ui/ChipView.kt

@@ -12,7 +12,6 @@ import androidx.compose.ui.unit.dp
 import expo.modules.kotlin.AppContext
 import expo.modules.kotlin.records.Record
 import expo.modules.kotlin.viewevent.EventDispatcher
-import expo.modules.kotlin.views.ComposableScope
 import expo.modules.kotlin.views.ComposeProps
 import expo.modules.kotlin.views.ExpoComposeView
 import java.io.Serializable
@@ -31,7 +30,7 @@ data class ChipProps(
 ) : ComposeProps
 
 class ChipView(context: Context, appContext: AppContext) :
-  ExpoComposeView<ChipProps>(context, appContext) {
+  ExpoComposeView<ChipProps>(context, appContext, withHostingView = true) {
 
   override val props = ChipProps()
 
@@ -40,7 +39,7 @@ class ChipView(context: Context, appContext: AppContext) :
 
   @OptIn(ExperimentalMaterial3Api::class)
   @Composable
-  override fun ComposableScope.Content() {
+  override fun Content(modifier: Modifier) {
     val variant by props.variant
     val label by props.label
     val leadingIcon by props.leadingIcon
@@ -50,7 +49,7 @@ class ChipView(context: Context, appContext: AppContext) :
     val enabled by props.enabled
     val selected by props.selected
 
-    val chipModifier = Modifier
+    val chipModifier = modifier
       .padding(4.dp)
       .wrapContentSize(Alignment.Center)
 

package/android/src/main/java/expo/modules/ui/ComposeViews.kt

@@ -3,7 +3,6 @@ package expo.modules.ui
 import android.content.Context
 import android.graphics.Color as AndroidColor
 import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.material3.Text
@@ -21,8 +20,6 @@ import expo.modules.kotlin.AppContext
 import expo.modules.kotlin.types.Enumerable
 import expo.modules.kotlin.views.ComposeProps
 import expo.modules.kotlin.views.ExpoComposeView
-import expo.modules.kotlin.views.ComposableScope
-import expo.modules.kotlin.views.with
 
 enum class HorizontalArrangement(val value: String) : Enumerable {
   START("start"),
@@ -97,20 +94,20 @@ data class LayoutProps(
   val verticalArrangement: MutableState<VerticalArrangement> = mutableStateOf(VerticalArrangement.TOP),
   val horizontalAlignment: MutableState<HorizontalAlignment> = mutableStateOf(HorizontalAlignment.START),
   val verticalAlignment: MutableState<VerticalAlignment> = mutableStateOf(VerticalAlignment.TOP),
-  val modifiers: MutableState<List<ExpoModifier>?> = mutableStateOf(emptyList())
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 class RowView(context: Context, appContext: AppContext) : ExpoComposeView<LayoutProps>(context, appContext) {
   override val props = LayoutProps()
 
   @Composable
-  override fun ComposableScope.Content() {
+  override fun Content(modifier: Modifier) {
     Row(
       horizontalArrangement = props.horizontalArrangement.value.toComposeArrangement(),
       verticalAlignment = props.verticalAlignment.value.toComposeAlignment(),
-      modifier = Modifier.fromExpoModifiers(props.modifiers.value, this@Content)
+      modifier = modifier.then(Modifier.fromExpoModifiers(props.modifiers.value))
     ) {
-      Children(this@Content.with(rowScope = this@Row))
+      Children()
     }
   }
 }
@@ -119,26 +116,13 @@ class ColumnView(context: Context, appContext: AppContext) : ExpoComposeView<Lay
   override val props = LayoutProps()
 
   @Composable
-  override fun ComposableScope.Content() {
+  override fun Content(modifier: Modifier) {
     Column(
       verticalArrangement = props.verticalArrangement.value.toComposeArrangement(),
       horizontalAlignment = props.horizontalAlignment.value.toComposeAlignment(),
-      modifier = Modifier.fromExpoModifiers(props.modifiers.value, this@Content)
-    ) {
-      Children(this@Content.with(columnScope = this@Column))
-    }
-  }
-}
-
-class BoxView(context: Context, appContext: AppContext) : ExpoComposeView<LayoutProps>(context, appContext) {
-  override val props = LayoutProps()
-
-  @Composable
-  override fun ComposableScope.Content() {
-    Box(
-      modifier = Modifier.fromExpoModifiers(props.modifiers.value, this@Content)
+      modifier = modifier.then(Modifier.fromExpoModifiers(props.modifiers.value))
     ) {
-      Children(this@Content.with(boxScope = this@Box))
+      Children()
     }
   }
 }
@@ -185,10 +169,10 @@ class TextView(context: Context, appContext: AppContext) : ExpoComposeView<TextP
   override val props = TextProps()
 
   @Composable
-  override fun ComposableScope.Content() {
+  override fun Content(modifier: Modifier) {
     Text(
       text = props.text.value,
-      modifier = Modifier.fromExpoModifiers(props.modifiers.value),
+      modifier = modifier.then(Modifier.fromExpoModifiers(props.modifiers.value)),
       color = colorToComposeColor(props.color.value),
       style = TextStyle(
         fontSize = props.fontSize.value.sp,
@@ -198,17 +182,13 @@ class TextView(context: Context, appContext: AppContext) : ExpoComposeView<TextP
   }
 }
 
-class HostView(context: Context, appContext: AppContext) :
+class ContainerView(context: Context, appContext: AppContext) :
   ExpoComposeView<ComposeProps>(context, appContext, withHostingView = true) {
   @Composable
-  override fun ComposableScope.Content() {
-    for (index in 0..<this@HostView.size) {
+  override fun Content(modifier: Modifier) {
+    for (index in 0..<this.size) {
       val child = getChildAt(index) as? ExpoComposeView<*> ?: continue
-      with(this) {
-        with(child) {
-          Content()
-        }
-      }
+      child.Content(modifier = modifier)
     }
   }
 }

package/android/src/main/java/expo/modules/ui/DatePickerView.kt

@@ -25,7 +25,6 @@ import expo.modules.kotlin.types.Enumerable
 import expo.modules.kotlin.viewevent.EventDispatcher
 import expo.modules.kotlin.views.ComposeProps
 import expo.modules.kotlin.views.ExpoComposeView
-import expo.modules.kotlin.views.ComposableScope
 import java.util.Calendar
 import java.util.Date
 import android.graphics.Color as AndroidColor
@@ -69,12 +68,12 @@ data class DateTimePickerProps(
 @SuppressLint("ViewConstructor")
 @OptIn(ExperimentalMaterial3Api::class)
 class DateTimePickerView(context: Context, appContext: AppContext) :
-  ExpoComposeView<DateTimePickerProps>(context, appContext) {
+  ExpoComposeView<DateTimePickerProps>(context, appContext, withHostingView = true) {
   override val props = DateTimePickerProps()
   private val onDateSelected by EventDispatcher<DatePickerResult>()
 
   @Composable
-  override fun ComposableScope.Content() {
+  override fun Content(modifier: Modifier) {
     if (props.displayedComponents.value == DisplayedComponents.HOUR_AND_MINUTE) {
       ExpoTimePicker(props = props, modifier = Modifier.fromExpoModifiers(props.modifiers.value)) {
         onDateSelected(it)

package/android/src/main/java/expo/modules/ui/ExpoUIModule.kt

@@ -1,9 +1,6 @@
 package expo.modules.ui
 
 import android.graphics.Color
-import androidx.compose.animation.animateContentSize
-import androidx.compose.animation.core.Spring
-import androidx.compose.animation.core.spring
 import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
@@ -15,9 +12,9 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.draw.blur
-import androidx.compose.ui.draw.clip
 import androidx.compose.ui.draw.rotate
 import androidx.compose.ui.draw.shadow
+import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.zIndex
 import expo.modules.kotlin.jni.JavaScriptFunction
@@ -42,10 +39,6 @@ class ExpoUIModule : Module() {
       }
     }
 
-    View(BottomSheetView::class) {
-      Events("onIsOpenedChange")
-    }
-
     // Defines a single view for now – a single choice segmented control
     View(PickerView::class) {
       Events("onOptionSelected")
@@ -92,12 +85,10 @@ class ExpoUIModule : Module() {
       }
     }
 
-    View(BoxView::class)
     View(RowView::class)
     View(ColumnView::class)
-    View(HostView::class)
+    View(ContainerView::class)
     View(TextView::class)
-    View(CarouselView::class)
 
     View(AlertDialogView::class) {
       Events(
@@ -113,12 +104,8 @@ class ExpoUIModule : Module() {
       )
     }
 
-    Function("paddingAll") { all: Int ->
-      return@Function ExpoModifier(Modifier.padding(all.dp))
-    }
-
-    Function("padding") { start: Int, top: Int, end: Int, bottom: Int ->
-      return@Function ExpoModifier(Modifier.padding(start.dp, top.dp, end.dp, bottom.dp))
+    Function("padding") { all: Int ->
+      return@Function ExpoModifier(Modifier.padding(Dp(all.toFloat())))
     }
 
     Function("size") { width: Int, height: Int ->
@@ -173,44 +160,6 @@ class ExpoUIModule : Module() {
       return@Function ExpoModifier(Modifier.zIndex(index))
     }
 
-    Function("animateContentSize") { dampingRatio: Float?, stiffness: Float? ->
-      return@Function ExpoModifier(
-        Modifier.animateContentSize(
-          spring(dampingRatio = dampingRatio ?: Spring.DampingRatioNoBouncy, stiffness = stiffness ?: Spring.StiffnessMedium)
-        )
-      )
-    }
-
-    Function("weight") { weight: Float ->
-      val scopedExpoModifier = ExpoModifier {
-        it.rowScope?.run {
-          Modifier.weight(weight)
-        } ?: it.columnScope?.run {
-          Modifier.weight(weight)
-        } ?: Modifier
-      }
-      return@Function scopedExpoModifier
-    }
-
-    Function("matchParentSize") {
-      val scopedExpoModifier = ExpoModifier {
-        it.boxScope?.run {
-          Modifier.matchParentSize()
-        } ?: Modifier
-      }
-      return@Function scopedExpoModifier
-    }
-
-    Function("testID") { testID: String ->
-      return@Function ExpoModifier(Modifier.applyTestTag(testID))
-    }
-
-    Function("clip") { shapeRecord: ShapeRecord ->
-      val shape = shapeFromShapeRecord(shapeRecord)
-        ?: return@Function Modifier
-      return@Function ExpoModifier(Modifier.clip(shape))
-    }
-
     // TODO: Consider implementing semantics, layoutId, clip, navigationBarsPadding, systemBarsPadding
   }
 }

package/android/src/main/java/expo/modules/ui/Modifiers.kt

@@ -1,44 +1,15 @@
 package expo.modules.ui
 
-import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.platform.testTag
-import androidx.compose.ui.semantics.semantics
-import androidx.compose.ui.semantics.testTagsAsResourceId
 import expo.modules.kotlin.sharedobjects.SharedRef
-import expo.modules.kotlin.views.ComposableScope
 
-class ExpoModifier(ref: Modifier?) : SharedRef<Modifier?>(ref) {
-  var getFromScope: ((ComposableScope) -> Modifier)? = null
-
-  constructor(getFromScope: (ComposableScope) -> Modifier) : this(null) {
-    this.getFromScope = getFromScope
-  }
-}
+class ExpoModifier(ref: Modifier?) : SharedRef<Modifier?>(ref)
 
 fun Modifier.fromExpoModifiers(
-  modifiers: List<ExpoModifier>?,
-  composableScope: ComposableScope? = null
+  modifiers: List<ExpoModifier>
 ): Modifier {
-  return modifiers?.fold(this) { acc, modifier ->
-    composableScope?.let { holder ->
-      modifier.getFromScope?.invoke(holder)?.let {
-        return@fold it.then(acc)
-      }
-    }
-    modifier.ref?.then(acc) ?: acc
-  } ?: Modifier
-}
-
-/**
- * Applies a test tag to a modifier if a testID is provided.
- */
-@OptIn(ExperimentalComposeUiApi::class)
-fun Modifier.applyTestTag(testID: String?): Modifier =
-  if (!testID.isNullOrEmpty()) {
-    this
-      .semantics { testTagsAsResourceId = true }
-      .testTag(testID)
-  } else {
-    this
+  return modifiers.fold(this) { acc, modifier ->
+    val ref = modifier.ref
+    ref?.let { acc.then(it) } ?: acc
   }
+}

package/android/src/main/java/expo/modules/ui/PickerView.kt

@@ -29,7 +29,6 @@ import expo.modules.kotlin.records.Record
 import expo.modules.kotlin.viewevent.EventDispatcher
 import expo.modules.kotlin.views.ComposeProps
 import expo.modules.kotlin.views.ExpoComposeView
-import expo.modules.kotlin.views.ComposableScope
 
 class PickerColors : Record {
   @Field
@@ -79,12 +78,12 @@ data class PickerProps(
 ) : ComposeProps
 
 class PickerView(context: Context, appContext: AppContext) :
-  ExpoComposeView<PickerProps>(context, appContext) {
+  ExpoComposeView<PickerProps>(context, appContext, withHostingView = true) {
   override val props = PickerProps()
   private val onOptionSelected by EventDispatcher()
 
   @Composable
-  override fun ComposableScope.Content() {
+  override fun Content(modifier: Modifier) {
     val (selectedIndex) = props.selectedIndex
     val (options) = props.options
     val (colors) = props.elementColors

package/android/src/main/java/expo/modules/ui/ProgressView.kt

@@ -17,7 +17,6 @@ import expo.modules.kotlin.types.Enumerable
 import expo.modules.kotlin.views.AutoSizingComposable
 import expo.modules.kotlin.views.ComposeProps
 import expo.modules.kotlin.views.Direction
-import expo.modules.kotlin.views.ComposableScope
 import java.util.EnumSet
 
 enum class ProgressVariant(val value: String) : Enumerable {
@@ -39,11 +38,11 @@ data class ProgressProps(
 ) : ComposeProps
 
 class ProgressView(context: Context, appContext: AppContext) :
-  ExpoComposeView<ProgressProps>(context, appContext) {
+  ExpoComposeView<ProgressProps>(context, appContext, withHostingView = true) {
   override val props = ProgressProps()
 
   @Composable
-  override fun ComposableScope.Content() {
+  override fun Content(modifier: Modifier) {
     val (variant) = props.variant
     val (progress) = props.progress
     val (color) = props.color

package/android/src/main/java/expo/modules/ui/ShapeView.kt

@@ -18,21 +18,14 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.mutableIntStateOf
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.ui.geometry.Size
-import androidx.compose.ui.graphics.Outline
 import androidx.compose.ui.graphics.Path
-import androidx.compose.ui.graphics.Shape
-import androidx.compose.ui.unit.Density
-import androidx.compose.ui.unit.LayoutDirection
 import androidx.graphics.shapes.CornerRounding
 import androidx.graphics.shapes.circle
 import androidx.graphics.shapes.pill
 import androidx.graphics.shapes.pillStar
 import androidx.graphics.shapes.rectangle
 import androidx.graphics.shapes.star
-import expo.modules.kotlin.records.Field
-import expo.modules.kotlin.records.Record
 import expo.modules.kotlin.types.Enumerable
-import expo.modules.kotlin.views.ComposableScope
 import android.graphics.Color as GraphicsColor
 
 enum class ShapeType(val value: String) : Enumerable {
@@ -124,55 +117,11 @@ private fun createRectanglePath(size: Size, cornerRounding: Float, smoothing: Fl
   ).toPath().asComposePath()
 }
 
-data class ShapeRecord(
-  @Field
-  val cornerRounding: Float = 0.0f,
-  @Field
-  val smoothing: Float = 0.0f,
-  @Field
-  val verticesCount: Int = 6,
-  @Field
-  val innerRadius: Float = 0.0f,
-  @Field
-  val radius: Float = 0.0f,
-  @Field
-  val type: ShapeType = ShapeType.CIRCLE
-) : Record
-
-fun pathFromShapeRecord(record: ShapeRecord, size: Size): Path {
-  val cornerRounding = record.cornerRounding
-  val smoothing = record.smoothing
-  val innerRadius = record.innerRadius
-  val radius = record.radius
-  val shapeType = record.type
-  val verticesCount = record.verticesCount
-  return runCatching {
-    when (shapeType) {
-      ShapeType.STAR -> createStarPath(size = size, cornerRounding = cornerRounding, smoothing = smoothing, innerRadius = innerRadius, radius = radius, verticesCount = verticesCount)
-      ShapeType.PILL_STAR -> createPillStarPath(size = size, cornerRounding = cornerRounding, smoothing = smoothing, innerRadius = innerRadius, verticesCount = verticesCount)
-      ShapeType.PILL -> createPillPath(size = size, smoothing = smoothing)
-      ShapeType.CIRCLE -> createCirclePath(size = size, radius = radius, verticesCount = verticesCount)
-      ShapeType.RECTANGLE -> createRectanglePath(size = size, cornerRounding = cornerRounding, smoothing = smoothing)
-      ShapeType.POLYGON -> createPolygonPath(size = size, cornerRounding = cornerRounding, smoothing = smoothing, verticesCount = verticesCount)
-    }
-  }.getOrNull() ?: Path()
-}
-
-fun shapeFromShapeRecord(shapeRecord: ShapeRecord?): Shape? {
-  if (shapeRecord == null) return null
-  return object : Shape {
-    override fun createOutline(size: Size, layoutDirection: LayoutDirection, density: Density): Outline {
-      val path = pathFromShapeRecord(shapeRecord, size)
-      return Outline.Generic(path)
-    }
-  }
-}
-
-class ShapeView(context: Context, appContext: AppContext) : ExpoComposeView<ShapeProps>(context, appContext) {
+class ShapeView(context: Context, appContext: AppContext) : ExpoComposeView<ShapeProps>(context, appContext, withHostingView = true) {
   override val props = ShapeProps()
 
   @Composable
-  override fun ComposableScope.Content() {
+  override fun Content(modifier: Modifier) {
     val (smoothing) = props.smoothing
     val (cornerRounding) = props.cornerRounding
     val (innerRadius) = props.innerRadius
@@ -181,20 +130,16 @@ class ShapeView(context: Context, appContext: AppContext) : ExpoComposeView<Shap
     val (verticesCount) = props.verticesCount
     val (color) = props.color
     Box(
-      modifier = Modifier
-        .fromExpoModifiers(props.modifiers.value)
+      modifier = Modifier.fromExpoModifiers(props.modifiers.value)
         .drawWithCache {
-          val path = pathFromShapeRecord(
-            ShapeRecord(
-              cornerRounding = cornerRounding,
-              smoothing = smoothing,
-              innerRadius = innerRadius,
-              radius = radius,
-              type = shapeType,
-              verticesCount = verticesCount
-            ),
-            size
-          )
+          val path = when (shapeType) {
+            ShapeType.STAR -> createStarPath(size = size, cornerRounding = cornerRounding, smoothing = smoothing, innerRadius = innerRadius, radius = radius, verticesCount = verticesCount)
+            ShapeType.PILL_STAR -> createPillStarPath(size = size, cornerRounding = cornerRounding, smoothing = smoothing, innerRadius = innerRadius, verticesCount = verticesCount)
+            ShapeType.PILL -> createPillPath(size = size, smoothing = smoothing)
+            ShapeType.CIRCLE -> createCirclePath(size = size, radius = radius, verticesCount = verticesCount)
+            ShapeType.RECTANGLE -> createRectanglePath(size = size, cornerRounding = cornerRounding, smoothing = smoothing)
+            ShapeType.POLYGON -> createPolygonPath(size = size, cornerRounding = cornerRounding, smoothing = smoothing, verticesCount = verticesCount)
+          }
 
           onDrawBehind {
             drawPath(path, color = color.composeOrNull ?: Color.Transparent)