@expo/ui 0.2.0-alpha.0 → 0.2.0-alpha.2

package/CHANGELOG.md

@@ -10,6 +10,20 @@
 
 ### 💡 Others
 
+## 0.2.0-alpha.2 — 2025-08-16
+
+_This version does not introduce any user-facing changes._
+
+## 0.2.0-alpha.1 — 2025-08-15
+
+### 🛠 Breaking changes
+
+- Merged `swift-ui-primitives` to `swift-ui` and now every component should explicitly wrap with a `<Host>`. ([#38866](https://github.com/expo/expo/pull/38866) by [@kudo](https://github.com/kudo))
+
+### 🎉 New features
+
+- [Android] Add compose modifier support. ([#38630](https://github.com/expo/expo/pull/38630) by [@aleqsio](https://github.com/aleqsio))
+
 ## 0.2.0-alpha.0 — 2025-08-13
 
 ### 🎉 New features
@@ -27,6 +41,7 @@
 - [iOS] Add `testID` property to views. ([#37919](https://github.com/expo/expo/pull/37919) by [@mateoguzmana](https://github.com/mateoguzmana))
 - Add `SecureField` component. ([#37642](https://github.com/expo/expo/pull/37642) by [@aleqsio](https://github.com/aleqsio))
 - [Android] Add `AlertDialog` component. ([#38266](https://github.com/expo/expo/pull/38266) by [@mateoguzmana](https://github.com/mateoguzmana))
+- Added SwiftUI view modifiers support. ([#38543](https://github.com/expo/expo/pull/38543) by [@kudo](https://github.com/kudo))
 
 ### 🐛 Bug fixes
 

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-alpha.0'
+version = '0.2.0-alpha.2'
 
 android {
   namespace "expo.modules.ui"
   defaultConfig {
     versionCode 1
-    versionName "0.2.0-alpha.0"
+    versionName "0.2.0-alpha.2"
   }
   buildFeatures {
     compose true

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

@@ -22,7 +22,8 @@ data class AlertDialogProps(
   val text: MutableState<String?> = mutableStateOf(null),
   val confirmButtonText: MutableState<String?> = mutableStateOf(null),
   val dismissButtonText: MutableState<String?> = mutableStateOf(null),
-  val visible: MutableState<Boolean> = mutableStateOf(false)
+  val visible: MutableState<Boolean> = mutableStateOf(false),
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 class AlertDialogView(context: Context, appContext: AppContext) :
@@ -44,6 +45,7 @@ class AlertDialogView(context: Context, appContext: AppContext) :
     }
 
     AlertDialog(
+      modifier = Modifier.fromExpoModifiers(props.modifiers.value),
       confirmButton = {
         confirmButtonText?.let {
           TextButton(onClick = { onConfirmPressed.invoke(AlertDialogButtonPressedEvent()) }) {

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

@@ -94,7 +94,7 @@ 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 modifier: MutableState<Modifier> = mutableStateOf(Modifier)
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 class RowView(context: Context, appContext: AppContext) : ExpoComposeView<LayoutProps>(context, appContext) {
@@ -105,7 +105,7 @@ class RowView(context: Context, appContext: AppContext) : ExpoComposeView<Layout
     Row(
       horizontalArrangement = props.horizontalArrangement.value.toComposeArrangement(),
       verticalAlignment = props.verticalAlignment.value.toComposeAlignment(),
-      modifier = modifier.then(props.modifier.value)
+      modifier = modifier.then(Modifier.fromExpoModifiers(props.modifiers.value))
     ) {
       Children()
     }
@@ -120,7 +120,7 @@ class ColumnView(context: Context, appContext: AppContext) : ExpoComposeView<Lay
     Column(
       verticalArrangement = props.verticalArrangement.value.toComposeArrangement(),
       horizontalAlignment = props.horizontalAlignment.value.toComposeAlignment(),
-      modifier = modifier.then(props.modifier.value)
+      modifier = modifier.then(Modifier.fromExpoModifiers(props.modifiers.value))
     ) {
       Children()
     }
@@ -162,7 +162,7 @@ data class TextProps(
   val color: MutableState<AndroidColor?> = mutableStateOf(null),
   val fontSize: MutableState<Float> = mutableFloatStateOf(16f),
   val fontWeight: MutableState<TextFontWeight> = mutableStateOf(TextFontWeight.NORMAL),
-  val modifier: MutableState<Modifier> = mutableStateOf(Modifier)
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 class TextView(context: Context, appContext: AppContext) : ExpoComposeView<TextProps>(context, appContext) {
@@ -172,12 +172,12 @@ class TextView(context: Context, appContext: AppContext) : ExpoComposeView<TextP
   override fun Content(modifier: Modifier) {
     Text(
       text = props.text.value,
+      modifier = modifier.then(Modifier.fromExpoModifiers(props.modifiers.value)),
       color = colorToComposeColor(props.color.value),
       style = TextStyle(
         fontSize = props.fontSize.value.sp,
         fontWeight = props.fontWeight.value.toComposeFontWeight()
-      ),
-      modifier = modifier.then(props.modifier.value)
+      )
     )
   }
 }

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

@@ -61,7 +61,8 @@ data class DateTimePickerProps(
   val displayedComponents: MutableState<DisplayedComponents> = mutableStateOf(DisplayedComponents.DATE),
   val showVariantToggle: MutableState<Boolean> = mutableStateOf(true),
   val is24Hour: MutableState<Boolean> = mutableStateOf(true),
-  val color: MutableState<AndroidColor?> = mutableStateOf(null)
+  val color: MutableState<AndroidColor?> = mutableStateOf(null),
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 @SuppressLint("ViewConstructor")
@@ -74,11 +75,11 @@ class DateTimePickerView(context: Context, appContext: AppContext) :
   @Composable
   override fun Content(modifier: Modifier) {
     if (props.displayedComponents.value == DisplayedComponents.HOUR_AND_MINUTE) {
-      ExpoTimePicker(props = props) {
+      ExpoTimePicker(props = props, modifier = Modifier.fromExpoModifiers(props.modifiers.value)) {
         onDateSelected(it)
       }
     } else {
-      ExpoDatePicker(props = props) {
+      ExpoDatePicker(props = props, modifier = Modifier.fromExpoModifiers(props.modifiers.value)) {
         onDateSelected(it)
       }
     }

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

@@ -1,5 +1,23 @@
 package expo.modules.ui
 
+import android.graphics.Color
+import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.offset
+import androidx.compose.foundation.layout.padding
+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.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
 import expo.modules.kotlin.modules.Module
 import expo.modules.kotlin.modules.ModuleDefinition
 import expo.modules.ui.button.Button
@@ -9,6 +27,18 @@ class ExpoUIModule : Module() {
   override fun definition() = ModuleDefinition {
     Name("ExpoUI")
 
+    Class("ExpoModifier", ExpoModifier::class) {
+      Constructor {
+        // Create an instance of ExpoModifier with a null reference
+        ExpoModifier(null)
+      }
+
+      Function("toString") { ref: ExpoModifier ->
+        // Return a string representation of the modifier
+        "ExpoModifier(ref=${ref.ref})"
+      }
+    }
+
     // Defines a single view for now – a single choice segmented control
     View(PickerView::class) {
       Events("onOptionSelected")
@@ -66,5 +96,63 @@ class ExpoUIModule : Module() {
         "onConfirmPressed"
       )
     }
+
+    Function("padding") { all: Int ->
+      return@Function ExpoModifier(Modifier.padding(Dp(all.toFloat())))
+    }
+
+    Function("size") { width: Int, height: Int ->
+      return@Function ExpoModifier(Modifier.size(width.dp, height.dp))
+    }
+
+    Function("fillMaxSize") {
+      return@Function ExpoModifier(Modifier.fillMaxSize())
+    }
+
+    Function("offset") { x: Int, y: Int ->
+      return@Function ExpoModifier(Modifier.offset(x.dp, y.dp))
+    }
+
+    Function("background") { color: Color ->
+      return@Function ExpoModifier(Modifier.background(color.compose))
+    }
+
+    Function("border") { borderWidth: Int, borderColor: Color ->
+      return@Function ExpoModifier(Modifier.border(BorderStroke(borderWidth.dp, borderColor.compose)))
+    }
+
+    Function("shadow") { elevation: Int ->
+      return@Function ExpoModifier(Modifier.shadow(elevation.dp)) // TODO: Support more options
+    }
+
+    Function("alpha") { alpha: Float ->
+      return@Function ExpoModifier(Modifier.alpha(alpha))
+    }
+
+    Function("blur") { radius: Int ->
+      return@Function ExpoModifier(Modifier.blur(radius.dp))
+    }
+
+    Function("clickable") { callback: JavaScriptFunction<Any?> ->
+      return@Function ExpoModifier(
+        Modifier.clickable(
+          onClick = {
+            appContext.executeOnJavaScriptThread {
+              callback.invoke()
+            }
+          }
+        )
+      )
+    }
+
+    Function("rotate") { degrees: Float ->
+      return@Function ExpoModifier(Modifier.rotate(degrees))
+    }
+
+    Function("zIndex") { index: Float ->
+      return@Function ExpoModifier(Modifier.zIndex(index))
+    }
+
+    // TODO: Consider implementing semantics, layoutId, clip, navigationBarsPadding, systemBarsPadding
   }
 }

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

@@ -0,0 +1,15 @@
+package expo.modules.ui
+
+import androidx.compose.ui.Modifier
+import expo.modules.kotlin.sharedobjects.SharedRef
+
+class ExpoModifier(ref: Modifier?) : SharedRef<Modifier?>(ref)
+
+fun Modifier.fromExpoModifiers(
+  modifiers: List<ExpoModifier>
+): Modifier {
+  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

@@ -72,7 +72,9 @@ data class PickerProps(
   val options: MutableState<Array<String>> = mutableStateOf(emptyArray()),
   val selectedIndex: MutableState<Int?> = mutableStateOf(null),
   val elementColors: MutableState<PickerColors> = mutableStateOf(PickerColors()),
-  val variant: MutableState<String> = mutableStateOf("segmented")
+  val variant: MutableState<String> = mutableStateOf("segmented"),
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList()),
+  val buttonModifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 class PickerView(context: Context, appContext: AppContext) :
@@ -91,7 +93,9 @@ class PickerView(context: Context, appContext: AppContext) :
     fun SegmentedComposable() {
       DynamicTheme {
         AutoSizingComposable(shadowNodeProxy) {
-          SingleChoiceSegmentedButtonRow {
+          SingleChoiceSegmentedButtonRow(
+            modifier = Modifier.fromExpoModifiers(props.modifiers.value)
+          ) {
             options.forEachIndexed { index, label ->
               SegmentedButton(
                 shape = SegmentedButtonDefaults.itemShape(
@@ -101,6 +105,7 @@ class PickerView(context: Context, appContext: AppContext) :
                 onClick = {
                   onOptionSelected(mapOf("index" to index, "label" to label))
                 },
+                modifier = Modifier.fromExpoModifiers(props.buttonModifiers.value),
                 selected = index == selectedIndex,
                 label = { Text(label) },
                 colors = SegmentedButtonDefaults.colors(

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

@@ -33,7 +33,8 @@ data class ProgressProps(
   val variant: MutableState<ProgressVariant> = mutableStateOf(ProgressVariant.CIRCULAR),
   val progress: MutableState<Float?> = mutableStateOf(null),
   val color: MutableState<Color?> = mutableStateOf(null),
-  val elementColors: MutableState<ProgressColors> = mutableStateOf(ProgressColors())
+  val elementColors: MutableState<ProgressColors> = mutableStateOf(ProgressColors()),
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 class ProgressView(context: Context, appContext: AppContext) :
@@ -57,7 +58,8 @@ class ProgressView(context: Context, appContext: AppContext) :
                 progress = { progress },
                 color = composeColor,
                 trackColor = trackColor,
-                drawStopIndicator = {}
+                drawStopIndicator = {},
+                modifier = Modifier.fromExpoModifiers(props.modifiers.value)
               )
             } else {
               LinearProgressIndicator(color = composeColor, trackColor = trackColor)
@@ -70,12 +72,14 @@ class ProgressView(context: Context, appContext: AppContext) :
               CircularProgressIndicator(
                 progress = { progress },
                 color = composeColor,
-                trackColor = colors.trackColor.composeOrNull ?: ProgressIndicatorDefaults.circularDeterminateTrackColor
+                trackColor = colors.trackColor.composeOrNull ?: ProgressIndicatorDefaults.circularDeterminateTrackColor,
+                modifier = Modifier.fromExpoModifiers(props.modifiers.value)
               )
             } else {
               CircularProgressIndicator(
                 color = composeColor,
-                trackColor = colors.trackColor.composeOrNull ?: ProgressIndicatorDefaults.circularIndeterminateTrackColor
+                trackColor = colors.trackColor.composeOrNull ?: ProgressIndicatorDefaults.circularIndeterminateTrackColor,
+                modifier = Modifier.fromExpoModifiers(props.modifiers.value)
               )
             }
           }

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

@@ -44,7 +44,8 @@ data class ShapeProps(
   val innerRadius: MutableState<Float> = mutableFloatStateOf(0.0f),
   val radius: MutableState<Float> = mutableFloatStateOf(0.0f),
   val type: MutableState<ShapeType> = mutableStateOf(ShapeType.CIRCLE),
-  val color: MutableState<GraphicsColor?> = mutableStateOf(null)
+  val color: MutableState<GraphicsColor?> = mutableStateOf(null),
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 private fun Size.centerX() = this.width / 2
@@ -129,7 +130,7 @@ class ShapeView(context: Context, appContext: AppContext) : ExpoComposeView<Shap
     val (verticesCount) = props.verticesCount
     val (color) = props.color
     Box(
-      modifier = Modifier
+      modifier = Modifier.fromExpoModifiers(props.modifiers.value)
         .drawWithCache {
           val path = when (shapeType) {
             ShapeType.STAR -> createStarPath(size = size, cornerRounding = cornerRounding, smoothing = smoothing, innerRadius = innerRadius, radius = radius, verticesCount = verticesCount)

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

@@ -39,7 +39,8 @@ data class SliderProps(
   val min: MutableState<Float> = mutableFloatStateOf(0.0f),
   val max: MutableState<Float> = mutableFloatStateOf(1.0f),
   val steps: MutableState<Int> = mutableIntStateOf(0),
-  val elementColors: MutableState<SliderColors> = mutableStateOf(SliderColors())
+  val elementColors: MutableState<SliderColors> = mutableStateOf(SliderColors()),
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 class SliderView(context: Context, appContext: AppContext) :
@@ -68,7 +69,8 @@ class SliderView(context: Context, appContext: AppContext) :
           inactiveTrackColor = colors.inactiveTrackColor.compose,
           activeTickColor = colors.activeTickColor.compose,
           inactiveTickColor = colors.inactiveTickColor.compose
-        )
+        ),
+        modifier = Modifier.fromExpoModifiers(props.modifiers.value)
       )
     }
   }

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

@@ -58,7 +58,8 @@ class SwitchColors : Record {
 data class SwitchProps(
   val value: MutableState<Boolean> = mutableStateOf(false),
   val variant: MutableState<String> = mutableStateOf("switch"),
-  val elementColors: MutableState<SwitchColors> = mutableStateOf(SwitchColors())
+  val elementColors: MutableState<SwitchColors> = mutableStateOf(SwitchColors()),
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 @Composable
@@ -129,7 +130,7 @@ class SwitchView(context: Context, appContext: AppContext) :
     }
 
     AutoSizingComposable(shadowNodeProxy) {
-      ThemedHybridSwitch(variant, checked, onCheckedChange, colors)
+      ThemedHybridSwitch(variant, checked, onCheckedChange, colors, modifier.fromExpoModifiers(props.modifiers.value))
     }
   }
 }

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

@@ -31,7 +31,8 @@ data class TextInputProps(
   val numberOfLines: MutableState<Int?> = mutableStateOf(null),
   val keyboardType: MutableState<String> = mutableStateOf("default"),
   val autocorrection: MutableState<Boolean> = mutableStateOf(true),
-  val autoCapitalize: MutableState<String> = mutableStateOf("none")
+  val autoCapitalize: MutableState<String> = mutableStateOf("none"),
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 private fun String.keyboardType(): KeyboardType {
@@ -90,7 +91,8 @@ class TextInputView(context: Context, appContext: AppContext) :
           keyboardType = props.keyboardType.value.keyboardType(),
           autoCorrectEnabled = props.autocorrection.value,
           capitalization = props.autoCapitalize.value.autoCapitalize()
-        )
+        ),
+        modifier = Modifier.fromExpoModifiers(props.modifiers.value)
       )
     }
   }

package/android/src/main/java/expo/modules/ui/button/Button.kt

@@ -27,7 +27,9 @@ import expo.modules.kotlin.views.ComposeProps
 import java.io.Serializable
 import expo.modules.kotlin.types.Enumerable
 import expo.modules.ui.DynamicTheme
+import expo.modules.ui.ExpoModifier
 import expo.modules.ui.compose
+import expo.modules.ui.fromExpoModifiers
 import expo.modules.ui.getImageVector
 
 open class ButtonPressedEvent() : Record, Serializable
@@ -59,11 +61,12 @@ data class ButtonProps(
   val variant: MutableState<ButtonVariant?> = mutableStateOf(ButtonVariant.DEFAULT),
   val elementColors: MutableState<ButtonColors> = mutableStateOf(ButtonColors()),
   val systemImage: MutableState<String?> = mutableStateOf(null),
-  val disabled: MutableState<Boolean> = mutableStateOf(false)
+  val disabled: MutableState<Boolean> = mutableStateOf(false),
+  val modifiers: MutableState<List<ExpoModifier>> = mutableStateOf(emptyList())
 ) : ComposeProps
 
 @Composable
-fun StyledButton(variant: ButtonVariant, colors: ButtonColors, disabled: Boolean, onPress: () -> Unit, content: @Composable (RowScope.() -> Unit)) {
+fun StyledButton(variant: ButtonVariant, colors: ButtonColors, disabled: Boolean, onPress: () -> Unit, modifier: Modifier = Modifier, content: @Composable (RowScope.() -> Unit)) {
   when (variant) {
     ButtonVariant.BORDERED -> FilledTonalButton(
       onPress,
@@ -74,7 +77,8 @@ fun StyledButton(variant: ButtonVariant, colors: ButtonColors, disabled: Boolean
         contentColor = colors.contentColor.compose,
         disabledContainerColor = colors.disabledContainerColor.compose,
         disabledContentColor = colors.disabledContentColor.compose
-      )
+      ),
+      modifier = modifier
     )
 
     ButtonVariant.BORDERLESS -> TextButton(
@@ -86,7 +90,8 @@ fun StyledButton(variant: ButtonVariant, colors: ButtonColors, disabled: Boolean
         contentColor = colors.contentColor.compose,
         disabledContainerColor = colors.disabledContainerColor.compose,
         disabledContentColor = colors.disabledContentColor.compose
-      )
+      ),
+      modifier = modifier
     )
 
     ButtonVariant.OUTLINED -> OutlinedButton(
@@ -98,7 +103,8 @@ fun StyledButton(variant: ButtonVariant, colors: ButtonColors, disabled: Boolean
         contentColor = colors.contentColor.compose,
         disabledContainerColor = colors.disabledContainerColor.compose,
         disabledContentColor = colors.disabledContentColor.compose
-      )
+      ),
+      modifier = modifier
     )
 
     ButtonVariant.ELEVATED -> ElevatedButton(
@@ -110,7 +116,8 @@ fun StyledButton(variant: ButtonVariant, colors: ButtonColors, disabled: Boolean
         contentColor = colors.contentColor.compose,
         disabledContainerColor = colors.disabledContainerColor.compose,
         disabledContentColor = colors.disabledContentColor.compose
-      )
+      ),
+      modifier = modifier
     )
 
     else -> androidx.compose.material3.Button(
@@ -122,7 +129,8 @@ fun StyledButton(variant: ButtonVariant, colors: ButtonColors, disabled: Boolean
         contentColor = colors.contentColor.compose,
         disabledContainerColor = colors.disabledContainerColor.compose,
         disabledContentColor = colors.disabledContentColor.compose
-      )
+      ),
+      modifier = modifier
     )
   }
 }
@@ -149,7 +157,8 @@ class Button(context: Context, appContext: AppContext) :
         variant ?: ButtonVariant.DEFAULT,
         colors,
         disabled,
-        { onButtonPressed.invoke(ButtonPressedEvent()) }
+        onPress = { onButtonPressed.invoke(ButtonPressedEvent()) },
+        modifier = Modifier.fromExpoModifiers(props.modifiers.value)
       ) {
         if (systemImage != null) {
           Row(verticalAlignment = Alignment.CenterVertically) {

package/build/jetpack-compose/AlertDialog/index.d.ts

@@ -1,3 +1,4 @@
+import { ExpoModifier } from '../../types';
 export type AlertDialogProps = {
     /**
      * The title of the alert dialog.
@@ -29,6 +30,8 @@ export type AlertDialogProps = {
      * Callback that is called when the user tries to dismiss the dialog.
      */
     onDismissPressed?: () => void;
+    /** Modifiers for the component */
+    modifiers?: ExpoModifier[];
 };
 export type NativeAlertDialogProps = AlertDialogProps;
 /**

package/build/jetpack-compose/AlertDialog/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/AlertDialog/index.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,gBAAgB,CAAC;AAOtD;;GAEG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BAElD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/AlertDialog/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3C,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAE9B,kCAAkC;IAClC,SAAS,CAAC,EAAE,YAAY,EAAE,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,gBAAgB,CAAC;AAOtD;;GAEG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BAQlD"}

package/build/jetpack-compose/AlertDialog/index.js

@@ -4,6 +4,8 @@ const AlertDialogNativeView = requireNativeView('ExpoUI', 'AlertDialogView');
  * Renders an `AlertDialog` component.
  */
 export function AlertDialog(props) {
-    return <AlertDialogNativeView {...props}/>;
+    return (<AlertDialogNativeView {...props} 
+    // @ts-expect-error
+    modifiers={props.modifiers?.map((m) => m.__expo_shared_object_id__)}/>);
 }
 //# sourceMappingURL=index.js.map

package/build/jetpack-compose/AlertDialog/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/jetpack-compose/AlertDialog/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AAqCzC,MAAM,qBAAqB,GAAgD,iBAAiB,CAC1F,QAAQ,EACR,iBAAiB,CAClB,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,WAAW,CAAC,KAAuB;IACjD,OAAO,CAAC,qBAAqB,CAAC,IAAI,KAAK,CAAC,EAAG,CAAC;AAC9C,CAAC","sourcesContent":["import { requireNativeView } from 'expo';\n\nexport type AlertDialogProps = {\n  /**\n   * The title of the alert dialog.\n   */\n  title?: string;\n  /**\n   * The text of the alert dialog.\n   */\n  text?: string;\n  /**\n   * The text of the confirm button of the alert dialog.\n   */\n  confirmButtonText?: string;\n  /**\n   * The text of the dismiss button of the alert dialog.\n   */\n  dismissButtonText?: string;\n  /**\n   * Whether the alert dialog is visible.\n   *\n   * @default false\n   */\n  visible?: boolean;\n  /**\n   * Callback that is called when the user tries to confirm the dialog.\n   */\n  onConfirmPressed?: () => void;\n  /**\n   * Callback that is called when the user tries to dismiss the dialog.\n   */\n  onDismissPressed?: () => void;\n};\n\nexport type NativeAlertDialogProps = AlertDialogProps;\n\nconst AlertDialogNativeView: React.ComponentType<NativeAlertDialogProps> = requireNativeView(\n  'ExpoUI',\n  'AlertDialogView'\n);\n\n/**\n * Renders an `AlertDialog` component.\n */\nexport function AlertDialog(props: AlertDialogProps) {\n  return <AlertDialogNativeView {...props} />;\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/jetpack-compose/AlertDialog/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AA0CzC,MAAM,qBAAqB,GAAgD,iBAAiB,CAC1F,QAAQ,EACR,iBAAiB,CAClB,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,WAAW,CAAC,KAAuB;IACjD,OAAO,CACL,CAAC,qBAAqB,CACpB,IAAI,KAAK,CAAC;IACV,mBAAmB;IACnB,SAAS,CAAC,CAAC,KAAK,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,EACpE,CACH,CAAC;AACJ,CAAC","sourcesContent":["import { requireNativeView } from 'expo';\n\nimport { ExpoModifier } from '../../types';\n\nexport type AlertDialogProps = {\n  /**\n   * The title of the alert dialog.\n   */\n  title?: string;\n  /**\n   * The text of the alert dialog.\n   */\n  text?: string;\n  /**\n   * The text of the confirm button of the alert dialog.\n   */\n  confirmButtonText?: string;\n  /**\n   * The text of the dismiss button of the alert dialog.\n   */\n  dismissButtonText?: string;\n  /**\n   * Whether the alert dialog is visible.\n   *\n   * @default false\n   */\n  visible?: boolean;\n  /**\n   * Callback that is called when the user tries to confirm the dialog.\n   */\n  onConfirmPressed?: () => void;\n  /**\n   * Callback that is called when the user tries to dismiss the dialog.\n   */\n  onDismissPressed?: () => void;\n\n  /** Modifiers for the component */\n  modifiers?: ExpoModifier[];\n};\n\nexport type NativeAlertDialogProps = AlertDialogProps;\n\nconst AlertDialogNativeView: React.ComponentType<NativeAlertDialogProps> = requireNativeView(\n  'ExpoUI',\n  'AlertDialogView'\n);\n\n/**\n * Renders an `AlertDialog` component.\n */\nexport function AlertDialog(props: AlertDialogProps) {\n  return (\n    <AlertDialogNativeView\n      {...props}\n      // @ts-expect-error\n      modifiers={props.modifiers?.map((m) => m.__expo_shared_object_id__)}\n    />\n  );\n}\n"]}

package/build/jetpack-compose/Button/index.d.ts

@@ -1,6 +1,6 @@
 import { StyleProp, ViewStyle } from 'react-native';
 import { MaterialIcon } from './types';
-import { ViewEvent } from '../../types';
+import { ExpoModifier, ViewEvent } from '../../types';
 /**
  * The built-in button styles available on Android.
  * - `outlined` - A button with an outline.
@@ -51,6 +51,8 @@ export type ButtonProps = {
      * Disabled state of the button.
      */
     disabled?: boolean;
+    /** Modifiers for the component */
+    modifiers?: ExpoModifier[];
 };
 /**
  * @hidden

package/build/jetpack-compose/Button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/Button/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAc,SAAS,EAAE,MAAM,cAAc,CAAC;AAEhE,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,UAAU,GAAG,YAAY,GAAG,UAAU,GAAG,UAAU,CAAC;AAE5F;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B;;OAEG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAClC,WAAW,EACX,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,aAAa,CAChD,GAAG;IACF,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC,iBAAiB,EAAE,IAAI,CAAC,CAAC;AAQvC;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,WAAW,GAAG,iBAAiB,CAe1E;AAED;;GAEG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,+BAQxC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/Button/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAc,SAAS,EAAE,MAAM,cAAc,CAAC;AAEhE,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAEtD;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,UAAU,GAAG,YAAY,GAAG,UAAU,GAAG,UAAU,CAAC;AAE5F;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B;;OAEG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,kCAAkC;IAClC,SAAS,CAAC,EAAE,YAAY,EAAE,CAAC;CAC5B,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAClC,WAAW,EACX,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,aAAa,CAChD,GAAG;IACF,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC,iBAAiB,EAAE,IAAI,CAAC,CAAC;AAQvC;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,WAAW,GAAG,iBAAiB,CAiB1E;AAED;;GAEG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,+BAQxC"}

package/build/jetpack-compose/Button/index.js

@@ -12,6 +12,8 @@ export function transformButtonProps(props) {
         text: children ?? '',
         systemImage,
         onButtonPressed: onPress,
+        // @ts-expect-error
+        modifiers: props.modifiers?.map((m) => m.__expo_shared_object_id__),
         elementColors: props.elementColors
             ? props.elementColors
             : props.color

package/build/jetpack-compose/Button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/jetpack-compose/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AACzC,OAAO,EAAa,UAAU,EAAa,MAAM,cAAc,CAAC;AAsEhE,wFAAwF;AACxF,MAAM,gBAAgB,GAA2C,iBAAiB,CAChF,QAAQ,EACR,QAAQ,CACT,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,oBAAoB,CAAC,KAAkB;IACrD,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAC/D,OAAO;QACL,GAAG,SAAS;QACZ,IAAI,EAAE,QAAQ,IAAI,EAAE;QACpB,WAAW;QACX,eAAe,EAAE,OAAO;QACxB,aAAa,EAAE,KAAK,CAAC,aAAa;YAChC,CAAC,CAAC,KAAK,CAAC,aAAa;YACrB,CAAC,CAAC,KAAK,CAAC,KAAK;gBACX,CAAC,CAAC;oBACE,cAAc,EAAE,KAAK,CAAC,KAAK;iBAC5B;gBACH,CAAC,CAAC,SAAS;KAChB,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,MAAM,CAAC,KAAkB;IACvC,4EAA4E;IAC5E,OAAO,CACL,CAAC,gBAAgB,CACf,IAAI,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAChC,KAAK,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,EACxE,CACH,CAAC;AACJ,CAAC","sourcesContent":["import { requireNativeView } from 'expo';\nimport { StyleProp, StyleSheet, ViewStyle } from 'react-native';\n\nimport { MaterialIcon } from './types';\nimport { ViewEvent } from '../../types';\n\n/**\n * The built-in button styles available on Android.\n * - `outlined` - A button with an outline.\n * - `elevated` - A filled button with a shadow.\n */\nexport type ButtonVariant = 'default' | 'bordered' | 'borderless' | 'outlined' | 'elevated';\n\n/**\n * Colors for button's core elements.\n */\nexport type ButtonElementColors = {\n  containerColor?: string;\n  contentColor?: string;\n  disabledContainerColor?: string;\n  disabledContentColor?: string;\n};\n\nexport type ButtonProps = {\n  /**\n   * A callback that is called when the button is pressed.\n   */\n  onPress?: () => void;\n  /**\n   * A string describing the system image to display in the button.\n   * Uses Material Icons on Android.\n   */\n  systemImage?: MaterialIcon;\n  /**\n   * The button variant.\n   */\n  variant?: ButtonVariant;\n  /**\n   * Additional styles to apply to the button.\n   */\n  style?: StyleProp<ViewStyle>;\n  /**\n   * The text to display inside the button.\n   */\n  children: string;\n  /**\n   * Colors for button's core elements.\n   * @platform android\n   */\n  elementColors?: ButtonElementColors;\n  /**\n   * Button color.\n   */\n  color?: string;\n  /**\n   * Disabled state of the button.\n   */\n  disabled?: boolean;\n};\n\n/**\n * @hidden\n */\nexport type NativeButtonProps = Omit<\n  ButtonProps,\n  'role' | 'onPress' | 'children' | 'systemImage'\n> & {\n  text: string;\n  systemImage?: string;\n} & ViewEvent<'onButtonPressed', void>;\n\n// We have to work around the `role` and `onPress` props being reserved by React Native.\nconst ButtonNativeView: React.ComponentType<NativeButtonProps> = requireNativeView(\n  'ExpoUI',\n  'Button'\n);\n\n/**\n * @hidden\n */\nexport function transformButtonProps(props: ButtonProps): NativeButtonProps {\n  const { children, onPress, systemImage, ...restProps } = props;\n  return {\n    ...restProps,\n    text: children ?? '',\n    systemImage,\n    onButtonPressed: onPress,\n    elementColors: props.elementColors\n      ? props.elementColors\n      : props.color\n        ? {\n            containerColor: props.color,\n          }\n        : undefined,\n  };\n}\n\n/**\n * Displays a native button component.\n */\nexport function Button(props: ButtonProps) {\n  // Min height from https://m3.material.io/components/buttons/specs, minWidth\n  return (\n    <ButtonNativeView\n      {...transformButtonProps(props)}\n      style={StyleSheet.compose({ minWidth: 80, minHeight: 40 }, props.style)}\n    />\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/jetpack-compose/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AACzC,OAAO,EAAa,UAAU,EAAa,MAAM,cAAc,CAAC;AAyEhE,wFAAwF;AACxF,MAAM,gBAAgB,GAA2C,iBAAiB,CAChF,QAAQ,EACR,QAAQ,CACT,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,oBAAoB,CAAC,KAAkB;IACrD,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAC/D,OAAO;QACL,GAAG,SAAS;QACZ,IAAI,EAAE,QAAQ,IAAI,EAAE;QACpB,WAAW;QACX,eAAe,EAAE,OAAO;QACxB,mBAAmB;QACnB,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,yBAAyB,CAAC;QACnE,aAAa,EAAE,KAAK,CAAC,aAAa;YAChC,CAAC,CAAC,KAAK,CAAC,aAAa;YACrB,CAAC,CAAC,KAAK,CAAC,KAAK;gBACX,CAAC,CAAC;oBACE,cAAc,EAAE,KAAK,CAAC,KAAK;iBAC5B;gBACH,CAAC,CAAC,SAAS;KAChB,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,MAAM,CAAC,KAAkB;IACvC,4EAA4E;IAC5E,OAAO,CACL,CAAC,gBAAgB,CACf,IAAI,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAChC,KAAK,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,EACxE,CACH,CAAC;AACJ,CAAC","sourcesContent":["import { requireNativeView } from 'expo';\nimport { StyleProp, StyleSheet, ViewStyle } from 'react-native';\n\nimport { MaterialIcon } from './types';\nimport { ExpoModifier, ViewEvent } from '../../types';\n\n/**\n * The built-in button styles available on Android.\n * - `outlined` - A button with an outline.\n * - `elevated` - A filled button with a shadow.\n */\nexport type ButtonVariant = 'default' | 'bordered' | 'borderless' | 'outlined' | 'elevated';\n\n/**\n * Colors for button's core elements.\n */\nexport type ButtonElementColors = {\n  containerColor?: string;\n  contentColor?: string;\n  disabledContainerColor?: string;\n  disabledContentColor?: string;\n};\n\nexport type ButtonProps = {\n  /**\n   * A callback that is called when the button is pressed.\n   */\n  onPress?: () => void;\n  /**\n   * A string describing the system image to display in the button.\n   * Uses Material Icons on Android.\n   */\n  systemImage?: MaterialIcon;\n  /**\n   * The button variant.\n   */\n  variant?: ButtonVariant;\n  /**\n   * Additional styles to apply to the button.\n   */\n  style?: StyleProp<ViewStyle>;\n  /**\n   * The text to display inside the button.\n   */\n  children: string;\n  /**\n   * Colors for button's core elements.\n   * @platform android\n   */\n  elementColors?: ButtonElementColors;\n  /**\n   * Button color.\n   */\n  color?: string;\n  /**\n   * Disabled state of the button.\n   */\n  disabled?: boolean;\n\n  /** Modifiers for the component */\n  modifiers?: ExpoModifier[];\n};\n\n/**\n * @hidden\n */\nexport type NativeButtonProps = Omit<\n  ButtonProps,\n  'role' | 'onPress' | 'children' | 'systemImage'\n> & {\n  text: string;\n  systemImage?: string;\n} & ViewEvent<'onButtonPressed', void>;\n\n// We have to work around the `role` and `onPress` props being reserved by React Native.\nconst ButtonNativeView: React.ComponentType<NativeButtonProps> = requireNativeView(\n  'ExpoUI',\n  'Button'\n);\n\n/**\n * @hidden\n */\nexport function transformButtonProps(props: ButtonProps): NativeButtonProps {\n  const { children, onPress, systemImage, ...restProps } = props;\n  return {\n    ...restProps,\n    text: children ?? '',\n    systemImage,\n    onButtonPressed: onPress,\n    // @ts-expect-error\n    modifiers: props.modifiers?.map((m) => m.__expo_shared_object_id__),\n    elementColors: props.elementColors\n      ? props.elementColors\n      : props.color\n        ? {\n            containerColor: props.color,\n          }\n        : undefined,\n  };\n}\n\n/**\n * Displays a native button component.\n */\nexport function Button(props: ButtonProps) {\n  // Min height from https://m3.material.io/components/buttons/specs, minWidth\n  return (\n    <ButtonNativeView\n      {...transformButtonProps(props)}\n      style={StyleSheet.compose({ minWidth: 80, minHeight: 40 }, props.style)}\n    />\n  );\n}\n"]}

package/build/jetpack-compose/ContextMenu/index.d.ts

@@ -1,5 +1,6 @@
 import { ReactElement, ReactNode } from 'react';
 import { NativeSyntheticEvent, StyleProp, ViewStyle } from 'react-native';
+import { ExpoModifier } from '../../types';
 import { ButtonProps } from '../Button';
 import { PickerProps } from '../Picker';
 import { SwitchProps } from '../Switch';
@@ -48,6 +49,8 @@ export type ContextMenuProps = {
      * Optional styles to apply to the `ContextMenu`.
      */
     style?: StyleProp<ViewStyle>;
+    /** Modifiers for the component */
+    modifiers?: ExpoModifier[];
 };
 /**
  * Props of the `Submenu` component.

package/build/jetpack-compose/ContextMenu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/ContextMenu/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,YAAY,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AACnE,OAAO,EAAE,oBAAoB,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG1E,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAOxC,KAAK,cAAc,GACf,YAAY,CAAC,WAAW,CAAC,GACzB,YAAY,CAAC,WAAW,CAAC,GACzB,YAAY,CAAC,WAAW,CAAC,GACzB,YAAY,CAAC,YAAY,CAAC,CAAC;AAE/B,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,EAAE,cAAc,GAAG,cAAc,EAAE,CAAC;CAC7C,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,CAChC,MAAM,EACN,MAAM,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,CAC3D,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG;IAAE,oBAAoB,EAAE,MAAM,CAAA;CAAE,CAAC;AAEtE;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,aAAa,GAAG,WAAW,CAAC;AAE3D;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IAEpC;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,MAAM,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAClC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAyBF,wBAAgB,OAAO,gCAEtB;AAED,wBAAgB,KAAK,gCAEpB;yBAFe,KAAK;;;AAKrB,wBAAgB,OAAO,CAAC,KAAK,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,+BAE3D;yBAFe,OAAO;;;AAKvB,wBAAgB,OAAO,CAAC,KAAK,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,+BAE3D;AAED,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BAmC3C;kBAnCQ,WAAW;;;;;AAyCpB,OAAO,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/jetpack-compose/ContextMenu/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,YAAY,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AACnE,OAAO,EAAE,oBAAoB,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG1E,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAOxC,KAAK,cAAc,GACf,YAAY,CAAC,WAAW,CAAC,GACzB,YAAY,CAAC,WAAW,CAAC,GACzB,YAAY,CAAC,WAAW,CAAC,GACzB,YAAY,CAAC,YAAY,CAAC,CAAC;AAE/B,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,EAAE,cAAc,GAAG,cAAc,EAAE,CAAC;CAC7C,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,CAChC,MAAM,EACN,MAAM,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,CAC3D,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG;IAAE,oBAAoB,EAAE,MAAM,CAAA;CAAE,CAAC;AAEtE;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,aAAa,GAAG,WAAW,CAAC;AAE3D;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IAEpC;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B,kCAAkC;IAClC,SAAS,CAAC,EAAE,YAAY,EAAE,CAAC;CAC5B,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,MAAM,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAClC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAyBF,wBAAgB,OAAO,gCAEtB;AAED,wBAAgB,KAAK,gCAEpB;yBAFe,KAAK;;;AAKrB,wBAAgB,OAAO,CAAC,KAAK,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,+BAE3D;yBAFe,OAAO;;;AAKvB,wBAAgB,OAAO,CAAC,KAAK,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,+BAE3D;AAED,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BAqC3C;kBArCQ,WAAW;;;;;AA2CpB,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/build/jetpack-compose/ContextMenu/index.js

@@ -25,7 +25,9 @@ function ContextMenu(props) {
         const handler = eventHandlersMap[e.nativeEvent.contextMenuElementID]?.[handlerType];
         handler?.(e);
     };
-    return (<MenuNativeView style={props.style} elements={processedElements} onContextMenuButtonPressed={createEventHandler('onPress')} onContextMenuSwitchValueChanged={createEventHandler('onValueChange')} onContextMenuPickerOptionSelected={createEventHandler('onOptionSelected')} {...props}>
+    return (<MenuNativeView style={props.style} elements={processedElements} onContextMenuButtonPressed={createEventHandler('onPress')} onContextMenuSwitchValueChanged={createEventHandler('onValueChange')} onContextMenuPickerOptionSelected={createEventHandler('onOptionSelected')} 
+    // @ts-expect-error
+    modifiers={props.modifiers?.map((m) => m.__expo_shared_object_id__)} {...props}>
       {activationElement}
     </MenuNativeView>);
 }