@expo/ui 55.0.2 → 55.0.4

package/src/swift-ui/Text/index.tsx

@@ -2,7 +2,12 @@ import { requireNativeView } from 'expo';
 import * as React from 'react';
 
 import { createViewModifierEventListener } from '../modifiers/utils';
-import { type CommonViewModifierProps } from '../types';
+import { type ClosedRangeDate, type CommonViewModifierProps } from '../types';
+
+/**
+ * The style used to format a date in a SwiftUI `Text` view.
+ */
+export type TextDateStyle = 'timer' | 'relative' | 'offset' | 'date' | 'time';
 
 export interface TextProps extends CommonViewModifierProps {
   /**
@@ -14,12 +19,50 @@ export interface TextProps extends CommonViewModifierProps {
    * Enables Markdown formatting for the text content using SwiftUI LocalizedStringKey.
    */
   markdownEnabled?: boolean;
+
+  /**
+   * A date to display using the specified `dateStyle`. The text auto-updates as time passes.
+   */
+  date?: Date;
+
+  /**
+   * The style used to format the `date` prop.
+   * @default 'date'
+   */
+  dateStyle?: TextDateStyle;
+
+  /**
+   * A time interval to display as a live-updating timer.
+   * @platform ios 16.0+
+   * @platform tvos 16.0+
+   */
+  timerInterval?: ClosedRangeDate;
+
+  /**
+   * Whether the timer counts down (`true`) or up (`false`).
+   * @default true
+   * @platform ios 16.0+
+   * @platform tvos 16.0+
+   */
+  countsDown?: boolean;
+
+  /**
+   * A date at which the timer should appear paused.
+   * @platform ios 16.0+
+   * @platform tvos 16.0+
+   */
+  pauseTime?: Date;
 }
 
 type NativeTextProps = CommonViewModifierProps & {
   text?: string;
   children?: React.ReactNode;
   markdownEnabled?: boolean;
+  date?: number;
+  dateStyle?: TextDateStyle;
+  timerInterval?: { lower: number; upper: number };
+  countsDown?: boolean;
+  pauseTime?: number;
 };
 
 const TextNativeView: React.ComponentType<NativeTextProps> = requireNativeView(
@@ -28,7 +71,28 @@ const TextNativeView: React.ComponentType<NativeTextProps> = requireNativeView(
 );
 
 export function Text(props: TextProps) {
-  const { children, modifiers, ...restProps } = props;
+  const { children, modifiers, date, timerInterval, pauseTime, ...restProps } = props;
+
+  // Date/timer mode: pass converted timestamps to native, ignore children
+  if (date != null || timerInterval != null) {
+    return (
+      <TextNativeView
+        modifiers={modifiers}
+        {...(modifiers ? createViewModifierEventListener(modifiers) : undefined)}
+        {...restProps}
+        date={date ? date.getTime() : undefined}
+        timerInterval={
+          timerInterval
+            ? {
+                lower: timerInterval.lower.getTime(),
+                upper: timerInterval.upper.getTime(),
+              }
+            : undefined
+        }
+        pauseTime={pauseTime ? pauseTime.getTime() : undefined}
+      />
+    );
+  }
 
   if (children === undefined || children === null) {
     return null;

package/src/swift-ui/index.tsx

@@ -40,4 +40,5 @@ export * from './Shapes';
 export * from './Popover';
 export * from './Grid';
 export * from './RNHostView';
+export * from './Link';
 export { type CommonViewModifierProps } from './types';

package/src/swift-ui/modifiers/environment.ts

@@ -1,10 +1,23 @@
 import { createModifier } from './createModifier';
 
+export type EnvironmentConfig =
+  | { key: 'editMode'; value: 'active' | 'inactive' | 'transient' }
+  | { key: 'colorScheme'; value: 'light' | 'dark' }
+  | { key: 'locale'; value: string }
+  | { key: 'timeZone'; value: string };
+
 /**
  * Sets a SwiftUI environment value.
  * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/environment(_:_:)).
  */
-export const environment = (
-  key: 'editMode' | 'colorScheme',
-  value: 'active' | 'inactive' | 'transient' | 'light' | 'dark'
-) => createModifier('environment', { key, value });
+export function environment(config: EnvironmentConfig): ReturnType<typeof createModifier>;
+export function environment(
+  key: EnvironmentConfig['key'],
+  value: string
+): ReturnType<typeof createModifier>;
+export function environment(configOrKey: EnvironmentConfig | string, value?: string) {
+  if (typeof configOrKey === 'string') {
+    return createModifier('environment', { key: configOrKey, value });
+  }
+  return createModifier('environment', configOrKey);
+}

package/src/swift-ui/modifiers/index.ts

@@ -15,6 +15,7 @@ import { environment } from './environment';
 import { gaugeStyle } from './gaugeStyle';
 import { progressViewStyle } from './progressViewStyle';
 import type { Color } from './types';
+import { widgetAccentedRenderingMode, widgetURL } from './widgets';
 
 const ExpoUI = requireNativeModule('ExpoUI');
 
@@ -567,6 +568,44 @@ export const scrollDismissesKeyboard = (
 export const scrollDisabled = (disabled: boolean = true) =>
   createModifier('scrollDisabled', { disabled });
 
+type UnitPointValue =
+  | 'zero'
+  | 'topLeading'
+  | 'top'
+  | 'topTrailing'
+  | 'leading'
+  | 'center'
+  | 'trailing'
+  | 'bottomLeading'
+  | 'bottom'
+  | 'bottomTrailing';
+
+/**
+ * Sets the default anchor point for a scroll view's content.
+ * @param anchor - The anchor point for initial scroll position and content size changes, or `null` to reset.
+ * @platform ios 17.0+
+ * @platform tvos 17.0+
+ * @platform macos 14.0+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/defaultscrollanchor(_:)).
+ */
+export const defaultScrollAnchor = (anchor: UnitPointValue | null) =>
+  createModifier('defaultScrollAnchor', { anchor });
+
+/**
+ * Sets the default anchor point for a scroll view for a specific role.
+ * Pass `null` to opt out of a specific role while keeping anchors for other roles.
+ * @param anchor - The anchor point, or `null` to opt out of this role.
+ * @param role - The scroll anchor role: `'initialOffset'`, `'sizeChanges'`, or `'alignment'`.
+ * @platform ios 18.0+
+ * @platform tvos 18.0+
+ * @platform macos 15.0+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/defaultscrollanchor(_:for:)).
+ */
+export const defaultScrollAnchorForRole = (
+  anchor: UnitPointValue | null,
+  role: 'initialOffset' | 'sizeChanges' | 'alignment'
+) => createModifier('defaultScrollAnchorForRole', { anchor, role });
+
 /**
  * Disables the move action for a view in a list.
  * Apply to items within a `ForEach` to prevent them from being moved.
@@ -1018,15 +1057,6 @@ export const resizable = (
   resizingMode?: 'stretch' | 'tile'
 ) => createModifier('resizable', { ...capInsets, resizingMode });
 
-/**
- * Specifies the how to render an Image when using the WidgetKit/WidgetRenderingMode/accented mode.
- * @param renderingMode - A constant describing how the Image should be rendered.
- * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/image/widgetaccentedrenderingmode(_:)).
- */
-export const widgetAccentedRenderingMode = (
-  renderingMode: 'fullColor' | 'accented' | 'desaturated' | 'accentedDesaturated'
-) => createModifier('widgetAccentedRenderingMode', { renderingMode });
-
 // =============================================================================
 // Type Definitions
 // =============================================================================
@@ -1097,6 +1127,8 @@ export type BuiltInModifier =
   | ReturnType<typeof containerRelativeFrame>
   | ReturnType<typeof scrollContentBackground>
   | ReturnType<typeof scrollDisabled>
+  | ReturnType<typeof defaultScrollAnchor>
+  | ReturnType<typeof defaultScrollAnchorForRole>
   | ReturnType<typeof moveDisabled>
   | ReturnType<typeof deleteDisabled>
   | ReturnType<typeof environment>
@@ -1129,7 +1161,8 @@ export type BuiltInModifier =
   | ReturnType<typeof listStyle>
   | ReturnType<typeof contentTransition>
   | ReturnType<typeof resizable>
-  | ReturnType<typeof widgetAccentedRenderingMode>;
+  | ReturnType<typeof widgetAccentedRenderingMode>
+  | ReturnType<typeof widgetURL>;
 
 /**
  * Main ViewModifier type that supports both built-in and 3rd party modifiers.
@@ -1174,6 +1207,7 @@ export * from './progressViewStyle';
 export * from './gaugeStyle';
 export * from './presentationModifiers';
 export * from './environment';
+export * from './widgets';
 export type {
   TimingAnimationParams,
   SpringAnimationParams,

package/src/swift-ui/modifiers/widgets.ts

@@ -0,0 +1,18 @@
+import { createModifier } from './createModifier';
+
+/**
+ * Specifies the how to render an Image when using the WidgetKit/WidgetRenderingMode/accented mode.
+ * @param renderingMode - A constant describing how the Image should be rendered.
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/image/widgetaccentedrenderingmode(_:)).
+ */
+export const widgetAccentedRenderingMode = (
+  renderingMode: 'fullColor' | 'accented' | 'desaturated' | 'accentedDesaturated'
+) => createModifier('widgetAccentedRenderingMode', { renderingMode });
+
+/**
+ * Sets the URL to open in the containing app when the user clicks the widget.
+ * Widgets support one widgetURL modifier in their view hierarchy. If multiple views have widgetURL modifiers, the behavior is undefined.
+ * @param url - The URL to open in the containing app.
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/SwiftUI/View/widgetURL(_:)).
+ */
+export const widgetURL = (url: string) => createModifier('widgetURL', { url });

package/src/swift-ui/types.ts

@@ -73,6 +73,11 @@ export interface PaddingProps {
   trailing?: number;
 }
 
+/**
+ * A closed date range with lower and upper bounds.
+ */
+export type ClosedRangeDate = { lower: Date; upper: Date };
+
 /**
  * Common props that can be applied to any view.
  */

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

@@ -1,59 +0,0 @@
-package expo.modules.ui
-
-import androidx.compose.material3.FilterChip
-import androidx.compose.material3.FilterChipDefaults
-import androidx.compose.material3.Text
-import androidx.compose.runtime.Composable
-import expo.modules.kotlin.records.Record
-import expo.modules.kotlin.views.ComposableScope
-import expo.modules.kotlin.views.ComposeProps
-import expo.modules.kotlin.views.FunctionalComposableScope
-import java.io.Serializable
-
-open class FilterChipPressedEvent : Record, Serializable
-
-data class FilterChipProps(
-  val selected: Boolean = false,
-  val label: String = "",
-  val enabled: Boolean = true,
-  val modifiers: ModifierList = emptyList()
-) : ComposeProps
-
-@Composable
-fun FunctionalComposableScope.FilterChipContent(
-  props: FilterChipProps,
-  onPress: (FilterChipPressedEvent) -> Unit
-) {
-  val modifier = ModifierRegistry.applyModifiers(props.modifiers, appContext, composableScope, globalEventDispatcher)
-
-  val leadingIconSlotView = findChildSlotView(view, "leadingIcon")
-  val trailingIconSlotView = findChildSlotView(view, "trailingIcon")
-
-  FilterChip(
-    selected = props.selected,
-    onClick = { onPress(FilterChipPressedEvent()) },
-    label = { Text(props.label) },
-    enabled = props.enabled,
-    leadingIcon = leadingIconSlotView?.let {
-      {
-        with(ComposableScope()) {
-          with(it) {
-            Content()
-          }
-        }
-      }
-    },
-    trailingIcon = trailingIconSlotView?.let {
-      {
-        with(ComposableScope()) {
-          with(it) {
-            Content()
-          }
-        }
-      }
-    },
-    colors = FilterChipDefaults.filterChipColors(),
-    border = FilterChipDefaults.filterChipBorder(enabled = props.enabled, selected = props.selected),
-    modifier = modifier
-  )
-}

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

@@ -1,161 +0,0 @@
-package expo.modules.ui
-
-import android.graphics.Color
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.selection.selectable
-import androidx.compose.foundation.selection.selectableGroup
-import androidx.compose.material3.RadioButton
-import androidx.compose.material3.SegmentedButton
-import androidx.compose.material3.SegmentedButtonDefaults
-import androidx.compose.material3.SingleChoiceSegmentedButtonRow
-import androidx.compose.material3.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.semantics.Role
-import androidx.compose.ui.unit.dp
-import expo.modules.kotlin.records.Field
-import expo.modules.kotlin.records.Record
-import expo.modules.kotlin.views.ComposeProps
-import expo.modules.kotlin.views.FunctionalComposableScope
-
-class PickerColors : Record {
-  @Field
-  val activeBorderColor: Color? = null
-
-  @Field
-  val activeContentColor: Color? = null
-
-  @Field
-  val inactiveBorderColor: Color? = null
-
-  @Field
-  val inactiveContentColor: Color? = null
-
-  @Field
-  val disabledActiveBorderColor: Color? = null
-
-  @Field
-  val disabledActiveContentColor: Color? = null
-
-  @Field
-  val disabledInactiveBorderColor: Color? = null
-
-  @Field
-  val disabledInactiveContentColor: Color? = null
-
-  @Field
-  val activeContainerColor: Color? = null
-
-  @Field
-  val inactiveContainerColor: Color? = null
-
-  @Field
-  val disabledActiveContainerColor: Color? = null
-
-  @Field
-  val disabledInactiveContainerColor: Color? = null
-}
-
-data class PickerProps(
-  val options: Array<String> = emptyArray(),
-  val selectedIndex: Int? = null,
-  val elementColors: PickerColors = PickerColors(),
-  val variant: String = "segmented",
-  val buttonModifiers: List<ModifierType> = emptyList(),
-  val modifiers: ModifierList = emptyList()
-) : ComposeProps
-
-data class PickerOptionSelectedEvent(
-  @Field val index: Int,
-  @Field val label: String
-) : Record
-
-@Composable
-fun FunctionalComposableScope.PickerContent(
-  props: PickerProps,
-  onOptionSelected: (PickerOptionSelectedEvent) -> Unit
-) {
-  val selectedIndex = props.selectedIndex
-  val options = props.options
-  val colors = props.elementColors
-  val variant = props.variant
-
-  @Composable
-  fun SegmentedComposable() {
-    SingleChoiceSegmentedButtonRow(
-      modifier = ModifierRegistry.applyModifiers(props.modifiers, appContext, composableScope, globalEventDispatcher)
-    ) {
-      options.forEachIndexed { index, label ->
-        SegmentedButton(
-          shape = SegmentedButtonDefaults.itemShape(
-            index = index,
-            count = options.size
-          ),
-          onClick = {
-            onOptionSelected(PickerOptionSelectedEvent(index, label))
-          },
-          modifier = ModifierRegistry.applyModifiers(props.modifiers, appContext, composableScope, globalEventDispatcher),
-          selected = index == selectedIndex,
-          label = { Text(label) },
-          colors = SegmentedButtonDefaults.colors(
-            activeBorderColor = colors.activeBorderColor.compose,
-            activeContentColor = colors.activeContentColor.compose,
-            inactiveBorderColor = colors.inactiveBorderColor.compose,
-            inactiveContentColor = colors.inactiveContentColor.compose,
-            disabledActiveBorderColor = colors.disabledActiveBorderColor.compose,
-            disabledActiveContentColor = colors.disabledActiveContentColor.compose,
-            disabledInactiveBorderColor = colors.disabledInactiveBorderColor.compose,
-            disabledInactiveContentColor = colors.disabledInactiveContentColor.compose,
-            activeContainerColor = colors.activeContainerColor.compose,
-            inactiveContainerColor = colors.inactiveContainerColor.compose,
-            disabledActiveContainerColor = colors.disabledActiveContainerColor.compose,
-            disabledInactiveContainerColor = colors.disabledInactiveContainerColor.compose
-          )
-        )
-      }
-    }
-  }
-
-  @Composable
-  fun RadioComposable() {
-    Column(Modifier.selectableGroup()) {
-      options.forEachIndexed { index, label ->
-        Row(
-          Modifier.fillMaxWidth()
-            .height(28.dp)
-            .selectable(
-              selected = index == selectedIndex,
-              onClick = {
-                onOptionSelected(PickerOptionSelectedEvent(index, label))
-              },
-              role = Role.RadioButton
-            ),
-          verticalAlignment = Alignment.CenterVertically
-        ) {
-          RadioButton(
-            selected = index == selectedIndex,
-            onClick = null
-          )
-          Text(
-            text = label,
-            modifier = Modifier.padding(start = 12.dp)
-          )
-        }
-      }
-    }
-  }
-
-  if (variant == "segmented") {
-    SegmentedComposable()
-  } else if (variant == "radio") {
-    RadioComposable()
-  } else {
-    // Default to segmented picker
-    SegmentedComposable()
-  }
-}

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

@@ -1,33 +0,0 @@
-package expo.modules.ui
-
-import android.graphics.Color
-import androidx.compose.material3.Text
-import androidx.compose.material3.TextButton
-import androidx.compose.runtime.Composable
-import expo.modules.kotlin.views.ComposeProps
-import expo.modules.kotlin.views.FunctionalComposableScope
-import expo.modules.ui.button.ButtonPressedEvent
-
-data class TextButtonProps(
-  val text: String = "",
-  val color: Color? = null,
-  val disabled: Boolean = false,
-  val modifiers: ModifierList = emptyList()
-) : ComposeProps
-
-@Composable
-fun FunctionalComposableScope.TextButtonContent(
-  props: TextButtonProps,
-  onButtonPressed: (ButtonPressedEvent) -> Unit
-) {
-  TextButton(
-    onClick = { onButtonPressed(ButtonPressedEvent()) },
-    enabled = !props.disabled,
-    modifier = ModifierRegistry.applyModifiers(props.modifiers, appContext, composableScope, globalEventDispatcher)
-  ) {
-    Text(
-      text = props.text,
-      color = props.color.composeOrNull ?: androidx.compose.ui.graphics.Color.Unspecified
-    )
-  }
-}

package/android/src/main/java/expo/modules/ui/menu/ContextMenu.kt

@@ -1,183 +0,0 @@
-package expo.modules.ui.menu
-
-import androidx.compose.foundation.background
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.wrapContentSize
-import androidx.compose.material3.DropdownMenu
-import androidx.compose.material3.DropdownMenuItem
-import androidx.compose.material3.HorizontalDivider
-import androidx.compose.material3.Icon
-import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.MenuDefaults
-import androidx.compose.material3.MenuItemColors
-import androidx.compose.material3.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.CompositionLocalProvider
-import androidx.compose.runtime.MutableState
-import androidx.compose.runtime.compositionLocalOf
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.remember
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.unit.dp
-import expo.modules.kotlin.viewevent.ViewEventCallback
-import expo.modules.kotlin.views.ComposableScope
-import expo.modules.kotlin.views.FunctionalComposableScope
-import expo.modules.ui.ModifierRegistry
-import expo.modules.ui.ThemedHybridSwitch
-import expo.modules.ui.compose
-import expo.modules.ui.composeOrNull
-import expo.modules.ui.getImageVector
-
-/**
- * CompositionLocal that allows child composables (like Button) to trigger ContextMenu expansion.
- * When a Button is inside a ContextMenu, it can use this to open the menu on click.
- */
-val LocalContextMenuExpanded = compositionLocalOf<MutableState<Boolean>?> { null }
-
-@Composable
-private fun SectionTitle(text: String) {
-  Text(
-    text = text,
-    style = MaterialTheme.typography.labelSmall,
-    color = MaterialTheme.colorScheme.onSurfaceVariant,
-    modifier = Modifier
-      .fillMaxWidth()
-      .padding(start = 16.dp, top = 8.dp, end = 16.dp, bottom = 4.dp)
-  )
-}
-
-@Composable
-fun FlatMenu(elements: Array<ContextMenuElement>, sectionTitle: String?, dispatchers: ContextMenuDispatchers, expanded: MutableState<Boolean>) {
-  sectionTitle?.takeIf { !it.isEmpty() }?.let {
-    SectionTitle(it)
-  }
-  elements.forEachIndexed { index, element ->
-    val id = element.contextMenuElementID
-    element.button?.let {
-      DropdownMenuItem(
-        colors = MenuItemColors(
-          textColor = it.elementColors.contentColor.compose,
-          leadingIconColor = it.elementColors.contentColor.compose,
-          trailingIconColor = it.elementColors.contentColor.compose,
-          disabledTextColor = it.elementColors.disabledContentColor.compose,
-          disabledLeadingIconColor = it.elementColors.disabledContentColor.compose,
-          disabledTrailingIconColor = it.elementColors.disabledContentColor.compose
-        ),
-        enabled = !it.disabled,
-        modifier = Modifier.background(it.elementColors.containerColor.compose),
-        text = { Text(it.text) },
-        leadingIcon = it.leadingIcon?.let { iconName ->
-          {
-            getImageVector(iconName)?.let { imageVector ->
-              Icon(
-                imageVector = imageVector,
-                contentDescription = iconName
-              )
-            }
-          }
-        },
-        trailingIcon = it.trailingIcon?.let { iconName ->
-          {
-            getImageVector(iconName)?.let { imageVector ->
-              Icon(
-                imageVector = imageVector,
-                contentDescription = iconName
-              )
-            }
-          }
-        },
-        onClick = {
-          dispatchers.buttonPressed(ContextMenuButtonPressedEvent(id))
-          expanded.value = false
-        }
-      )
-    }
-
-    element.switch?.let {
-      DropdownMenuItem(
-        text = {
-          Row(verticalAlignment = Alignment.CenterVertically) {
-            Text(it.label)
-            Row(modifier = Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.End) {
-              ThemedHybridSwitch(
-                variant = it.variant,
-                checked = it.value,
-                onCheckedChange = null,
-                colors = it.elementColors,
-                modifier = Modifier
-                  .padding(horizontal = 5.dp)
-                  .wrapContentSize(Alignment.CenterEnd)
-              )
-            }
-          }
-        },
-        modifier = Modifier.wrapContentSize(Alignment.Center),
-        onClick = {
-          dispatchers.switchCheckedChanged(
-            ContextMenuSwitchValueChangeEvent(!it.value, id)
-          )
-          expanded.value = false
-        }
-      )
-    }
-
-    element.submenu?.let {
-      HorizontalDivider()
-      FlatMenu(it.elements, it.button.text, dispatchers, expanded)
-    }
-  }
-}
-
-data class ContextMenuDispatchers(
-  val buttonPressed: ViewEventCallback<ContextMenuButtonPressedEvent>,
-  val switchCheckedChanged: ViewEventCallback<ContextMenuSwitchValueChangeEvent>
-)
-
-@Composable
-fun FunctionalComposableScope.ContextMenuContent(
-  props: ContextMenuProps,
-  onContextMenuButtonPressed: (ContextMenuButtonPressedEvent) -> Unit,
-  onContextMenuSwitchValueChanged: (ContextMenuSwitchValueChangeEvent) -> Unit,
-  onExpandedChanged: (ExpandedChangedEvent) -> Unit
-) {
-  val expanded = remember { mutableStateOf(false) }
-  val elements = props.elements
-  val color = props.color
-
-  // Provide expanded state to children via CompositionLocal
-  // This allows Button children to trigger menu expansion
-  CompositionLocalProvider(LocalContextMenuExpanded provides expanded) {
-    Box(modifier = ModifierRegistry.applyModifiers(props.modifiers, appContext, composableScope, globalEventDispatcher)) {
-      // Trigger button - Button will automatically expand menu when clicked
-      Children(ComposableScope())
-
-      DropdownMenu(
-        containerColor = color?.composeOrNull ?: MenuDefaults.containerColor,
-        expanded = expanded.value,
-        onDismissRequest = {
-          expanded.value = false
-          onExpandedChanged(ExpandedChangedEvent(false))
-        }
-      ) {
-        FlatMenu(
-          elements,
-          null,
-          dispatchers = ContextMenuDispatchers(
-            buttonPressed = onContextMenuButtonPressed,
-            switchCheckedChanged = onContextMenuSwitchValueChanged
-          ),
-          expanded = expanded
-        )
-      }
-    }
-  }
-}
-
-data class ExpandedChangedEvent(
-  @expo.modules.kotlin.records.Field val expanded: Boolean
-) : expo.modules.kotlin.records.Record